@charset "utf-8";
/*-----------------------------------------------
 * STAFFCAST
-------------------------------------------------*/
/**
* DECO
**/
.subSec__deco-handlegrid {
    top: max(calc(-8 / var(--vw-min) * 100vw),-8px);
    right: min(calc(100 / var(--vw-min) * 100vw),100px);
}
@media screen and (max-width:768px){
    .subSec__deco-handlegrid {
        top: calc(-120 / var(--vw-min) * 100vw);
        right: calc(26 / var(--vw-min) * 100vw);
    }
}
.subSec__deco-coffee {
    top: min(calc(376 / var(--vw-min) * 100vw),376px);
    right: min(calc(45 / var(--vw-min) * 100vw),45px);
}
@media screen and (max-width:768px){
    .subSec__deco-coffee {
        top: calc(185 / var(--vw-min) * 100vw);
        right: calc(33 / var(--vw-min) * 100vw);
    }
}
/**
* CONT
**/
.staffCast {
    padding-bottom: min(calc(160 / var(--vw-min) * 100vw),160px);
    overflow: hidden;
}
@media screen and (max-width:768px){
    .staffCast {
        padding:calc(86 / var(--vw-min) * 100vw) 0 calc(180 / var(--vw-min) * 100vw);
    }
}
.staffCastWrap {
    width: min(calc(1040 / var(--vw-min) * 100vw),1040px);
    margin: 0 auto;
    position: relative;
    z-index: 1;
}
@media screen and (max-width:768px){
    .staffCastWrap {
        width: 100%;
    }
}
.staffCast.subSec .cont-tit {
    margin-bottom: min(calc(10 / var(--vw-min) * 100vw),10px);
}
@media screen and (max-width:768px){
    .staffCast.subSec .cont-tit {
        margin-bottom: calc(60 / var(--vw-min) * 100vw);
    }
}
.subSec__tit {
    font-size: min(calc(34 / var(--vw-min) * 100vw),34px);
    color: var(--color-orange);
    font-weight: 800;
    line-height: 1;
    position: relative;
    margin: 0 auto min(calc(55 / var(--vw-min) * 100vw),55px);
}
@media screen and (max-width:768px){
    .subSec__tit {
        font-size: calc(30 / var(--vw-min) * 100vw);
        margin: 0 auto 0;
        padding-left: calc(78 / var(--vw-min) * 100vw);
    }
}
.staffCast__cast .subSec__tit {
    margin-bottom: 0;
}
.subSec__tit span {
    position: relative;
	display: inline-block;
}
.staffCast__staff .subSec__tit::before {
    content: "";
    width: min(calc(532 / var(--vw-min) * 100vw),532px);
    height: min(calc(462 / var(--vw-min) * 100vw),462px);
    display: block;
    position: absolute;
    top: max(calc(-230 / var(--vw-min) * 100vw),-230px);
    left: max(calc(-230 / var(--vw-min) * 100vw),-230px);
    opacity: 0;
    transform: translate(-100px, -100px);
    transition: .5s ease;
    -webkit-filter: drop-shadow(13px 15px 14px #6a664f);
    filter: drop-shadow(13px 15px 14px #6a664f);
    background: url(../img/common/deco/deco_blackpan.png)no-repeat center/contain;
}
@media screen and (max-width:768px){
    .staffCast__staff .subSec__tit::before {
        width: calc(410 / var(--vw-min) * 100vw);
        height: calc(357 / var(--vw-min) * 100vw);
        top: calc(-186 / var(--vw-min) * 100vw);
        left: calc(-95 / var(--vw-min) * 100vw);
    }
}
.staffCast__cast .subSec__tit {
    opacity: 0;
    transition: .5s ease;
}
.staffCast__cast .subSec__tit::before {
    content: "";
    width: min(calc(248 / var(--vw-min) * 100vw),248px);
    height: min(calc(248 / var(--vw-min) * 100vw),248px);
    display: block;
    position: absolute;
    top: max(calc(-113 / var(--vw-min) * 100vw),-113px);
    left: max(calc(-80 / var(--vw-min) * 100vw),-80px);
    background: url(../img/common/deco/deco_plate2.png)no-repeat center/contain;
}
@media screen and (max-width:768px){
    .staffCast__cast .subSec__tit::before {
        width: calc(207 / var(--vw-min) * 100vw);
        height: calc(207 / var(--vw-min) * 100vw);
        top: calc(-92 / var(--vw-min) * 100vw);
        left: calc(20 / var(--vw-min) * 100vw);
    }
}
.staffCastLists {
    display: flex;
    flex-wrap: wrap;
    opacity: 0;
    transform: translateY(100px);
    transition: .5s ease;
}
.staffCast__staff .staffCastLists {
    justify-content: center;
}
@media screen and (max-width:768px){
    .staffCastLists {
        padding: 0 calc(54 / var(--vw-min) * 100vw);
    }
}
.staffCastItem {
    width: calc(100% / 3);
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: min(calc(60 / var(--vw-min) * 100vw), 60px);    
}
@media screen and (max-width:768px){
    .staffCastItem {
        width: calc(100% / 2);
        margin-bottom: calc(60 / var(--vw-min) * 100vw);
    }
}
.staffCastItem-dt {
    font-size: min(calc(20 / var(--vw-min) * 100vw),20px);
    line-height: 1.2;
    font-weight: 800;
    display: inline-block;
    border-radius: min(calc(10 / var(--vw-min) * 100vw),10px);
    padding: min(calc(10 / var(--vw-min) * 100vw),10px) min(calc(22 / var(--vw-min) * 100vw),22px);
    margin-bottom: min(calc(20 / var(--vw-min) * 100vw),20px);
    background-color: var(--color-orange);
}
@media screen and (max-width:768px){
    .staffCastItem-dt {
        font-size: calc(20 / var(--vw-min) * 100vw);
        border-radius: calc(10 / var(--vw-min) * 100vw);
        padding: calc(10 / var(--vw-min) * 100vw) calc(15 / var(--vw-min) * 100vw);
    }
}
.staffCastItem-dd {
    font-size: min(calc(30 / var(--vw-min) * 100vw),30px);
    line-height: 1.5;
    text-align: center;
    font-weight: 800;
    display: flex;
    align-items: center;
}
@media screen and (max-width:768px){
    .staffCastItem-dd {
        font-size: calc(30 / var(--vw-min) * 100vw);
    }
}
.staffCastItem.--column .staffCastItem-dd {
    flex-direction: column;
}
.staffCastItem-dd-s {
    font-size: min(calc(16 / var(--vw-min) * 100vw),16px);
    line-height: 1.5;
    font-weight: 800;
    text-align: center;
    display: block;
    margin-top: min(calc(20 / var(--vw-min) * 100vw),20px);
}
@media screen and (max-width:768px){
    .staffCastItem-dd-s {
        font-size: calc(20 / var(--vw-min) * 100vw);
        margin-top: calc(20 / var(--vw-min) * 100vw);
    }
}
.staffCastItem.--column .staffCastItem-dd {
    flex-direction: column;
}
.staffCastItem.--w2 {
    width: calc(100% / 1);
}
.staffCastItem.--w3 {
    width: calc(100% / 2);
}
.staffCast__cast {
    padding-top: min(calc(106 / var(--vw-min) * 100vw),106px);
}
@media screen and (max-width:768px){
    .staffCast__cast {
        padding-top: calc(76 / var(--vw-min) * 100vw);
    }
    .staffCastItem.--w3 {
        width: calc(100% / 1);
    }
}
.staffCast__cast .staffCastLists {
    margin-top: max(calc(-20 / var(--vw-min) * 100vw),-20px);
}
@media screen and (max-width:768px){
    .staffCast__cast .staffCastLists  {
        margin-top: 0;
    }
    .staffCast__cast .staffCastItem {
        width: calc(100% / 3);
    }
}
.staffCastItem.--first {
    width: 100%;
}
/*-----------------------------------------------
 * アニメーション
-------------------------------------------------*/
body.--is-subload .staffCast__staff .subSec__tit::before {
    opacity: 1;
    transform: translate(0, 0);
	transition-delay: 1.5s;
}
body .staffCast__staff .subSec__tit span {
    opacity: 0;
    transition: .4s ease-in-out;
}
body.--is-subload .staffCast__staff .subSec__tit span {
    opacity: 1;
    transition-delay: 1.5s;
}
body.--is-subload .staffCast__cast .subSec__tit {
    opacity: 1;
    transition-delay: 1.5s;
}
body.--is-subload .staffCastLists {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 1.5s;
}