/* --------------------------------------------------
Top
-------------------------------------------------- */
body { background: #fff; }

/* --------------------------------------------------
Look
-------------------------------------------------- */
@keyframes cross1 { 0% { transform: translate(-50%, -50%) rotate(0); }
  100% { transform: translate(-50%, -50%) rotate(20deg); } }
@keyframes cross2 { 0% { transform: translate(-50%, -50%) rotate(0); }
  100% { transform: translate(-50%, -50%) rotate(-20deg); } }
@keyframes cross1Rev { 0% { transform: translate(-50%, -50%) rotate(20deg); }
  100% { transform: translate(-50%, -50%) rotate(0); } }
@keyframes cross2Rev { 0% { transform: translate(-50%, -50%) rotate(-20deg); }
  100% { transform: translate(-50%, -50%) rotate(0); } }
body #wrapper { padding-top: 0; }
body #wrapper .issue-contents { background-image: url("../images/no17/dust.webp"), linear-gradient(180deg, #DCD7CB 0%, #949EAE 100%); background-size: 100% auto, 100% 100%; }
body #wrapper .issue-contents .contents-wrapper { position: relative; }
body #wrapper .issue-contents .contents-wrapper .titlearea { position: absolute; left: 0; right: 0; top: 17.18vw; text-align: center; font-family: trade-gothic-next-compressed, sans-serif; color: #FFFFFF; z-index: 2; }
body #wrapper .issue-contents .contents-wrapper .titlearea h2 { font-size: 7.69vw; line-height: 1.6; letter-spacing: 0.02em; }
body #wrapper .issue-contents .contents-wrapper .titlearea .sub-title { font-size: 4.36vw; letter-spacing: 0.02em; }
body #wrapper .issue-contents .contents-wrapper .panel-wrapper .panel { position: absolute; }
body #wrapper .issue-contents .contents-wrapper .panel-wrapper .panel a { display: block; }
body #wrapper .issue-contents .contents-wrapper .panel-wrapper .panel .imagearea { position: relative; }
body #wrapper .issue-contents .contents-wrapper .panel-wrapper .panel .imagearea::after { display: block; content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.15); opacity: 0; transition: opacity 0.6s ease 0s; z-index: 2; }
body #wrapper .issue-contents .contents-wrapper .panel-wrapper .panel .textarea { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; justify-content: center; align-items: center; font-family: trade-gothic-next-compressed, sans-serif; color: #FFFFFF; font-size: 5.64vw; letter-spacing: 0.02em; z-index: 3; }
body #wrapper .issue-contents .contents-wrapper .panel-wrapper .panel.is-focus .imagearea::after { opacity: 1; }
body #wrapper .issue-contents .contents-wrapper .staff-credit { position: absolute; left: 0; bottom: 0; padding: 6.15%; font-size: 3.08vw; line-height: 1.33; letter-spacing: 0.02em; }

@media screen and (orientation: landscape) { body #wrapper .issue-contents { background-size: 75rem auto, 100% 100%; }
  body #wrapper .issue-contents .contents-wrapper .titlearea { top: 50%; transform: translate(0, -50%); }
  body #wrapper .issue-contents .contents-wrapper .titlearea h2 { font-size: 2.71vw; }
  body #wrapper .issue-contents .contents-wrapper .titlearea .sub-title { font-size: 1.35vw; }
  body #wrapper .issue-contents .contents-wrapper .panel-wrapper .panel .textarea { font-size: 1.35vw; }
  body #wrapper .issue-contents .contents-wrapper .staff-credit { padding: 1.35% 4.17%; font-size: 0.83vw; }
  body #wrapper .issue-contents .contents-wrapper .staff-credit br { display: none; } }