/* CSS Document */
/* **************************************************************************************

project : popup

************************************************************************************** */
.popup {
  position: fixed;
  opacity: 0;
  z-index: 100;
  transition: opacity 0.3s; }

@media screen and (max-width: 767px) {
  .popup {
    bottom: 60px;
    right: 20px; }

  .popup img {
    height: auto;
    width: 42.66667vw; }

  .popup_close {
    position: relative;
    display: block; }

  .popup_close span {
    cursor: pointer;
    position: absolute;
    right: -15px;
    top: -20px;
    height: 40px;
    width: 40px;
    background: #fff;
    border: 1px solid #333;
    border-radius: 40px; }

  .popup_close span::before, .popup_close span::after {
    position: absolute;
    left: 50%;
    top: 50%;
    content: '';
    height: 22px;
    width: 3px;
    background: #333; }

  .popup_close span::before {
    transform: translate(-50%, -50%) rotate(45deg);
    -webkit-transform: translate(-50%, -50%) rotate(45deg); }

  .popup_close span::after {
    transform: translate(-50%, -50%) rotate(-45deg);
    -webkit-transform: translate(-50%, -50%) rotate(-45deg); } }
@media print, screen and (min-width: 768px) {
  .popup {
    bottom: 40px;
    right: 60px; }

  .popup img {
    height: auto;
    width: 280px; }

  .popup_close {
    position: relative;
    display: block; }

  .popup_close span {
    cursor: pointer;
    position: absolute;
    right: -15px;
    top: -20px;
    height: 40px;
    width: 40px;
    background: #fff;
    border: 1px solid #333;
    border-radius: 40px; }

  .popup_close span::before, .popup_close span::after {
    position: absolute;
    left: 50%;
    top: 50%;
    content: '';
    height: 22px;
    width: 3px;
    background: #333; }

  .popup_close span::before {
    transform: translate(-50%, -50%) rotate(45deg);
    -webkit-transform: translate(-50%, -50%) rotate(45deg); }

  .popup_close span::after {
    transform: translate(-50%, -50%) rotate(-45deg);
    -webkit-transform: translate(-50%, -50%) rotate(-45deg); } }