.mobile-brand{display:none}
.mobile-problem{display:none}
@media(max-width:600px){
  #problem>img{display:none}
  #problem .mobile-problem{display:block;position:relative;overflow:hidden;padding:32px 24px 48px;background:linear-gradient(#fcfbff,#efe8f8);color:#402b58;font-size:16px;line-height:1.9}
  #problem .mobile-problem h2{display:block;font-size:28px;line-height:1.6;margin:0 0 20px;padding:0;text-align:center}
  .mobile-problem article{background:#fffd;border:1px solid #e7dff0;border-radius:18px;padding:22px 20px;margin:22px 0;box-shadow:0 6px 20px #7f60a20a}
  .mobile-problem article::before{content:"";display:block;width:210px;max-width:100%;height:132px;margin:auto;background:url('../images/HP_2_problem.jpg') no-repeat;background-size:1536px 1024px;background-position-y:-225px}
  .mobile-problem article:nth-of-type(1)::before{background-position-x:-200px}
  .mobile-problem article:nth-of-type(2)::before{background-position-x:-670px}
  .mobile-problem article:nth-of-type(3)::before{background-position-x:-1120px}
  #problem .mobile-problem h3{font-size:20px;line-height:1.7;color:#694397;margin:20px 0 12px;text-align:center}
  .mobile-problem article p{margin:0 0 14px}
  .mobile-problem .problem-series{background:#f5f0fc;border-radius:10px;padding:12px;font-size:14px;color:#70519b;margin-bottom:0}
  .problem-mission{position:relative;padding-bottom:12px}
  .problem-mission ul{padding-left:22px;padding-right:58px}.problem-mission li{margin:10px 0;color:#694397;font-weight:600}
  .problem-mission::after{content:"";position:absolute;top:50px;right:-18px;width:72px;height:120px;background:url('../images/HP_2_problem.jpg') right bottom/460.8px 307.2px no-repeat;pointer-events:none;mask-image:linear-gradient(to right,transparent,#000 18%),linear-gradient(to bottom,transparent,#000 12%,#000 88%,transparent);mask-composite:intersect}
}
@media(max-width:600px){
  #safiora>img{display:none}
  #safiora .mobile-brand{display:block;position:relative;overflow:hidden;padding:28px 24px 36px;background:linear-gradient(#fcfaff,#f2eafa);color:#402369;font-size:16px;line-height:1.9;text-align:center}
  .mobile-brand-logo{position:relative;aspect-ratio:780/230;overflow:hidden;margin:0 0 24px}
  .mobile-brand-logo img{position:absolute;max-width:none;width:196.923%;height:auto;left:-44.872%;top:-260.87%}
  #safiora .mobile-brand h2{display:block;font-size:26px;line-height:1.65;margin:0 0 16px;padding:0}
  .mobile-brand-card{background:#fffc;border:1px solid #e7dbf2;border-radius:18px;padding:22px 20px;margin:20px 0;box-shadow:0 5px 20px #79599d0a}
  .mobile-brand-card::before{content:"";display:block;width:240px;max-width:100%;height:150px;margin:auto;background:url('../images/HP_3_Safiora.jpg') no-repeat;background-size:1536px 1024px;background-position-y:-240px}
  .mobile-brand-card:nth-of-type(2)::before{background-position-x:-220px}
  .mobile-brand-card:nth-of-type(3)::before{background-position-x:-645px}
  .mobile-brand-card:nth-of-type(4)::before{background-position-x:-1095px}
  #safiora .mobile-brand h3{font-size:21px;line-height:1.6;margin:16px 0 12px;color:#654192}
  .mobile-brand-card p{margin:0;text-align:left}
  .mobile-brand-closing{font-family:serif;font-size:21px;line-height:1.9;margin:30px 0}
  .mobile-brand>a{display:block;border:1px solid #ceb8e6;border-radius:10px;padding:12px;font-size:14px;color:#674195;text-underline-offset:4px;background:#fff9}
  .mobile-brand::after{content:"";position:absolute;right:0;bottom:0;width:22px;height:240px;background:url('../images/HP_3_Safiora.jpg') right bottom/768px 512px no-repeat;pointer-events:none}
}
