﻿html {
  scroll-behavior: smooth;
}

img {
  display: block;
  width: 100%;
}

a {
  transition: .3s ease;
}

a:hover {
  opacity: 0.7;
}

#wrap {
  margin: 0 auto;
  position: relative;
  max-width: 750px;
}

/* fixed bnr
------------------------------------------------------*/

#wrap #fixedBtn {
  max-width: 100%;
  width: min(750px, calc(750 / 750 * 100vw));
  bottom: 0;
  position: fixed;
  z-index: 99;
  text-align: center;
}

/* cv
------------------------------------------------------*/

.cv .btn_area {
  position: relative;
}

.cv .btn_area a {
  width: 100%;
  max-width: min(655px, calc(655 / 750 * 100vw));
  top: 0;
  right: 0;
  left: 0;
  display: block;
  position: absolute;
  text-align: center;
  margin: auto;
}

/* movie
------------------------------------------------------*/
.movie_area {
  position: relative;
}
.movie_area .movie {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  margin: auto;
  display: block;
  width: min(690px, calc(690 / 750 * 100vw));

  &::before {
    content: "";
    display: block;
    padding-top: calc(315 / 560 * 100%);
  }

  iframe {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: auto;
  }
}
