html {
position: relative;
min-height: 100%;
overflow-y: scroll;
font-size: 62.5% !important;
}
html a,
html a:link,
html a:visited {
text-decoration: none;
}
.wrapper {
min-width: 1200px;
overflow: hidden;
width: 100%;
position: relative;
}
.pc-only {
display: inline-block;
}
.sp-only {
display: none;
}
.mv {
position: relative;
z-index: 1;
}
.mv img {
width: 100%;
}
.zip__cv {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: fixed;
bottom: -5px;
left: 0;
width: 100%;
z-index: 10;
-webkit-transform: translateY(100px);
transform: translateY(100px);
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.zip__cv.zip__cv__button_soon-soldout {
background-color: #999999;
}
.zip__cv.is-animated {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.zip__cv__text {
background-color: #fff;
width: 57.3%;
width: 50%;
width: 61%;
text-align: right;
}
.zip__cv__text img {
max-width: 750px;
max-width: 884px;
width: 100%;
}
.zip__cv__button {
width: 42.7%;
width: 50%;
width: 39%;
}
.zip__cv__button a {
display: block;
background-color: #fa7cdf;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.zip__cv__button a:hover {
opacity: 0.9;
}
.zip__cv__button a img {
max-width: 556px;
width: 100%;
}
@media screen and (max-width: 767px) {
/* zip__cv */
.zip__cv {
background: #fa7cdf;
margin-top: -1px;
}
.zip__cv.is-animated .zip__cv__button {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.zip__cv.zip__cv__button_soon-soldout {
background-color: #999999;
}
.zip__cv__button {
position: fixed;
bottom: 0;
z-index: 10;
-webkit-transition: all 0.3s;
transition: all 0.3s;
-webkit-transform: translateY(100px);
transform: translateY(100px);
width: 100%;
}
.zip__cv__button a {
text-align: center;
}
.zip__cv__button a img {
max-width: 556px;
width: 100%;
display: inline-block;
}
}
#zip2024 {
width: 100%;
padding: 4px;
padding: 0;
margin: 0 auto;
color: #333333;
font-family: "Noto Sans Javanese", sans-serif;
}
/* @media screen and (max-width: 767px) {
#zip2024 {
padding-top: 68px;
}
} */
#zip2024 .isActv .fadein {
opacity: 1;
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
#zip2024 .main-wrap {
font-family: "Noto Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
-webkit-font-feature-settings: "palt";
font-feature-settings: "palt";
}
#zip2024 .main-wrap img {
width: 100%;
max-width: 100%;
}
#zip2024 .main-wrap .ff-mplus {
font-family: "M PLUS Rounded 1c", sans-serif;
}
#zip2024 .main-wrap .ff-mplus p {
letter-spacing: 0.03em;
}
#zip2024 .main-wrap .common {
max-width: 1200px;
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .common {
width: 90%;
width: 92%;
max-width: none;
}
}
#zip2024 .main-wrap .obi {
text-align: center;
line-height: 1;
}
#zip2024 .main-wrap .obi.obi-yellow {
background: #fffb3b;
color: #fa7cdf;
}
#zip2024 .main-wrap span.ff-red {
color: #fd0015;
}
#zip2024 .main-wrap p.txt-ntv {
text-align: right;
margin-top: 10px;
font-size: 2rem;
color: #666;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap p.txt-ntv {
font-size: 1.2rem;
margin-top: 5px;
}
}
#zip2024 .main-wrap a:hover {
text-decoration: none;
}
#zip2024 .main-wrap .btn-wrap .btn-wrap-inner {
width: 412px;
margin-left: auto;
margin-right: auto;
position: relative;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .btn-wrap .btn-wrap-inner {
width: 300px;
width: 206px;
width: 100%;
}
}
#zip2024 .main-wrap .btn-wrap a.btn-buy {
display: block;
width: 100%;
background: #fa7cdf;
text-align: center;
padding: 16px 0;
color: #fff;
font-size: 2.4rem;
font-weight: 500;
border-radius: 35px;
position: relative;
z-index: 2;
-webkit-transition: 0.3s;
transition: 0.3s;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .btn-wrap a.btn-buy {
padding: 12px 0;
padding: 8px 0;
}
}
#zip2024 .main-wrap .btn-wrap a.btn-buy:hover {
-webkit-transform: translateY(10px);
transform: translateY(10px);
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .btn-wrap a.btn-buy:hover {
-webkit-transform: none;
transform: none;
}
}
#zip2024 .main-wrap .btn-wrap a.btn-buy span {
position: relative;
padding-left: 34px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .btn-wrap a.btn-buy span {
font-size: 2rem;
padding-left: 22px;
}
}
#zip2024 .main-wrap .btn-wrap a.btn-buy span::before {
position: absolute;
display: block;
width: 34px;
height: 29px;
background: url(/images/zip2024/icon-cart.png) no-repeat center top/contain;
content: "";
left: -14px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .btn-wrap a.btn-buy span::before {
width: 25px;
height: 22px;
left: -10px;
}
}
#zip2024 .main-wrap .btn-wrap .btn-soon-soldout {
display: block;
width: 100%;
background: #999999;
text-align: center;
padding: 16px 0;
color: #fff;
font-size: 2.4rem;
font-weight: 500;
border-radius: 35px;
position: relative;
z-index: 2;
-webkit-transition: 0.3s;
transition: 0.3s;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .btn-wrap .btn-soon-soldout {
padding: 8px 0;
}
}
#zip2024 .main-wrap .btn-wrap .btn-soon-soldout span {
position: relative;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .btn-wrap .btn-soon-soldout span {
font-size: 2rem;
}
}
#zip2024 .main-wrap .btn-wrap .shadow {
display: block;
width: 412px;
height: 67px;
border-radius: 35px;
background: #00b5d7;
opacity: 0.2;
position: absolute;
bottom: -10px;
z-index: 1;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .btn-wrap .shadow {
width: 100%;
height: 45px;
bottom: -5px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
}
#zip2024 .main-wrap .intro-wrap {
background: url(/images/zip2024/bg-intro.jpg) no-repeat center top/cover;
padding: 85px 0;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap {
padding: 40px 0 80px;
}
}
#zip2024 .main-wrap .intro-wrap .intro-ttl {
padding: 0 145px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap .intro-ttl {
padding: 0;
}
}
#zip2024 .main-wrap .intro-wrap .intro-ttl .obi {
border-radius: 30px;
padding: 20px 0 15px;
font-weight: 600;
font-size: 2.8rem;
margin-top: 23px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap .intro-ttl .obi {
font-size: 1.8rem;
padding: 10px 0 8px;
margin-top: 10px;
}
}
#zip2024 .main-wrap .intro-wrap .intro-sentence {
padding: 60px 0 0;
text-align: center;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap .intro-sentence {
padding: 30px 0 0;
padding: 18px 0 0;
}
}
#zip2024 .main-wrap .intro-wrap .intro-sentence p {
font-weight: 600;
font-size: 2.8rem;
line-height: 1.75;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap .intro-sentence p {
font-size: 1.4rem;
line-height: 1.5;
}
}
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-box-sentence {
margin-top: 16px;
}
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-box-sentence p {
font-size: 3.6rem;
background: #fff;
display: inline-block;
padding: 0 12px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-box-sentence p {
font-size: 1.5rem;
padding: 0 6px;
}
}
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-box-sentence p span.ff-red {
font-size: 4rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-box-sentence p span.ff-red {
font-size: 2rem;
}
}
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-box-sentence p+p {
margin-top: 12px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-box-sentence p+p {
margin-top: 8px;
}
}
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-image-wrap {
margin-top: 85px;
}
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-image-wrap .txt-ntv {
text-align: right;
margin-top: -28px;
font-size: 2rem;
color: #666;
font-weight: 300;
padding-right: 23px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-image-wrap .txt-ntv {
font-size: 1.2rem;
margin-top: 5px;
padding-right: 6px;
margin-top: -7px;
}
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap .intro-sentence .intro-image-wrap {
margin-top: 40px;
margin-top: 30px;
}
}
#zip2024 .main-wrap .intro-wrap .intro-sentence .btn-wrap {
margin-top: 50px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .intro-wrap .intro-sentence .btn-wrap {
margin-top: 25px;
}
}
#zip2024 .main-wrap .story-wrap {
background: url(/images/zip2024/bg-story.jpg) no-repeat center/cover;
}
#zip2024 .main-wrap .story-wrap .story-inner .story-ttl {
background: #4bd1fb;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-ttl {
display: block;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-ttl .ttl-txt {
font-size: 2.8rem;
font-weight: 500;
color: #fff;
position: relative;
padding-left: 176px;
padding-top: 24px;
padding-bottom: 24px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-ttl .ttl-txt {
font-size: 1.6rem;
padding-left: 0;
width: 90%;
width: 92%;
margin-left: auto;
margin-right: auto;
padding-top: 12px;
padding-bottom: 12px;
text-align: center;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-ttl .ttl-txt::before {
position: absolute;
left: 0;
display: inline-block;
content: url(/images/zip2024/icon-story.png);
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-ttl .ttl-txt::before {
content: "";
width: 60px;
height: 60px;
background: url(/images/zip2024/icon-story.png) no-repeat center/contain;
top: -6px;
left: -6px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-ttl span.big {
font-size: 4.8rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-ttl span.big {
font-size: 2rem;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-ttl span.medium {
font-size: 3.6rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-ttl span.medium {
font-size: 1.8rem;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap {
background: url(/images/zip2024/img-chips01.png) no-repeat bottom -3% left/31%;
padding-bottom: 150px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap {
padding-bottom: 10px;
background: none;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head {
padding-top: 110px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head {
padding-top: 43px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head.story-contents-head-ribbon {
padding-top: 16vw;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head.story-contents-head-ribbon {
padding-top: 30vw;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt-ribbon {
max-width: 855px;
margin-left: auto;
margin-right: auto;
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt {
width: 41%;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt {
width: 100%;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt p {
font-size: 3.6rem;
color: #2a9fda;
font-weight: 600;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt p {
font-size: 1.8rem;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt p span {
font-size: 2.4rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt p span {
font-size: 1.8rem;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt p.logo {
max-width: 352px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt p.logo {
max-width: 108px;
margin-left: auto;
margin-right: auto;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt p+p {
margin-top: 38px;
line-height: 2;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-txt p+p {
margin-top: 19px;
line-height: 1.5;
font-size: 2.2rem;
text-align: center;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-image {
width: 58%;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-head .story-contents-head-inner .story-contents-head-image {
width: 100%;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .arrow-box {
text-align: center;
margin-top: 60px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .arrow-box {
margin-top: 30px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .arrow-box img {
max-width: 190px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .arrow-box img {
max-width: 100px;
margin-left: auto;
margin-right: auto;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 {
margin-top: 63px;
}
@media screen and (max-width: 1300px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 {
padding: 0 1%;
}
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 {
padding: 0;
margin-top: 30px;
margin-top: 43px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-ttl {
background: #4bd1fb;
border-radius: 13px 13px 0 0;
padding: 30px 0;
text-align: center;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-ttl {
padding: 15px 1%;
border-radius: 7px 7px 0 0;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-ttl p {
font-size: 3.6rem;
font-weight: 600;
color: #fff;
line-height: 1;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-ttl p {
font-size: 1.8rem;
line-height: 1.2;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail {
padding: 60px 30px;
border-radius: 0 0 13px 13px;
background: #fff;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail {
padding: 30px 20px 26px;
border-radius: 0 0 7px 7px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .image-flex-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .image-flex-box {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .image-flex-box img {
max-width: 557px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .image-flex-box img {
width: 100%;
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .image-flex-box img+img {
margin-top: 20px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .txt-box {
margin-top: 30px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .txt-box {
margin-top: 15px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .txt-box p {
font-size: 2.4rem;
font-weight: 500;
letter-spacing: 0.03em;
text-align: center;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .txt-box p {
font-size: 1.4rem;
text-align: left;
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .txt-box p span.ff-red {
font-size: 1.4rem;
}
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 {
background: #fff;
border-radius: 7px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner {
border-radius: 13px;
position: relative;
padding-top: 60px;
padding-left: 48px;
padding-bottom: 25px;
margin-top: 48px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner {
margin-top: 24px;
padding-top: 30px;
padding-left: 0;
padding-right: 0;
padding-bottom: 0;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner::before {
position: absolute;
width: 1000px;
height: 500px;
background: #fff;
content: "";
display: block;
left: 0;
top: 0;
border-radius: 13px 13px 0 0;
z-index: 0;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner::before {
width: 100%;
display: none;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner::after {
position: absolute;
width: 1000px;
height: 173px;
background: #ffeffc;
content: "";
display: block;
left: 0;
bottom: 0;
border-radius: 0 0 13px 13px;
z-index: 1;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner::after {
width: 100%;
display: none;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .flex-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: relative;
z-index: 2;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .flex-box {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
width: 100%;
max-width: 291px;
margin-left: auto;
margin-right: auto;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .image-box {
max-width: 273px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .image-box {
max-width: 130px;
text-align: right;
margin-left: auto;
margin-right: auto;
width: 100%;
position: absolute;
right: -32px;
top: -55px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .image-box p {
margin-top: 8px;
font-size: 1.8rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .image-box p {
font-size: 1rem;
margin-top: 4px;
padding-right: 30px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .txt-box {
padding-left: 35px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .txt-box {
padding-left: 0;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .insta-box {
position: absolute;
right: 0;
top: -96px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
z-index: 2;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .insta-box {
position: relative;
top: auto;
display: block;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .insta-box p {
font-size: 1.8rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .insta-box p {
font-size: 1rem;
max-width: 250px;
margin-left: auto;
margin-right: auto;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .insta-box .image {
max-width: 438px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .insta-box .image {
max-width: 250px;
margin-left: auto;
margin-right: auto;
margin-top: 7px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-wh {
color: #2a9fda;
padding-bottom: 100px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-wh {
padding-bottom: 50px;
padding-bottom: 40px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-wh .obi {
display: inline-block;
background: #c6f6fe;
font-size: 2.2rem;
line-height: 1;
padding: 6px 16px 4px 20px;
border-radius: 22px;
font-weight: 500;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-wh .obi {
padding: 4px 12px 2px 14px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-wh .obi span {
display: inline-block;
margin-top: 11px;
margin-top: auto;
margin-bottom: 5px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-wh .obi span {
font-size: 1.4rem;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-wh .txt {
font-size: 3rem;
font-weight: 600;
margin-top: 18px;
letter-spacing: 0.03em;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-wh .txt {
font-size: 2rem;
margin-top: 13px;
line-height: 1.5;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-pink {
color: #df4fc0;
padding-top: 20px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-pink {
background: #ffeffc;
padding-bottom: 20px;
margin-top: 37px;
border-radius: 0 0 7px 7px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-pink .txt {
font-size: 2.8rem;
font-weight: 600;
letter-spacing: 0.07em;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap .story-contents-inner .story-contents-box .story-contents-box-inner .story-contents-box-item02 .story-contents-box-item02-inner .bg-pink .txt {
font-size: 1.7rem;
text-align: center;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 {
background: url(/images/zip2024/img-chips03.png) no-repeat left bottom -3%/40%, url(/images/zip2024/img-chips02.png) no-repeat right top 29%/35%, url(/images/zip2024/bg-blue.png) no-repeat center top/cover;
padding-bottom: 260px;
}
@media screen and (max-width: 1400px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 {
background: url(/images/zip2024/img-chips03.png) no-repeat left bottom -3%/40%, url(/images/zip2024/img-chips02.png) no-repeat right top 29%/35%, url(/images/zip2024/bg-blue.png) no-repeat center top/117%;
}
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 {
padding-bottom: 70px;
background: url(/images/zip2024/img-chips03.png) no-repeat left bottom -5%/66%, url(/images/zip2024/bg-blue.png) no-repeat center top/250%;
}
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .big-blue.big-blue02 {
font-size: 2rem !important;
color: #2a9fda;
text-align: center !important;
line-height: 1.5;
font-weight: 600 !important;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .obi-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .obi-box .obi {
background: #ffeffc;
color: #df4fc0;
font-size: 3rem;
font-weight: 400;
display: inline-block;
padding: 20px 60px;
border-radius: 37px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .obi-box .obi {
font-size: 1.4rem;
padding: 8px 16px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .image-box {
max-width: 1048px;
margin-left: auto;
margin-right: auto;
margin-top: 54px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .image-box {
margin-top: 30px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box {
max-width: 1048px;
margin-left: auto;
margin-right: auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-top: 50px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box {
max-width: none;
width: 100%;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-top: 33px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .image-box {
width: 47%;
margin: 0;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .image-box {
width: 100%;
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .image-box.zip-image {
margin-top: 20px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box {
width: 49%;
text-align: center;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box {
width: 100%;
margin-top: 0;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box .big-blue {
font-size: 3.6rem;
color: #2a9fda;
font-weight: 600;
letter-spacing: 0.06em;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box .big-blue {
font-size: 2rem;
line-height: 1.5;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box .black {
font-size: 2.2rem;
letter-spacing: 0.03em;
font-weight: 600;
line-height: 2;
margin-top: 30px;
letter-spacing: 0.06em;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box .black {
font-size: 1.6rem;
font-size: 1.4rem;
line-height: 1.7;
text-align: center;
margin-top: 0;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box .black .pink {
color: #f37a8f;
font-size: 3rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box .black .pink {
font-size: 1.8rem;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box .black .green {
color: #009a3a;
font-size: 3rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box .black .green {
font-size: 1.8rem;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box .black .big {
font-size: 3.6rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box .txt-box .black .big {
font-size: 1.8rem;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent {
margin-top: 80px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent {
margin-top: 18px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent .image-box {
width: 54%;
width: 57%;
margin-left: -24px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent .image-box {
margin-left: auto;
margin-right: auto;
width: 100%;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent .image-box p {
padding-left: 41px;
font-size: 1.8rem;
margin-top: 14px;
font-weight: 500;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent .image-box p {
font-size: 1.2rem;
padding-left: 0;
margin-top: 8px;
font-weight: 400;
text-align: center;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent .txt-box p {
font-size: 4.8rem;
color: #2a9fda;
font-weight: 600;
position: relative;
top: -40px;
left: 29px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent .txt-box p {
left: auto;
top: auto;
font-size: 2rem;
text-align: center;
line-height: 1.5;
margin-top: 20px;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent .txt-box p span.date {
font-size: 9.5rem;
line-height: 1;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent .txt-box p span.date {
font-size: 2.8rem;
}
}
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent .txt-box p span.thu {
display: inline-block;
position: relative;
top: -18px;
left: 4px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .story-wrap .story-inner .story-contents-wrap.story-contents-wrap02 .story-contents-inner .story-contents-box-item01 .story-contents-box-item01-inner .story-contents-box-item01-detail .flex-box.talent .txt-box p span.thu {
font-size: 2rem;
top: -2px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner {
padding: 0 1%;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner {
padding: 0 2%;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-ttl h2 {
text-align: center;
padding: 34px 0;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-ttl h2 {
padding: 20px 0;
width: 90%;
width: 92%;
margin-left: auto;
margin-right: auto;
margin-bottom: 0;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-ttl h2 img {
max-width: 870px;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item {
padding: 100px 100px 124px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item {
padding: 50px 0 60px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item .item-contents-box-item-inner {
max-width: 1200px;
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item .item-contents-box-item-inner {
max-width: none;
width: 90%;
width: 92%;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item .item-contents-box-item-inner .ttl .obi-box .obi {
font-size: 3rem;
font-weight: 500;
color: #fff;
background: #2a9fda;
border-radius: 31px;
padding: 16px 0;
margin-top: 30px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item .item-contents-box-item-inner .ttl .obi-box .obi {
font-size: 1.5rem;
padding: 7px 0 8px;
margin-top: 16px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item .item-contents-box-item-inner .flex-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item .item-contents-box-item-inner .flex-box {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item .item-contents-box-item-inner .flex-box .item {
width: 50%;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item .item-contents-box-item-inner .flex-box .item {
width: 100%;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item .item-contents-box-item-inner .flex-box .item .image-box {
text-align: center;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip {
background: url(/images/zip2024/bg-zpp.jpg) no-repeat center top/100%;
padding-bottom: 120px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip {
background: url(/images/zip2024/img-chips05_sp.png) no-repeat right bottom 1%/63%, url(/images/zip2024/img-chips04_sp.png) no-repeat left bottom 40%/63%, url(/images/zip2024/bg-zpp_sp.jpg) no-repeat center top/cover;
padding-bottom: 145px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .ttl h3 {
text-align: center;
padding-right: 27px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .ttl h3 {
padding-right: 0;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .ttl h3 img {
max-width: 664px;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .ttl .obi-box .obi {
max-width: 657px;
margin-left: auto;
margin-right: auto;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box {
-webkit-box-pack: space-evenly;
-ms-flex-pack: space-evenly;
justify-content: space-evenly;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .image-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding-left: 17px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .image-box img {
width: 464px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .image-box img {
width: 180px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .txt-box {
margin-top: -46px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .txt-box {
background: #fff;
padding-top: 60px;
padding-bottom: 40px;
margin-top: -55px;
width: 100%;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .txt-box .ttl {
text-align: center;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .txt-box .ttl {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .txt-box .ttl img {
width: 316px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .txt-box .ttl img {
width: 160px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .txt-box .txt {
font-size: 2.2rem;
text-align: center;
font-weight: 400;
margin-top: 35px;
line-height: 1.8;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item .txt-box .txt {
font-size: 1.4rem;
text-align: left;
max-width: 270px;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item.item-ebi {
padding-right: 60px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item.item-ebi {
padding-right: 0;
margin-top: 40px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item.item-macha {
padding-left: 60px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .flex-box .item.item-macha {
padding-left: 0;
margin-top: 40px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box {
margin-top: 55px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box {
margin-top: 156px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner {
background: #fff;
border-radius: 13px;
padding-top: 17px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner {
padding-left: 15px;
padding-left: 20px;
padding-right: 15px;
padding-right: 20px;
border-radius: 7px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .flex-box {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .image-box {
width: 268px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .image-box {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .image-box .miso {
max-width: 134px;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .image-box .icon-recipe {
max-width: 130px;
margin-right: 10px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .txt-box {
padding-right: 70px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .txt-box {
padding-right: 0;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .txt-box .bulue {
font-size: 3.6rem;
color: #2a9fda;
font-weight: 600;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .txt-box .bulue {
font-size: 2rem;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .txt-box .black {
font-size: 2.2rem;
font-weight: 600;
margin-top: 30px;
line-height: 1.8;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .txt-box .black {
font-size: 1.4rem;
font-weight: 400;
margin-top: 20px;
}
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .txt-box .black+.black {
margin-top: 0;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .image-fukidashi-box {
padding-top: 40px;
padding-bottom: 50px;
background: #fff9ec;
border-radius: 0 0 13px 13px;
margin-top: 25px;
text-align: center;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .image-fukidashi-box {
background: none;
border-radius: 0;
padding-top: 0;
margin-top: 38px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.zip .item-contents-box-item-inner .recipe-box .recipe-box-inner .image-fukidashi-box img {
width: 940px;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp {
background: url(/images/zip2024/bg-kpp.jpg) no-repeat center top/cover;
margin-top: 30px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp {
background: url(/images/zip2024/bg-kpp_sp.jpg) no-repeat center top/cover;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .ttl h3 {
text-align: center;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .ttl h3 img {
width: 562px;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .ttl .obi-box .obi {
max-width: 558px;
margin-left: auto;
margin-right: auto;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box {
margin-top: 80px;
-webkit-box-pack: space-evenly;
-ms-flex-pack: space-evenly;
justify-content: space-evenly;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box {
margin-top: 60px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item {
margin-right: 10px;
margin-left: 0;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item {
margin-right: auto;
margin-left: auto;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .image-box {
position: relative;
z-index: 2;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .image-box {
padding-left: 17px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .image-box img {
width: 350px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .image-box img {
width: 100%;
max-width: 205px;
margin-left: auto;
margin-right: auto;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .txt-box {
margin-top: -46px;
color: #fee658;
background: #d5001a;
padding-top: 108px;
padding-bottom: 122px;
position: relative;
top: -76px;
z-index: 1;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .txt-box {
padding-bottom: 40px;
padding-top: 60px;
top: -17px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .txt-box .ttl {
text-align: center;
font-size: 2.4rem;
font-weight: 500;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .txt-box .ttl {
font-size: 1.4rem;
line-height: 1.5;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .txt-box .ttl span.flavor {
font-size: 3.6rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .txt-box .ttl span.flavor {
font-size: 2.4rem;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .txt-box .txt {
font-size: 2rem;
text-align: center;
font-weight: 400;
margin-top: 35px;
line-height: 1.8;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item .txt-box .txt {
font-size: 1.4rem;
text-align: left;
color: #fff;
margin-top: 18px;
max-width: 304px;
margin-left: auto;
margin-right: auto;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item.item-gs {
margin-right: 0;
margin-left: 10px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item.item-gs {
margin-right: auto;
margin-left: auto;
margin-top: 60px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .flex-box .item.item-gs .txt-box {
color: #ffd06d;
background: #171515;
padding-bottom: 50px;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .image-fukidashi-box {
text-align: center;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .image-fukidashi-box {
margin-top: 16px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .image-fukidashi-box img {
width: 1005px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .image-fukidashi-box img {
width: 100%;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box {
margin-top: 70px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box {
margin-top: 40px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner {
background: #fff;
padding: 60px 0 80px;
border-radius: 13px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner {
padding: 30px 0 40px;
border-radius: 7px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .ttl .obi {
background: #fee658;
width: 500px;
padding: 12px 0;
border-radius: 26px;
font-size: 3rem;
font-weight: 600;
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .ttl .obi {
width: calc(100% - 40px);
font-size: 1.4rem;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin-top: 50px;
}
@media screen and (max-width: 1300px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box {
padding: 2%;
}
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box {
width: 100%;
margin-left: auto;
margin-right: auto;
padding-left: 20px;
padding-right: 20px;
margin-top: 20px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .image-box {
width: 563px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .image-box {
width: 100%;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box {
padding-left: 50px;
width: 37%;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box {
width: 100%;
padding-left: 0;
margin-top: 20px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .ttl {
font-size: 2.4rem;
font-weight: 600;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .ttl {
font-size: 1.5rem;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .txt {
font-size: 2.2rem;
font-weight: 400;
margin-top: 30px;
line-height: 1.8;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .txt {
font-size: 1.4rem;
margin-top: 20px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .btn-box {
margin-top: 45px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .btn-box {
margin-top: 30px;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .btn-box a {
display: block;
width: 280px;
background: #171515;
color: #fff;
font-size: 2rem;
text-align: center;
padding: 12px 0;
letter-spacing: 0.08em;
-webkit-transition: 0.3s;
transition: 0.3s;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .btn-box a {
width: 100%;
max-width: 167px;
margin-left: auto;
margin-right: auto;
font-size: 11px;
padding: 9px 0;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .btn-box a:hover {
opacity: 0.8;
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .btn-box a span {
position: relative;
padding-right: 18px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .btn-box a span {
font-size: 1.2rem;
}
}
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .btn-box a span::after {
content: "";
position: absolute;
width: 21px;
height: 18px;
background: url(/images/zip2024/icon-link.png) no-repeat center top/contain;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
right: -9px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .item-wrap .item-inner .item-contents-box .item-contents-box-inner .item-contents-box-item.kpp .item-contents-box-item-inner .kpp-box .kpp-box-inner .flex-box .txt-box .btn-box a span::after {
width: 14px;
height: 12px;
right: 0;
}
}
#zip2024 .main-wrap .lineup-wrap {
padding: 118px 0;
margin-top: 30px;
background: url(/images/zip2024/bg-intro.jpg) no-repeat center top/cover;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap {
padding: 60px 0;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner {
max-width: 1205px;
margin-left: auto;
margin-right: auto;
background: #fff;
border-radius: 13px;
padding: 60px 0 50px;
position: relative;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner {
max-width: none;
width: 90%;
width: 92%;
padding: 27px 0 40px;
border-radius: 7px;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner::before {
position: absolute;
display: block;
content: "";
width: 130px;
height: 130px;
background: url(/images/zip2024/icon-onlineLimitted.png) no-repeat center top/contain;
top: -82px;
left: -10px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner::before {
width: 76px;
height: 76px;
left: -8px;
top: -53px;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
width: 100%;
margin-left: auto;
margin-right: auto;
padding: 0 20px;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .image-box {
width: 48%;
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .image-box .txt-ntv {
text-align: left;
font-size: 2rem;
color: #666;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .image-box .txt-ntv {
font-size: 1.2rem;
margin-top: 5px;
}
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .image-box {
width: 100%;
margin-top: 15px;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box {
width: 34%;
padding-left: 80px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box {
width: 100%;
padding-left: 0;
}
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .ttl h2 img {
max-width: 200px;
margin-left: auto;
margin-right: auto;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .ttl .flex-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
margin-top: 24px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .ttl .flex-box {
display: block;
text-align: center;
margin-top: 17px;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .ttl .flex-box .txt-blue {
color: #2a9fda;
font-size: 2.4rem;
font-weight: 600;
line-height: 1.3;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .ttl .flex-box .txt-blue {
font-size: 1.8rem;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .ttl .flex-box .txt-blue span {
font-size: 4.8rem;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .ttl .flex-box .txt-blue span {
font-size: 3.6rem;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .ttl .flex-box .txt-blue.txt-blue02 {
font-size: 1.8rem;
font-weight: 400;
margin-bottom: 10px;
margin-left: 4px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .ttl .flex-box .txt-blue.txt-blue02 {
font-size: 1.6rem;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .lineup-detail {
margin-top: 20px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .lineup-detail {
margin-top: 17px;
}
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .lineup-detail dl {
background: #f5f5f5;
padding: 20px 15px;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .lineup-detail dl dt {
font-weight: 600;
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .lineup-detail dl dt span.thin {
font-weight: 400;
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .lineup-detail dl dt:nth-of-type(2) {
margin-top: 14px;
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .lineup-detail dl dd {
padding-left: 16px;
margin-top: 10px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .lineup-detail dl dd {
margin-top: 0;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .lineup-detail dl dd+dd {
margin-top: 6px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .lineup-detail dl dd+dd {
margin-top: 0;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .zip_price {
margin-top: 30px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .zip_price {
margin-top: 28px;
}
}
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .btn-wrap {
margin-top: 25px;
}
@media screen and (max-width: 767px) {
#zip2024 .main-wrap .lineup-wrap .lineup-inner .flex-box .contents-box .btn-wrap {
margin-top: 22px;
}
}
#zip2024 .zip_formIntro-wrap {
padding-top: 70px;
position: relative;
}
#zip2024 .zip_formIntro-wrap span#fornarea {
position: absolute;
top: -14px;
}
@media screen and (max-width: 767px) {
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner {
width: 90%;
width: 92%;
margin-left: auto;
margin-right: auto;
}
}
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner h2 {
text-align: center;
}
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner h2 img {
width: 590px;
}
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner .obi-box .obi {
width: 600px;
background: #fffb3b;
color: #fa7cdf;
font-size: 2.4rem;
text-align: center;
font-weight: 600;
border-radius: 20px;
padding: 8px 0;
margin-left: auto;
margin-right: auto;
margin-top: 16px;
}
@media screen and (max-width: 767px) {
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner .obi-box .obi {
width: 100%;
font-size: 1.5rem;
padding: 5px 0;
margin-top: 10px;
}
}
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner .txt {
font-size: 3.4rem;
text-align: center;
color: #2a9fda;
font-weight: 600;
line-height: 1.1;
margin-top: 30px;
}
@media screen and (max-width: 767px) {
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner .txt {
font-size: 1.7rem;
line-height: 1.1;
margin-top: 15px;
}
}
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner .txt span.big {
font-size: 6rem;
}
@media screen and (max-width: 767px) {
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner .txt span.big {
font-size: 3rem;
}
}
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner .txt span.medium {
font-size: 5rem;
}
@media screen and (max-width: 767px) {
#zip2024 .zip_formIntro-wrap .zip_formIntro-inner .txt span.medium {
font-size: 2.4rem;
}
}
@media screen and (max-width: 767px) {
.pc-only {
display: none;
}
.sp-only {
display: block;
}
#zip2024 {
width: initial;
max-width: 100%;
margin: 0 auto;
font-family: "Noto Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}
#zip2024 h2 {
margin-bottom: 30px;
letter-spacing: 0.025em;
}
}
@media screen and (max-width: 767px) and (max-width: 767px) {
#zip2024 h2 {
margin-bottom: 0;
}
}
@media screen and (max-width: 767px) {
#zip2024 p {
font-size: 16px;
line-height: 1.8;
letter-spacing: 0.01em;
}
#zip2024 .content_inner {
width: 92%;
margin: 0 auto;
text-align: center;
}
}
.caution {
margin-top: 25px;
}
.caution>p {
font-size: 14px;
}
.caution2 {
margin-top: 25px;
}
.caution2>p {
font-size: 14px;
line-height: 1.6;
letter-spacing: 0.06em;
}
@media screen and (max-width: 767px) {
.caution {
margin-top: 22px;
}
.contents-box>.caution>p {
font-size: 12px !important;
}
.caution2 {
margin-top: 22px;
}
.caution2>p {
font-size: 12px !important;
line-height: 1.8;
letter-spacing: 0.01em;
font-weight: 400;
}
}