@charset 'UTF-8';
#Wrap {width: 100%;}
#Contents-All {font-feature-settings: 'palt'; text-align: justify; text-justify: inter-ideograph;} 
a:hover {cursor: pointer; opacity: 0.8;}
.relative-area {
  position: relative;
}
@font-face {
  font-family: 'josefinsans';
  src: url(../font/JosefinSans-VariableFont_wght.ttf );
}
@font-face {
  font-family: 'optima';
  src: url(../font/OPTIMA.TTF );
}
/*************************************SP****************************************/
@media screen and ( max-width:560px ) {
  /* #Contents-All {
    background-image: url(../img/sp.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position-y: -43px;
  } */
  #Contents-All .back-txt {
    font-family: 'josefinsans' !important;
    font-size: calc(22*(100vw/750));
    letter-spacing: 1px;
    position: fixed;
    /* top: calc(1280*(100vw/750)); */
    right: calc(64*(100vw/750));
    bottom: calc(60*(100vw/750));
    z-index: 999;
  }
  #Contents-All .atlr-tittle {
    font-family: 'optima' !important;
    font-size: calc(35*(100vw/750));
    line-height: 1.4;
    letter-spacing: 1.7px;
    margin-top: calc(87*(100vw/750));
    text-align: center;
  }
  #Contents-All .atlr-tittle-sub {
    font-family: 'josefinsans' !important;
    font-size: calc(24*(100vw/750));
    letter-spacing: 1px;
    margin-top: calc(45*(100vw/750));
    text-align: center;
  }
  #Contents-All .img {
    width: calc(700*(100vw/750)) !important;
  }
  #Contents-All .contents-top {
    width: calc(700*(100vw/750));
    margin: calc(22*(100vw/750)) auto 0;
  }
  #Contents-All .contents,
  #Contents-All .contents-last {
    width: calc(700*(100vw/750));
    margin: 0 auto;
  }
  #Contents-All .contents-last {
    margin-bottom: calc(210*(100vw/750)) !important;
  }
  #Contents-All .credit {
    font-family: 'josefinsans' !important;
    font-size: calc(24*(100vw/750));
    line-height: 1.4;
    letter-spacing: 0.3px;
  }

  #Contents-All .c1-2-credit {
    margin: calc(12*(100vw/750)) 0 calc(98*(100vw/750));
  }
  #Contents-All .c3-4-credit {
    margin: calc(12*(100vw/750)) 0 calc(130*(100vw/750));
  }
  #Contents-All .c5-6-credit,
  #Contents-All .c9-10-credit  {
    margin: calc(12*(100vw/750)) 0 calc(98*(100vw/750));
  }
  #Contents-All .c7-credit {
    margin: calc(10*(100vw/750)) 0 calc(132*(100vw/750));
  }
  #Contents-All .c8-credit {
    margin: calc(10*(100vw/750)) 0 calc(36*(100vw/750));
  }
}
/**********************************タブレット*************************************/
@media only screen and (min-width: 561px) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
  /*==========================
  iPadサイズ
  ==========================*/
 @media screen and (min-width: 561px) and (max-width: 768px) { 
  #Contents-All .back-txt {
    font-size: calc(15*(100vw/1024)) !important;
  }  
  #Contents-All .atlr-tittle {
      font-size: calc(20*(100vw/1024)) !important;
    }
    #Contents-All .atlr-tittle-sub {
      font-size: calc(12*(100vw/1024)) !important;
    }
    #Contents-All .credit {
      font-size: calc(13*(100vw/1024)) !important;
    }
  }
  /*==========================
  共通項目
  ==========================*/
  #Contents-All {
    width: calc(1355*(100vw/1400));
    margin: 0 auto;
  } 
  #Contents-All .contents-main {
    width: calc(880*(100vw/1400));
    margin: 0 auto;
  }
  #Contents-All .back-txt {
    font-family: 'josefinsans' !important;
    font-size: 15px;
    letter-spacing: 0.5px;
    position: fixed;
    bottom: calc(45*(100vw/1024));
    margin-left: calc(35*(100vw/1024));
    z-index: 999;
  }
  #Contents-All .atlr-tittle {
    font-family: 'optima' !important;
    font-size: 20px;
    line-height: 1.35;
    letter-spacing: 1.8px;
    text-align: center;
    margin-top: calc(87*(100vw/1024));
  }
  #Contents-All .atlr-tittle-sub {
    font-family: 'josefinsans' !important;
    font-size: 14px;
    letter-spacing: 0.8px;
    text-align: center;
    margin-top: calc(23*(100vw/1024));
  }
  #Contents-All .img {
    width: calc(385*(100vw/1024)) !important;
  }
  #Contents-All .contents-top,
  #Contents-All .contents,
  #Contents-All .contents-last {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
  }
  #Contents-All .contents-top {
    margin: calc(60*(100vw/1024)) 0 0 calc(19*(100vw/1024));
  }
  #Contents-All .contents {
    margin: calc(90*(100vw/1024)) 0 0 calc(19*(100vw/1024));
  }
  #Contents-All .contents-last {
    margin: calc(90*(100vw/1024)) 0 calc(300*(100vw/1024)) calc(19*(100vw/1024));
  }
  #Contents-All .credit {
    font-family: 'josefinsans' !important;
    width: calc(330*(100vw/1024)) !important;
    font-size: 13px;
    line-height: 1.7;
    letter-spacing: 0.3px;
  }
  #Contents-All .block {
    margin-left: calc(19*(100vw/1024));
  }

  #Contents-All .c1-2-credit {
    position: absolute;
    top: calc(-38*(100vw/1024));
  }
  #Contents-All .c3-4-credit {
    position: absolute;
    top: calc(-16*(100vw/1024));
  }
  #Contents-All .c5-6-credit,
  #Contents-All .c9-10-credit {
    position: absolute;
    top: calc(-38*(100vw/1024));
  }
  #Contents-All .c7-credit {
    position: absolute;
    top: calc(-15*(100vw/1024));
  }
  #Contents-All .c8-credit {
    position: absolute;
    top: calc(-81*(100vw/1024));
  }
}
/*************************************PC****************************************/
@media screen and ( min-width:1025px ) {
  /* #Contents-All {
    background-image: url(../img/pc.jpg);
    background-size: 100%;
    background-position-y: -84px;
  }  */
  #Contents-All {
    width: 1355px;
    margin: 0 auto;
  } 
  #Contents-All .contents-main {
    width: 880px;
    margin: 0 auto;
  }
  #Contents-All .back-txt {
    font-family: 'josefinsans' !important;
    font-size: 15px;
    letter-spacing: 0.5px;
    position: fixed;
    bottom: 45px;
    margin-left: 125px;
    z-index: 999;
  }
  #Contents-All .atlr-tittle {
    font-family: 'optima' !important;
    font-size: 20px;
    line-height: 1.35;
    letter-spacing: 1.8px;
    text-align: center;
    margin-top: 87px;
  }
  #Contents-All .atlr-tittle-sub {
    font-family: 'josefinsans' !important;
    font-size: 14px;
    letter-spacing: 0.8px;
    text-align: center;
    margin-top: 20px;
  }
  #Contents-All .img {
    width: 385px !important;
  }
  #Contents-All .contents-top,
  #Contents-All .contents,
  #Contents-All .contents-last {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
  }
  #Contents-All .contents-top {
    margin: 60px 0 0 24px;
  }
  #Contents-All .contents {
    margin: 90px 0 0 24px;
  }
  #Contents-All .contents-last {
    margin: 90px 0 300px 24px;
  }
  #Contents-All .credit {
    font-family: 'josefinsans' !important;
    width: 330px !important;
    font-size: 13px;
    line-height: 1.7;
    letter-spacing: 0.3px;
  }
  #Contents-All .block {
    margin-left: 19px;
  }

  #Contents-All .c1-2-credit {
    position: absolute;
    top: -38px;
  }
  #Contents-All .c3-4-credit {
    position: absolute;
    top: -16px;
  }
  #Contents-All .c5-6-credit,
  #Contents-All .c9-10-credit {
    position: absolute;
    top: -38px;
  }
  #Contents-All .c7-credit {
    position: absolute;
    top: -15px;
  }
  #Contents-All .c8-credit {
    position: absolute;
    top: -81px;
  }
}