@charset "utf-8";

/* CSS Document */

/*common*/
.style-reset h3,
.style-reset h2{
    margin: 0;
    padding: 0;
}

.style-reset h2:before{
    content: none;
}

.style-reset img{
    width: auto;
}

.style-reset p{
    padding-bottom: 0;
}

/* ========================================================
   TIE UP
===========================================================*/
/*LOVEG*/
.topics-block-loveg {
    padding-bottom: 50px;
}
.loveg-bg {
    background: #f4f0e7;
    padding: 40px 50px;
    position: relative;
    color: #694f10;
}

.loveg-recipe{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.loveg-recipe li {
    position: relative;
    width: calc(50% - 20px);
    padding-bottom: 40px;
    display: flex;
    justify-content: space-between;
}

.loveg-recipe li:nth-of-type(n+5){
    padding-bottom: 0;
}

.loveg-recipe p {
    padding-right: 20px;
}

.loveg-recipe p span{
    display: block;
    font-weight: 700;
    border-bottom: 2px solid;
    width: 65px;
    margin-bottom: 10px;
}


.loveg-recipe li img{
    width: 160px;
    height: 160px;
}

.loveg-recipe li img + img{
    margin-left: 20px;
}

.loveg-2col-wrap{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.loveg-2col-img{
    width: calc(40% - 20px);
}

.loveg-2col-text{
    width: calc(60% - 20px);
}

.loveg-bg-inner{
    padding-bottom: 20px;
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.loveg-bg-inner p {
    line-height: 1.5;
}

.loveg-material-title{
    text-align: center;
    position: relative;
    padding: 2px 0 3px 0 !important;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 25px;
    background: #6d6248;
    color: #fff;
    width: 100%;
}

.loveg-material{
    width: calc(50% - 20px);
}

.loveg-material li {
    border-bottom: 1px dotted;
    padding-bottom: 5px;
    margin-bottom: 5px;
}

.loveg-material li:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.loveg-material-hosoku {
    width: calc(50% - 20px);
    background: #fffcf7;
    padding: 15px 20px;
}

.loveg-material-hosoku span{
    background: linear-gradient(transparent 60%, #f8de49 60%);
    font-weight: 700;
    margin-bottom: 5px;
    display: block;
    width: 55px;
}

.loveg-material-title span:before,.loveg-material-title span:after{
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background: #694f10;
    position: absolute;
}

.loveg-bg-line:before,
.loveg-bg-line:after{
    content: "";
    display: block;
    border: 1px solid #694f10;
    position: absolute;
}

.loveg-bg-line:before{
    top: 15px;
    left: 15px;
    width: calc(100% - 38px);
    height: calc(100% - 38px);
}

.loveg-bg-line:after{
    top: 22px;
    left: 22px;
    width: calc(100% - 52px);
    height: calc(100% - 52px);
}

@media screen and (max-width: 768px) {
.topics-block-loveg {
    padding-bottom: 30px;
}
.loveg-2col-wrap {
    display: block;
}

.loveg-2col-img,.loveg-2col-text,.loveg-material,.loveg-material-hosoku,.loveg-recipe li {
    width: 100%;
}

.loveg-2col-img {
    margin-bottom: 15px;
}

.loveg-material-title {
    font-size: 14px;
    margin-bottom: 10px;
}

.loveg-bg {
    padding: 25px 30px;
}

.loveg-bg-line:before{
    top: 10px;
    left: 10px;
    width: calc(100% - 25px);
    height: calc(100% - 25px);
}

.loveg-bg-line:after{
    top: 16px;
    left: 18px;
    width: calc(100% - 40px);
    height: calc(100% - 40px);
}

.loveg-material {
    margin-bottom: 15px;
}

.loveg-material-hosoku {
    padding: 15px 20px;
}

.loveg-recipe li {
    padding-bottom: 15px;
}

.loveg-recipe li:nth-of-type(n+5) {
    padding-bottom: 15px;
}

.loveg-recipe li:nth-of-type(6) {
    padding-bottom: 0;
}

.loveg-recipe li img {
    width: 25vw;
    height: 25vw;
    margin-top: 25px;
}

.loveg-recipe p {
    padding-right: 15px;
    padding-bottom: 0;
}

.loveg-recipe p span {
    border-bottom: 1px solid;
    margin-bottom: 5px;
}


}


/* ------------------------------------------
  Xmas
--------------------------------------------- */
.xmas-bg-green,.xmas-bg-red{
    background-size: 500px !important;
    padding: 30px;
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
}

.xmas-bg-green{
    background: url(../images/72/bg-green.png);
}

.xmas-bg-red{
    background: url(../images/72/bg-red.png);
}

.xmas-bg-green:before,.xmas-bg-green:after,
.xmas-bg-red:before,.xmas-bg-red:after{
    content: "";
    display: block;
    position: absolute;
    width: 243px;
    height: 181px;
}

.xmas-bg-green:before,.xmas-bg-green:after{
    background: url(../images/72/ribbon_red.png) no-repeat;
}

.xmas-bg-red:before,.xmas-bg-red:after{
    background: url(../images/72/ribbon_gold.png) no-repeat;
}

.xmas-bg-green:before,.xmas-bg-red:before{
    top: -40px;
    left: -40px;
}

.xmas-bg-green:after,.xmas-bg-red:after{
    bottom: -40px;
    right: -40px;
}

.xmas-bg-white {
    background: #fff;
    margin: 0;
}

.xmas-bg-white .topics-midashi-lv03 {
    color: #a58307;
    font-size: 18px;
}

.xmas-bg-white .topics-midashi-lv03 span{
    display: block;
    font-size: 14px;
    text-decoration: underline;
}

.xmas-bg-white p {
    line-height: 1.75;
}

.xmas-btn{
    display: inline-flex;
    width: 185px;
    height: 44px;
    align-items: center;
    text-align: center;
    justify-content: center;
    background: -webkit-linear-gradient(top, #ff3019 0%,#980000 100%);
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 500;
    border-radius: 24px;
    position: relative;
}

.xmas-btn:before{
    content: "";
    display: block;
    position: absolute;
    background: url(../images/72/btn-eyecatch.png) no-repeat;
    width: 75px;
    height: 38px;
    background-size: 75px;
    top: -18px;
    right: -20px;
}

.xmas-btn span{
    position: relative;
}

.xmas-btn span:before,.xmas-btn span:after{
    content: "";
    display: block;
    position: absolute;
    background: url(../images/72/kirakira.png) no-repeat;
    width: 40px;
    height: 40px;
    background-size: 41px;
}

.xmas-btn span:before{
    top: -20px;
    left: -30px;}

.xmas-btn span:after {
    bottom: -20px;
    right: -30px;
}

@media screen and (max-width: 768px){
.xmas-bg-green, .xmas-bg-red {
    background-size: 250px !important;
    padding: 15px;
    margin-bottom: 15px;
}

.xmas-bg-white{
    padding: 15px;
    margin: 0;
}

.xmas-bg-green:before, .xmas-bg-green:after, .xmas-bg-red:before, .xmas-bg-red:after {
    width: 120px;
    height: 90px;
    background-size: 120px !important;
}

.xmas-bg-green:before, .xmas-bg-red:before {
    top: -20px;
    left: -20px;
}

.xmas-bg-green:after, .xmas-bg-red:after {
    bottom: -20px;
    right: -20px;
}

.xmas-btn{
    display: flex;
    margin: 0 auto;
}


}

/* ------------------------------------------
  newyear
--------------------------------------------- */
.newyear-bg-red,.newyear-bg-gold{
    background-size: 94px !important;
    padding: 30px;
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
}

.newyear-bg-red{
    background: #a60001 url(../images/76/bg.png) repeat;
}

.newyear-bg-gold{
    background: #dcc36e url(../images/76/bg.png) repeat;
}

.newyear-bg-red:before,.newyear-bg-red:after,
.newyear-bg-gold:before,.newyear-bg-gold:after{
    content: "";
    display: block;
    position: absolute;
}

.newyear-bg-red:before,.newyear-bg-gold:before{
    background: url(../images/76/cloud01.svg) no-repeat;
    width: 209px;
    height: 76px;
    top: 0;
    right: -20px;
}

.newyear-bg-red:after,.newyear-bg-gold:after{
    background: url(../images/76/cloud02.svg) no-repeat;
    width: 257px;
    height: 76px;
    bottom: 50px;
    left: -50px;
}

.newyear-bg-white:after {
    content: "";
    display: block;
    position: absolute;
    background: url(../images/76/cloud03.svg) no-repeat;
    width: 257px;
    height: 76px;
    bottom: -5px;
    right: -50px;
}
.newyear-bg-white {
    background: #fff;
    margin: 0;
}

.newyear-bg-white .topics-midashi-lv03 {
    color: #a58307;
    font-size: 18px;
}

.newyear-bg-white .topics-midashi-lv03 span{
    display: block;
    font-size: 14px;
    text-decoration: underline;
}

.newyear-bg-white p {
    line-height: 1.75;
}

.newyear-btn{
    display: inline-flex;
    width: 185px;
    height: 44px;
    align-items: center;
    text-align: center;
    justify-content: center;
    background: -webkit-linear-gradient(top, #cf001d 0%,#810001 100%);
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 500;
    border-radius: 24px;
    position: relative;
}

.newyear-btn:before{
    content: "";
    display: block;
    position: absolute;
    background: url(../images/76/btn-eyecatch.svg) no-repeat;
    width: 26px;
    height: 23px;
    background-size: 26px;
    top: 3px;
    right: 11px;
}

@media screen and (max-width: 768px){
.newyear-btn {
    display: flex;
    margin: 0 auto;
}

.newyear-bg-white:after {
    bottom: -20px;
    right: inherit;
    left: -35px;
}

.newyear-bg-red:after,.newyear-bg-gold:after{
    content:none;
}

}



/* ------------------------------------------
  Valentine
--------------------------------------------- */
.vd-recipe {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.vd-recipe-item {
    width: 49%;
    background-size: auto auto;
    background-color: rgba(231, 205, 144, 1);
    background-image: repeating-linear-gradient(90deg, transparent, transparent 7px, rgba(255, 255, 255, 0.2) 7px, rgba(255, 255, 255, 0.2) 11px );
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    margin-bottom: 30px;
}

.vd-recipe-item:after {
    content: "";
    display: block;
    position: absolute;
    background-size: cover !important;
}

.vd-recipe-crunch:after {
    width: 212px;
    height: 256px;
    background: url(../images/90/img-crunch.png) no-repeat;
    bottom: -55px;
    left: 0;
}

.vd-recipe-snowball:after {
    width: 342px;
    height: 230px;
    background: url(../images/90/img-snowball.png) no-repeat;
    bottom: -40px;
    left: -125px;
}

.vd-recipe-tiramisu:after {
    width: 209px;
    height: 238px;
    background: url(../images/90/img-tiramisu.png) no-repeat;
    bottom: -45px;
    left: 0;
}

.vd-recipe-moose:after {
    width: 190px;
    height: 190px;
    background: url(../images/90/img-moose.png) no-repeat;
    bottom: 0px;
    left: 10px;
}

.vd-recipe-strawberry:after {
    width: 210px;
    height: 220px;
    background: url(../images/90/img-strawberry.png) no-repeat;
    bottom: -30px;
    left: 0;

}

.vd-recipe-title {
    display: flex;
    align-items: center;
    text-align: center;
    background: url(../images/90/recipe-bg.png) no-repeat;
    width: 100%;
    height: 180px;
    background-size: contain;
    margin: 0 !important;
}

.vd-recipe-shake:after {
    width: 193px;
    height: 318px;
    background: url(../images/90/img-shake.png) no-repeat;
    bottom: -126px;
    left: 10px;
}

.vd-recipe-title img {
    height: 90px;
    width: 100%;
    margin-top: -25px;
}

.vd-recipe-text {
    display: flex;
    align-items: center;
    padding: 0 25px 25px 220px;
    flex-wrap: wrap;
}

.vd-recipe-text p:first-child{
    display: flex;
    align-items: center;
    color: #551600;
    font-weight: 700;
    font-size: min(1.317vw, 18px);
    line-height: 1.5;
    padding-bottom: 10px;
    height: 120px;
}

.vd-btn {
    display: inline-flex;
    width: 185px;
    height: 44px;
    align-items: center;
    text-align: center;
    justify-content: center;
    background: #e97272;
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 500;
    border-radius: 24px;
    position: relative;
    font-size: 16px;
}

.vd-btn:after {
    content: "";
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5.5px 0 5.5px 8px;
    border-color: transparent transparent transparent #ffffff;
    right: 20px;
}

.vd-column {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-bottom: 2vw;
}

.vd-column-item {
    width: 49%;
    height: 190px;
    display: flex;
    align-items: center;
    background-size: auto auto;
    background-color: rgba(233, 144, 144, 1);
    background-image: repeating-linear-gradient(90deg, transparent, transparent 7px, rgba(255, 255, 255, 0.2) 7px, rgba(255, 255, 255, 0.2) 11px );
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    margin-bottom: 30px;
}

.vd-column-icon{
    position: absolute;
    width: 150px;
    left: -35px;
    top: -5px;
}

.vd-column-img {
    width: 200px;
}

.vd-column-title {
    display: flex;
    align-items: center;
    color: #551600;
    font-weight: 700 !important;
    font-size: min(1.317vw, 18px) !important;
    line-height: 1.5;
    padding-bottom: 10px;
}

.vd-column-text{
    padding-left: 25px;
}

.vd-column-text .vd-btn{
    background: #551600;
}



@media screen and (max-width: 768px){
.vd-recipe-item {
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.vd-recipe-title {
    display: flex;
    align-items: flex-start;
    width: 100%;
    height: 15vh;
    min-height: 115px;
    padding-top: 15px;
}

.vd-recipe-title img {
    height: 60px;
    width: 100%;
    margin-top: 0;
}

.vd-recipe-text {
    display: flex;
    align-items: center;
    padding: 0 20px 20px 0;
    flex-wrap: wrap;
    width: calc(100% - 135px);
}

.vd-recipe-text p:first-child {
    font-size: 14px;
    height: auto;
}

.vd-recipe-crunch:after {
    width: 150px;
    height: 165px;
    background: url(../images/90/img-crunch.png) no-repeat;
    bottom: 1vh;
    left: -15px;
}

.vd-recipe-snowball:after {
    width: 200px;
    height: 140px;
    background: url(../images/90/img-snowball.png) no-repeat;
    bottom: 0;
    left: -80px;
}

.vd-recipe-tiramisu:after {
    width: 140px;
    height: 160px;
    background: url(../images/90/img-tiramisu.png) no-repeat;
    bottom: 0vh;
    left: -10px;
}

.vd-recipe-moose:after {
    width: 135px;
    height: 138px;
    background: url(../images/90/img-moose.png) no-repeat;
    bottom: 0.5vh;
    left: 0;
}

.vd-recipe-strawberry:after {
    width: 130px;
    height: 160px;
    background: url(../images/90/img-strawberry.png) no-repeat;
    bottom: -0.5vh;
    left: 0;
}

.vd-recipe-shake:after {
    width: 120px;
    height: 200px;
    background: url(../images/90/img-shake.png) no-repeat;
    bottom: -6vh;
    left: 7px;
}

.vd-btn {
    width: 175px;
    height: 35px;
    font-size: 14px;
}

.vd-column-item {
    width: 100%;
    height: 140px;
    margin-bottom: 20px;
}

.vd-column-img {
    width: 150px;
}

.vd-column-text {
    padding: 20px;
    width: calc(100% - 150px);
}

.vd-column-title {
    font-size: 14px;
}
}
    
/* ------------------------------------------
  ORGANIC-Chocolate
--------------------------------------------- */
.organic-itemList {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.organic-item {
    width: 25%;
    border: 1px solid #ccc;
    border-right: none;
    box-sizing: border-box;
}


.organic-item:nth-child(4) {
    border-right: 1px solid #ccc;
}
.organic-item-title {
    background: #f1f1f1;
    text-align: center;
    border-bottom: 1px solid #ccc;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    height: 60px;
}

.organic-item-img{
    border-bottom: 1px solid #ccc;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    height: 160px;
}

.organic-item-text {
    padding: 10px;
}

.organic-item-text p {
    line-height: 1.75;
}

@media screen and (max-width: 768px){
.organic-itemList {
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.organic-item {
    width: 50%;
    margin-bottom: 20px;
}

.organic-item:nth-child(even) {
    border-right: 1px solid #ccc;
}

}

/* ------------------------------------------
  BDC COLLABORATION
--------------------------------------------- */
.bdc-collabo-bg {
    background: #f4f0e7;
    padding: 40px 50px;
    position: relative;
    color: #694f10;
}

.bdc-collabo-recipe{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.bdc-collabo-recipe li {
    position: relative;
    width: calc(50% - 20px);
    padding-bottom: 40px;
    display: flex;
    justify-content: space-between;
}

.bdc-collabo-recipe p {
    padding-right: 20px;
}

.bdc-collabo-recipe p span{
    display: block;
    font-weight: 700;
    border-bottom: 2px solid;
    width: 65px;
    margin-bottom: 10px;
}


.bdc-collabo-recipe li img{
    width: 160px;
}

.bdc-collabo-2col-wrap{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 30px;
}

.bdc-collabo-2col-img{
    width: calc(50% - 15px);
}

.bdc-collabo-2col-text{
    width: calc(50% - 15px);
}

.bdc-collabo-bg-inner{
    padding-bottom: 20px;
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.bdc-collabo-bg-inner p {
    line-height: 1.5;
}
    
.bdc-collabo-bg-inner-material{
    padding-bottom: 20px;
    position: relative;
    z-index: 2;
}

.bdc-collabo-material-title{
    text-align: center;
    position: relative;
    padding: 2px 0;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 25px;
    background: #6d6248;
    color: #fff;
    width: 100%;
}
    
.bdc-collabo-material-wrap:after{
    content: "";
    display: block;
    clear: both;
}

.bdc-collabo-material{
    width: calc(50% - 20px);
    float: left;
    margin-right: 20px;
    display: flex;
    flex-wrap: wrap;
}
    
.bdc-collabo-material:last-child{
    margin-left: 0;
}
    
.bdc-collabo-material dt,
.bdc-collabo-material dd{
    border-bottom: 1px dotted;
    padding-bottom: 5px;
    margin-bottom: 5px;   
}
    
.bdc-collabo-material dt {
    width: 80%;
}

.bdc-collabo-material dd {
    width: 20%;
}

.bdc-collabo-material-hosoku {
    padding-top: 10px;
}
    
.bdc-collabo-bg-line:before,
.bdc-collabo-bg-line:after{
    content: "";
    display: block;
    border: 1px solid #694f10;
    position: absolute;
}

.bdc-collabo-bg-line:before{
    top: 15px;
    left: 15px;
    width: calc(100% - 38px);
    height: calc(100% - 38px);
}

.bdc-collabo-bg-line:after{
    top: 22px;
    left: 22px;
    width: calc(100% - 52px);
    height: calc(100% - 52px);
}

/*accordion*/ 
.bdc-accordion-wrap{
    margin-bottom: 35px;
}
    
.bdc-accordion-trigger{
    background: #6d6248;
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    text-align: center;
    padding: 10px 0;
    position: relative;
    border-radius: 8px 8px 0 0;
    z-index: 5;
}

.bdc-accordion-trigger:after,
.bdc-accordion-trigger:before {
    content: "";
    display: block;
    width: 20px;
    height: 2px;
    border: 0;
    background: #fff;
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -2px -webkit-transition: all 0.3s 0s ease;
    transition: all 0.3s 0s ease;
}

.bdc-accordion-trigger:after {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.bdc-accordion-trigger.is-open:after {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.bdc-accordion-trigger.is-open:before {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.bdc-accordion-trigger + .bdc-accordion-contents {
    display: none;
}

.bdc-accordion-trigger:hover{
    cursor: pointer;
}    

@media screen and (max-width: 768px) {

.bdc-collabo-2col-wrap {
    display: block;
}

.bdc-collabo-2col-img,.bdc-collabo-2col-text,.bdc-collabo-material,.bdc-collabo-material-hosoku,.bdc-collabo-recipe li {
    width: 100%;
}

.bdc-collabo-2col-img {
    margin-bottom: 15px;
}

.bdc-collabo-material-title {
    font-size: 14px;
    margin-bottom: 10px;
}

.bdc-collabo-bg {
    padding: 25px 30px;
}

.bdc-collabo-bg-line:before{
    top: 10px;
    left: 10px;
    width: calc(100% - 25px);
    height: calc(100% - 25px);
}

.bdc-collabo-bg-line:after{
    top: 16px;
    left: 18px;
    width: calc(100% - 40px);
    height: calc(100% - 40px);
}

.bdc-collabo-material {
    margin-bottom: 15px;
}

.bdc-collabo-material-hosoku {
    padding: 15px 20px;
}

.bdc-collabo-recipe li {
    padding-bottom: 15px;
}

.bdc-collabo-recipe li img {
    width: 25vw;
    height: 25vw;
    margin-top: 25px;
}

.bdc-collabo-recipe p {
    padding-right: 15px;
    padding-bottom: 0;
}

.bdc-collabo-recipe p span {
    border-bottom: 1px solid;
    margin-bottom: 5px;
}
    
.bdc-accordion-trigger {
    font-size: 14px;
    padding: 10px 0;
}

.bdc-accordion-trigger:after, .bdc-accordion-trigger:before {
    width: 16px;
}

}

/* ------------------------------------------
  OASIS COLLABORATION
--------------------------------------------- */
.oasis-item{
    padding: 20px 30px 35px;  
    margin-bottom: 40px;
}

.oasis-midashi-lv03{
    width: 100%;
    font-size: 22px !important;
    text-align: center;
    border-bottom: 1px dotted;
    padding-bottom: 10px !important;
    margin-top: 0 !important;
    margin-bottom: 20px;
}

.oasis-midashi-lv03 span{
    background: #895400;
    color: #fff;
    font-size: 16px;
    padding: 0 10px;
    margin-right: 15px;
    border-radius: 15px;
}
    
.column-bg-beige .oasis-midashi-lv03　span{
    background: #895400;
}
    
.column-bg-red .oasis-midashi-lv03 span{
    background: #bd7272;
}

@media screen and (max-width: 768px) {
    .oasis-midashi-lv03 {
        font-size: 14px !important;
        margin-bottom: 0;
    }
    
    .oasis-midashi-lv03 span {
        font-size: 12px;
        display: block;
        width: fit-content;
        margin: 0 auto 5px;
    }
    
    .oasis-item {
        padding: 20px;
        margin-bottom: 20px;
    }
    
    .oasis-item .twoColumn-inner{
        margin-top: 15px;
    }
}

/* ------------------------------------------
  Golden Week
--------------------------------------------- */
.gw-ig-wrap{
    background: #f4f0e7;
    padding: 10px;
    margin-bottom: 4vw;
}

.gw-ig-item{
    width: calc(50% - 10px);
}

.gw-ig-line01{
    border: 1px solid #694f10;
    padding: 5px;
}

.gw-ig-line02{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border: 1px solid #694f10;
    padding: 5px 20px;
}

.gw-ig-item h3 {
    text-align: center;
    position: relative;
    padding: 2px 0 3px 0 !important;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 25px;
    background: #6d6248;
    color: #fff;
    width: 100%;
    margin-bottom: 10px;
}

.gw-kiji-wrap{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 4vw;
}

.gw-kiji-item{
    width: calc(50% - 10px);
    background: #f4f0e7;
    display: block;
}

.gw-kiji-card{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 20px;
    background: #f4f0e7;
}

.gw-kiji-thumbnail {
    width: 225px;
}

.gw-kiji-content {
    width: calc(100% - 250px);
}

.gw-kiji-title {
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 10px;
    color: #694f10;
}

.gw-kiji-btn{
    text-align: center;
    position: relative;
    padding: 2px 0 3px 0 !important;
    font-size: 16px;
    font-weight: 500;
    background: #6d6248;
    color: #fff !important;
    text-decoration: none !important;
    width: 100%;
    margin-top: 15px;
    display: block;
}

.gw-kiji-wrap p{
    width: 100%;
}

@media screen and (max-width: 768px) {
    .gw-ig-item {
        width: 100%;
        margin-bottom: 15px;
    }
    
    .gw-ig-item:last-child {
        margin-bottom: 0;
    }    
    
    .instagram-media{
        min-width: 100% !important;
        margin: 0 -1px !important;
        border-right: none !important;
        border-left: none !important;
    }
    
    .gw-ig-line02 {
        padding: 10px;
    }
    
    .gw-ig-item h3{
        padding: 5px 10px !important;
    }
    
    .gw-kiji-wrap{
        display: block;
    }

    .gw-kiji-item{
        width: 100%;
        margin-bottom: 15px;
    }
    
    .gw-kiji-thumbnail {
        width: 40%;
    }

    .gw-kiji-content {
        width: 55%;
    }
}

/*SOMEN22*/
.somen22 .topics-recipe-contents {
    background: none;
    padding: 0;
    position: relative;
}

.somen22-accordion{
    padding: 20px 0 0;
    width: 100%;
}

.somen22-accordion-trigger{
    color: #fff !important;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    padding: 5px 0;
    position: relative;
    border-radius: 8px 8px 0 0;
    z-index: 5;
}

.somen22 .topics-column{
    position: relative;
    padding: 20px 30px 35px;
    margin-bottom: 40px;
}

.somen22-midashi-lv03{
    text-align: center;
    width: 100%;
    margin-bottom: 15px;
    margin-top: 5px !important;
    font-size: 24px !important;
    color: #f28d5f;
}


.somen22-midashi-lv03 span {
    position: relative;
    display: inline-block;
}

.somen22-midashi-lv03 > span:after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 10px;
    background: #ffee82a5;
    position: absolute;
    bottom: 0;
    left: 0;
}

.somen22-midashi-lv03 span span {
    z-index: 2;
}

.somen22 .twoColumn-inner h4{
    color: #f28d5f;
}

.topics-column-num:after{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 60px 60px 0 0;
    content: "";
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
}

.topics-column-num span{
    color: #fff;
    position: absolute;
    top: 4px;
    left: 10px;
    z-index: 3;
    font-weight: 700;
}

.column-bg-somenYellow {
    background: #fffcee;
}

.column-bg-somenBlue {
    background: #effcff;
}

.somen22 .topics-column .somen22-accordion-trigger{
    background: #f28d5f;
}

.somen22 .topics-column .topics-recipe-contents li:before {
    background: #f28d5f;
}

.somen22 .topics-column .topics-column-num:after{
    border-color: #f28d5f transparent transparent transparent;
}

.somen22-accordion-trigger:after,
.somen22-accordion-trigger:before {
    content: "";
    display: block;
    width: 14px;
    height: 2px;
    border: 0;
    background: #fff;
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -2px -webkit-transition: all 0.3s 0s ease;
    transition: all 0.3s 0s ease;
}

.somen22-accordion-trigger:after {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.somen22-accordion-trigger.is-open:after {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.somen22-accordion-trigger.is-open:before {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.somen22-accordion-trigger + .somen22-accordion-cnt{
    display: none;
}

.somen22-accordion-trigger:hover{
    cursor: pointer;
}  

.somen22-accordion-cnt{
    padding: 20px;
    background: #ffffff8a;
}

.somen22 .topics-recipe-top-material dt {
    width: 70%;
}

.somen22 .topics-recipe-top-material dd {
    width: 30%;
}

@media screen and (max-width: 768px) {
    .somen22 .topics-column{
        padding: 20px;
        margin-bottom: 20px;
    }
    .somen22-midashi-lv03 {
        padding-bottom: 0 !important;
        margin-bottom: 20px;
        margin-top: 0 !important;
        font-size: 18px !important;
    }
    .somen22 .twoColumn-inner{
        margin-bottom: 15px;
    }
    .column-bg-somenBlue .somen22-midashi-lv03{
        order: 1;
    }
    .column-bg-somenBlue .twoColumn-inner:nth-of-type(2){
        order: 2;
    }
    .column-bg-somenBlue .twoColumn-inner:nth-of-type(1){
        order: 3;
    }
    .column-bg-somenBlue .somen22-accordion{
        order: 4;
    }
    .somen22-accordion {
        padding: 0;
    }
}

/*craft flour*/
.topics-column-flower {
	    align-items:flex-start;
}

.topics-column-flower .twoColumn-inner:nth-child(1){
	    width: calc(30% - 10px);
}

.topics-column-flower .twoColumn-inner:nth-child(2){
	width: calc(70% - 10px);
}

.interview{
    margin-bottom: 50px;
}

.interview dt,
.interview dd{
	position: relative;
    margin-bottom: 20px;
}

.interview dt:before,
.interview dd:before{
    content: "";
    display: block;
    width: 60px;
    height: 60px;
	position: absolute;
}

.interview dt:before{
	background:url(https://cosmosparkjn.jp/wp/wp-content/uploads/2022/09/craft03.png) no-repeat;
	background-size: 60px;
}

.interview dd:before{
	background:url(https://cosmosparkjn.jp/wp/wp-content/uploads/2022/09/craft02-4.png) no-repeat;
	background-size: 60px;
}

.interview p{
    background: #f9f9f9;
    padding: 20px !important;
    margin-left: 90px;
    border-radius: 6px;
}

@media screen and (max-width: 768px) {
.interview {
    margin-bottom: 30px;
}
.interview dt:before,
.interview dd:before{
    width: 50px;
    height: 50px;
}

.interview dt:before{
	background-size: 50px;
}

.interview dd:before{
	background-size: 50px;
}	
	
.interview p {
    padding: 15px !important;
    margin-left: 70px;
}
	
.topics-column-flower .twoColumn-inner:nth-child(1){
    width: 100%;
}

.topics-column-flower .twoColumn-inner:nth-child(2){
	width: 100%;
}
}

/*craft flour*/
.topics-column-poland{
	padding: 50px 30px;
	position:relative;
	margin-bottom: 25px;
}

.topics-column-poland .twoColumn-inner{
	width: calc(50% - 15px);
}

.topics-column-poland .topics-column:first-child{
	margin-bottom:25px;
}

.topics-column-poland:before,
.topics-column-poland:after{
    content: "";
    display: block;
    width: 100%;
    height:28px;
    position: absolute;
    background-size: 290px !important;
    left: 0;
}

.topics-column-poland-pink {
    background: #fff8f8;
}

.topics-column-poland-pink:before,
.topics-column-poland-pink:after {
    background: url(https://cosmosparkjn.jp/wp/wp-content/uploads/2022/09/trip-soup02.png);
}

.topics-column-poland-blue {
    background: #f5fdff;
}

.topics-column-poland-blue:before,
.topics-column-poland-blue:after {
    background: url(https://cosmosparkjn.jp/wp/wp-content/uploads/2022/09/trip-soup01.png);
}

.topics-column-poland:before{
    top: 0;
}

.topics-column-poland:after{
    bottom: 0;
}

@media screen and (max-width: 768px) {
	.topics-column-poland {
		padding: 40px 20px;align-content}
	
	.topics-column-poland .twoColumn-inner {
		width: 100%;
	}
	
	.topics-column-poland:before, .topics-column-poland:after {
		height: 23px;
		background-size: 240px !important;
	}
}

/* ------------------------------------------
  vocha_interview
--------------------------------------------- */
h2.vocha-title{
    text-align: center;
    padding-bottom: 50px;
}

.vocha-chapter + .vocha-chapter{
    padding-top: 70px;
}

.vocha-chapter:last-child {
    padding-bottom: 100px;
}

.vocha-chapter-img{
    padding-bottom: 30px;
}

.vocha-chapter-img img{
    width: 100%;
    height: auto;
}

.vocha-chapter-soshoku{
    text-align: center;
    padding-top: 20px;
    margin-bottom: -50px;
}

h3.vocha-chapter-title{
    text-align: center;
    padding-bottom: 40px;
}

.vocha-interview {
    display: flex;
    align-items: flex-end;
    width: 800px;
    margin: -20px auto 0;
}

.vocha-interview-text{
    padding: 0 0 0 30px;
}

.vocha-interview h4{
    font-size: 24px;
    font-weight: 500;
    color: #fe9797;
}

.vocha-interviewList {
    padding-top: 20px;
}

.vocha-interviewList-q{
    text-align: center;
    font-size: 22px;
    font-weight: 500;
    line-height: 1.5;
    display: block;
    position: relative;
    margin-bottom: 30px;
    background: #f5f5f5;
    padding: 20px 30px;
    border-radius: 12px;
}

.vocha-interviewList-q:after{
    border: solid transparent;
    content:'';
    height:0;
    width:0;
    pointer-events:none;
    position:absolute;
    border-top-width: 12px;
    border-bottom-width: 12px;
    border-left-width: 12px;
    border-right-width: 12px;
    margin-left: -12px;
    border-top-color: #f5f5f5;
    top: 100%;
    left:50%;
}

.vocha-interviewList-q span {
    display: block;
    line-height: 1;
}

.vocha-interviewList-q span img{
    width: 150px;
}

.vocha-interviewList-q small {
    font-size: 18px;
    font-weight: 400;    
    line-height: 1.5;
    display: inline-block;
}

.vocha-interviewList-a {
    padding-bottom: 50px;
    line-height: 2;
}

.vocha-interviewList-a:last-child {
    padding-bottom: 0;
}

.vocha-interviewList-soshoku{
    text-align: center;
    margin: 30px 0 -30px;
}

.vocha-link{
    display: flex;
    justify-content: space-between;
}

.vocha-link img{
    width: 470px;
    height: auto;
}

@media screen and (max-width: 768px) {
    h2.vocha-title {
        padding-bottom: 6.6vw;
    }
    h3.vocha-chapter-title {
        padding-bottom: 5vw;
    }
    .vocha-title img {
        width: 90vw;
    } 
    .vocha-chapter + .vocha-chapter {
        padding-top: 9vw;
    }
    .vocha-chapter:last-child {
        padding-bottom: 10vw;
    }
    img.vocha-chapter-title01{
        width: 68vw;
    }
    img.vocha-chapter-title02{
        width: 88.67vw;
    }
    img.vocha-chapter-title03{
        width: 68vw;
    }
    img.vocha-chapter-title04{
        width: 71.73vw;
    }
    img.vocha-chapter-title05{
        width: 71.73vw;
    }
    img.vocha-chapter-title06{
        width: 42.4vw;
    }
    .vocha-interview {
        display: block;
        width: 100%;
        margin: 0 auto;
    }
    .vocha-interview-img{
        text-align: center;
        padding-right: 10vw;
    }
    .vocha-interview-img img{
        width: 60vw;
    }
    .vocha-interview-text {
        padding: 5vw 0 0 0px;
    }
    .vocha-interview h4 {
        font-size: min(5.2vw,24px);
    }
    .vocha-interviewList-soshoku {
        text-align: center;
        margin: 2vw 0 -6vw;
    }
    .vocha-interviewList-soshoku img {
        width: 75vw;
    }
    .vocha-link{
        display: block;
    }
    .vocha-link li + li{
        padding-top: 3vw;
    } 
    .vocha-link img {
        width: 100%;
    }
    .vocha-interviewList {
        padding-top: 0;
    }
    .vocha-interviewList-q {
        font-size: min(3.8vw,22px);
        padding: 5vw 5vw;
    }
    .vocha-interviewList-q small {
        font-size: min(3.4vw,16px);
        padding-top: 1vw;
    }
    .vocha-interviewList-q span {
        padding-bottom: 1vw;
    }
    .vocha-interviewList-q span img {
        width: 35vw;
    }
    .vocha-interviewList-a {
        padding-bottom: 8vw;
    }
    
}



/* ------------------------------------------
  FM23
--------------------------------------------- */
.fm23{
    padding-bottom: 100px;
}

.fm23 .fm23-title{
    padding-bottom: 30px;
}

.fm23 .fm23-lead {
    text-align: center;
    padding-bottom: 60px;
    line-height: 1.75;
}

.fm23 .fm23-chapter-title img {
    width: 310px;
    margin-bottom: 15px;
}

.fm23 .fm23-chapter-title{
    text-align: center;
    font-size: 26px;
    font-weight: 500;
    color: #3b1106;
    letter-spacing: 2px;  
    padding-bottom: 30px;
}

.fm23-chapter-title-line{
    display: block;
}

.fd23-marker{
    background-image: linear-gradient(transparent 60%, #fee300 60%);
    background-image: -webkit-linear-gradient(transparent 60%, #fee300 60%);
    background-image: -moz-linear-gradient(transparent 60%, #fee300 60%);
    background-position: 0% bottom;
    background-size: 0% 100%;
    background-repeat: no-repeat;
    -webkit-transition: all 1.0s;
    transition: all 1.0s;
    display: inline;
    font-weight: 500;
}
 
.fd23-marker.animate{
  background-size: 100% 100%;
}

.fm23-chapter-img-l {
    padding-bottom: 20px;
}

.fm23-chapter + .fm23-chapter {
    padding-top: 80px;
}

.fm23-mokuji {
    position: relative;
    padding-bottom: 20px;
}

.fm23 .fm23-mokuji-title {
    text-align: center;
    position: relative;
    z-index: 2;
}

.fm23-mokuji-list {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    z-index: 2;
}

.fm23-mokuji-list li {
    width: 25%;
    padding-bottom: 10px;
}

.mokuji-thereeColumn li{
    width: 33%;
}

.fm23-mokuji-inner{
    overflow: hidden;
    position: relative;
    padding: 50px 40px 20px;
    background: url(https://cosmosparkjn.jp/wp/wp-content/themes/cosmosparkjn_2022/images/special-column/fm23_spring01/fm23-mokuji-bg.jpg);
    margin-top: -40px;
}

.fm23-chapter-inner + .fm23-chapter-inner{
    padding-top: 80px;
}

.fm23-mokuji-inner:before,
.fm23-mokuji-inner:after{
    content: "";
    display: block;
    position: absolute;
    background-size: cover !important;
}

.fm23-mokuji-inner:before{
    width: 120px;
    height: 80px;
    background: url(https://cosmosparkjn.jp/wp/wp-content/themes/cosmosparkjn_2022/images/special-column/fm23_spring01/mokuji-bg-sun.svg);
    top: -20px;
    left: 0px;
}

.fm23-mokuji-inner:after{
    width: 100px;
    height: 75px;
    background: url(https://cosmosparkjn.jp/wp/wp-content/themes/cosmosparkjn_2022/images/special-column/fm23_spring01/mokuji-bg-tori.svg);
    right: 0;
    top: 80px;
}

.fm23-chapter-map{
    padding-bottom: 40px;
}

.fm23 .fm23-chapter-title-lv4{
    font-size: 24px;
    color: #3b1106;
    font-weight: 500;
    text-align: center;
    margin-bottom: 30px;
}

.fm23-chapter-title-lv4 span {
    display: inline-block;
    position: relative;
    padding-bottom: 10px;
}


.fm23 .fm23-chapter-title-lv4 span:before{
    content: "";
    display: inline-block;
    width: 38px;
    height: 24px;
    background: url(https://cosmosparkjn.jp/wp/wp-content/themes/cosmosparkjn_2022/images/special-column/fm23_spring01/midashi-icon.svg) no-repeat center;
    margin-right: 10px;
    position: relative;
    top: 2px;
}

.fm23 .fm23-chapter-title-lv4 span:after{
    content: "";
    display: block;
    width: 100%;
    height: 5px;
    background: url(https://cosmosparkjn.jp/wp/wp-content/themes/cosmosparkjn_2022/images/special-column/fm23_spring01/midashi-dot.svg) repeat-x;
    position: absolute;
    left: 5px;
    bottom: 0;
}

.fm23-chapter-inner-col {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}

.fm23-chapter-inner-col + .fm23-chapter-inner-col {
    padding-top: 30px;
}

.fm23-chapter-inner-img {
    width: 470px;
}

.fm23-chapter-inner-img img {
    width: 100%;
}

.fm23-chapter-inner-text {
    width: 470px;
    line-height: 1.75;
}

.garapon{
    padding-top: 30px;
}

.garapon-acd{
    color: #3b1106;
    font-weight: 500;   
    padding-top: 20px;
    text-decoration: underline;
}

.garapon-acd:hover{
    cursor: pointer;
}

.garapon-cnt {
    background: #f9f9f9;
    padding: 30px 40px;
    display: none;
}

.garapon-cnt dt {
    color: #3b1106;
    font-weight: 500;
}

.garapon-cnt dd + dt {
    padding-top: 15px;
}

.fm23-chapter-enso {
    padding-top: 20px;
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.fm23-chapter-enso-item {
    width: 32.5%;
}

.fm23-chapter-enso-item img {
    width: 100%;
    height: auto;
}

.fm23-chapter-enso-item figcaption {
    padding-top: 10px;
}

.fm23-chapter-enso-item h4 {
    text-align: center;
    color: #e78a20;
}

.fm23-chapter-enso-item p {
    line-height: 1.5;
}

.fm23-04{
    text-align: center;
}

.fm23-04 .fm23-chapter-inner + .fm23-chapter-inner{
    padding-top: 40px;
}

.gallery-box {
    display: flex;
    flex-wrap: wrap;
    /* justify-content: space-between; */
}

.gallery-box li {
    width: 22%;
    margin: 2% 1% 0;
}

.gallery-box li img {
    width: 100%;
}

@media screen and (max-width: 750px) {
    .fm23-title img,
    .fm23-chapter-img-l img,
    .fm23-chapter-map img,
    .fm23-chapter-inner-img img{
        width: 100%;
        height: auto;
    }
    
    .fm23-chapter + .fm23-chapter {
        padding-top: 8vw;
    }
    
    .fm23-chapter-inner-img,
    .fm23-chapter-inner-text{
        width: 100%;
    }
    
    .fm23 .fm23-title {
        padding-bottom: 5vw;
    }
    
    .fm23 .fm23-lead {
        padding-bottom: 8vw;
    }
    
    .fm23 .fm23-chapter-title img {
        width: 55vw;
        margin-bottom: 2vw;
    }
    
    .fm23 .fm23-chapter-title {
        font-size: 4.8vw;
        padding-bottom: 6vw;
    }
    
    .fm23-chapter-img-l {
        padding-bottom: 3vw;
    }
    .fm23-mokuji {
        padding-bottom: 5vw;
    }
    .fm23-mokuji-title img {
        width: 65vw;
    }
    .fm23-mokuji-inner {
        padding: 10vw 4vw 4vw;
        margin-top: -7vw;
    }
    .fm23-mokuji-inner:before {
        width: 32vw;
        height: 21vw;
        top: -6vw;
        left: 0px;
    }
    .fm23-mokuji-inner:after {
        width: 20vw;
        height: 15vw;
        right: 0vw;
        top: inherit;
        bottom: -4vw;
    }
    .fm23-mokuji-list {
        justify-content: space-between;
    }
    .fm23-mokuji-list li {
        padding-bottom: 2vw;
        width: 47%;
    }
    .fm23 .fm23-chapter-title-lv4 {
        font-size: 4.8vw;
        margin-bottom: 5vw;
        padding-right: 0;
    }
    .fm23-chapter-title-lv4 span {
        padding-bottom: 3vw;
        text-indent: -4vw;
    }
    .fm23 .fm23-chapter-title-lv4 span:before {
            width: 12vw;
            height: 5.4vw;
            left: 0;
            top: 1vw;
            margin-right: 0;
    }
    .fm23 .fm23-chapter-title-lv4 span:after {
        width: 100%;
        height: 1vw;
        left: 0;
        bottom: 0;
    }
    .fm23-chapter-inner-img {
        margin-bottom: 3vw;
    }
    .fm23-chapter-inner-col + .fm23-chapter-inner-col {
        padding-top: 6vw;
    }
    .garapon {
        padding-top: 3vw;
    }
    .garapon-cnt {
        padding: 5vw 7vw;
    }
    .fm23-chapter-inner + .fm23-chapter-inner,
    .fm23-04 .fm23-chapter-inner + .fm23-chapter-inner{
        padding-top: 8vw;
    }
    
    .fm23-chapter-enso {
        padding-top: 3vw;
        display: block;
    }

    .fm23-chapter-enso-item {
        width: 100%;
    }

    .fm23-chapter-enso-item img {
        width: 100%;
        height: auto;
    }
    
    .fm23-chapter-enso-item + .fm23-chapter-enso-item{
        padding-top: 3vw;
    }

}