.ib-bana-bg {
display: none;
max-width: 1000px;
margin: 0 auto;
margin-top: 0.5rem;
margin-bottom: 0.5rem;

}

.ib-bana-bg-waku {
padding: .5rem 1rem;
border: 1px dashed #1f1f1f;


}

.ib-bana-flex {
display: flex;
align-items: center;
}

.ib-bana-fig {
width: 23%;
margin: 0;
padding-top: 2rem;
}

.ib-bana-dl {
width: 77%;
padding-left: 0.5rem;
padding-bottom:1rem;
}

.ib-bana-dl>dt {
font-size: 1.1rem;
letter-spacing: 4.5px;
font-weight: bold;
line-height: 1.2;
border-bottom: 1px solid #1f1f1f;
padding-bottom: 0.5rem;
}

.ib-bana-dl>dd {
font-size: .9rem;
margin-left: 0;
line-height: 1.3;
padding-top: 0.5rem;
}

.ib-bana-dl>dd strong {
background: linear-gradient(transparent 60%, #FF88A6 60%);
font-weight: 700;
border-bottom: 1px dashed;
padding: 0 4px 3px;
}

.ib-bana-btn {
display: block;
margin-left: auto;
margin-right: auto;
background-color: #ffff33;
border: none;
}

.ib-bana-btn-lab {
width: 14rem;
font-size: 1rem;
border: 1px solid #1f1f1f;
background-color: #ffff33;
border-radius: 1.5rem;
text-align: center;
margin-left: auto;
margin-right: auto;
padding: 0.3rem;
box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);
position: relative;
cursor: pointer;
}

.ib-bana-btn-lab::before,
.ib-bana-btn-lab::after {
content: "";
position: absolute;
border-top: 1px dashed #1f1f1f;
width: 8rem;
height: 1px;
transform: translate(-50%, -50%);
top: 55%;
}

.ib-bana-btn-lab::before {
left: -4.2rem;
}

.ib-bana-btn-lab::after {
right: -12.2rem;
}

.ib-bana-ul {
display: flex;
align-items: center;
flex-wrap: wrap;
justify-content: center;
background-color: #ffc;
border-radius: 0.5rem;
margin-bottom: 0.5rem; 

text-align:center;

}



input[type="checkbox"] {
display: none;
}

label[for="id-img-all"] {
display: block;
background: #ffff33;
}

.dropdown {
display: none;
}

#id-img-all:checked+.dropdown {
display: flex;
}


.ib-bana-btn-lab-span {
position: relative;
}


.ib-bana-btn-lab-span::after {
content: "";
display: inline-block;
position: absolute;
border-top: #000 2px solid;
border-left: #000 2px solid;
transform: rotate(225deg);
width: 0.5rem;
height: 0.5rem;
top: 0.1rem;
right: -2rem;
}



.flipLeft {
animation-name: flipLeftAnime;
animation-duration: 1s;
animation-fill-mode: forwards;
perspective-origin: left center;
opacity: 0;
background-color: #FFFF33;
padding: .5rem;
margin-top: 2rem;

display: block;
}

@keyframes flipLeftAnime {
from {
transform: perspective(600px) translate3d(3rem, 3rem, 0) rotateY(30deg);
opacity: 0;
}

to {
transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg);
opacity: 1;
}
}
.ib-bana-ul li {
width: 33%;
height: auto;
padding: 1rem 1rem 0;
}

.ib-bana-ul li:last-of-type {
width: 27%;
}

@media (min-width: 728px) {

.ib-bana-btn-lab::before,
.ib-bana-btn-lab::after {
width: 11.4rem;
}

.ib-bana-btn-lab::before {
left: -5.9rem;
}

.ib-bana-btn-lab::after {
right: -17.3rem;
}

.ib-bana-dl>dt {
font-size: 1.6rem;
letter-spacing: 7.5px;
}

.ib-bana-btn-lab {
width: 16rem;
font-size: 1.2rem;
}

.ib-bana-ul li {
width: 15%;
}

.ib-bana-ul li:last-of-type {
width: 13%;
}

.ib-bana-dl {
width: 80%;
padding-left: 1rem;
}


.ib-bana-fig {
width: 20%;
height: 9rem;
padding: 1rem;
}
}

/*20240830*/
.mw-1200 {max-width: 1200px;}
.ffff66-linear {background: linear-gradient(transparent 60%, #ffff66 60%);font-weight: 700;}
@media screen and (max-width: 1199px) {
.id-01-warp {margin-top: -17%;margin-left: 1rem;margin-right: 1rem;display: block;}
.id-01-warp p {background: rgba(255, 255, 255, 0.8);padding: 2rem;font-size: 14px;line-height: 2;}
.id-01-warp-hd {display: block;font-weight: 700;font-size: 16px;border-bottom: solid 1px;margin-bottom: 1rem;}
.id-01-sp-bg {background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/idcard/id-sp-01.webp);background-size: contain;background-repeat: no-repeat;padding-top: 66.5%;}
.pc-block {display: none;}
.sp-block {display: block;}
}
@media screen and (min-width: 1200px) {
.id-01-switch {padding-top: 2rem;background-size: auto auto;background-color: rgba(255, 255, 255, 1);background-image: repeating-linear-gradient(135deg, transparent, transparent 10px, rgba(252, 245, 128, 1) 10px, rgba(252, 245, 128, 1) 25px)}
.id-01-warp {margin-top: -2%;margin-left: 2rem;margin-right: 2rem;z-index: 2;}
.id-01-warp p {background: rgba(255, 255, 255, 0.8);padding-top: 3rem;padding-bottom: 2rem;padding-left: 10%;padding-right: 10%;font-size: 16px;line-height: 2;margin: 0 auto;max-width: 1200px;z-index: 1;}
.id-01-warp-hd {display: block;font-weight: 700;font-size: 20px;border-bottom: solid 1px;margin-bottom: 1rem;}
.pc-block {display: block;}
.sp-block {display: none;}
}