@import url("https://fonts.googleapis.com/css?family=Open+Sans:300&display=swap");
/**************************************
common
**************************************/
#cameraman_bardos {
  margin: calc(100 * (100vw / 750)) auto calc(200 * (100vw / 750));
  padding: 0 calc(37 * (100vw / 750));
  color: #000;
  font-family: 'Open Sans', sans-serif;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /************ credit **********/
  /************ title **********/
  /************ staff **********/
  /************ all btn **********/
  /************ contents **********/ }
  #cameraman_bardos * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
  #cameraman_bardos a {
    color: #000;
    text-decoration: none; }
    #cameraman_bardos a:hover {
      opacity: .6; }
      #cameraman_bardos a:hover img {
        opacity: 0.6; }
  #cameraman_bardos img {
    display: block;
    width: 100%;
    height: auto; }
  #cameraman_bardos .pc_only {
    display: none; }
  #cameraman_bardos .sp_only {
    display: initial; }
  #cameraman_bardos .credit {
    margin-top: 1.2em;
    font-size: calc(24 * (100vw / 750));
    font-weight: 300;
    line-height: 1.75;
    letter-spacing: 0.05em; }
    #cameraman_bardos .credit a {
      display: inline-block;
      margin-right: 0.5em; }
  #cameraman_bardos .title {
    width: calc(618 * (100vw / 750));
    margin: 0 auto calc(100 * (100vw / 750)); }
  #cameraman_bardos .staff {
    text-align: center;
    font-size: calc(24 * (100vw / 750));
    font-weight: 300;
    line-height: 1.8;
    letter-spacing: 0.08em;
    margin-bottom: calc(155 * (100vw / 750)); }
  #cameraman_bardos .all_btn {
    margin: 0 auto;
    width: calc(676 * (100vw / 750)); }
  #cameraman_bardos .sec01 {
    margin: 0 calc(37 * (100vw / 750)) calc(117 * (100vw / 750)); }
  #cameraman_bardos .sec02 .left {
    margin: 0 auto calc(115 * (100vw / 750)); }
  #cameraman_bardos .sec02 .right {
    margin: 0 calc(37 * (100vw / 750)) calc(115 * (100vw / 750)); }
  #cameraman_bardos .sec03 {
    margin-left: calc(187 * (100vw / 750));
    margin-right: calc(-37 * (100vw / 750));
    margin-bottom: calc(40 * (100vw / 750)); }
  #cameraman_bardos .sec04 {
    margin-left: calc(-37 * (100vw / 750));
    margin-bottom: calc(115 * (100vw / 750)); }
    #cameraman_bardos .sec04 .credit {
      margin-left: 1em; }
  #cameraman_bardos .sec05 {
    margin: 0 calc(-37 * (100vw / 750)) calc(115 * (100vw / 750)); }
    #cameraman_bardos .sec05 .credit {
      margin-left: 1em; }
  #cameraman_bardos .sec06 {
    margin-bottom: calc(115 * (100vw / 750)); }
    #cameraman_bardos .sec06 .left {
      margin-right: calc(150 * (100vw / 750));
      margin-bottom: calc(115 * (100vw / 750)); }
      #cameraman_bardos .sec06 .left .credit {
        margin-right: -2em; }
    #cameraman_bardos .sec06 .right {
      margin-left: calc(114 * (100vw / 750)); }
      #cameraman_bardos .sec06 .right .credit {
        margin-right: -2em; }
  #cameraman_bardos .sec07 {
    margin-bottom: calc(115 * (100vw / 750)); }
  #cameraman_bardos .sec08 {
    margin-left: calc(113 * (100vw / 750));
    margin-right: calc(-37 * (100vw / 750));
    margin-bottom: calc(115 * (100vw / 750)); }
  #cameraman_bardos .sec09 {
    margin: 0 calc(20 * (100vw / 750)) calc(40 * (100vw / 750)); }
  #cameraman_bardos .sec10 {
    margin: 0 calc(-37 * (100vw / 750)) calc(115 * (100vw / 750));
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }
    #cameraman_bardos .sec10 .left {
      width: calc(360 * (100vw / 750)); }
    #cameraman_bardos .sec10 .right {
      width: calc(360 * (100vw / 750)); }
    #cameraman_bardos .sec10 .credit {
      margin-left: calc(37 * (100vw / 750)); }
  #cameraman_bardos .sec11 {
    margin: 0 calc(-37 * (100vw / 750)) calc(115 * (100vw / 750)); }
    #cameraman_bardos .sec11 .credit {
      margin-left: calc(37 * (100vw / 750)); }
  #cameraman_bardos .sec12 {
    margin-bottom: calc(115 * (100vw / 750)); }
    #cameraman_bardos .sec12 .left {
      margin-right: calc(225 * (100vw / 750));
      margin-bottom: calc(115 * (100vw / 750)); }
    #cameraman_bardos .sec12 .right {
      margin-left: calc(113 * (100vw / 750)); }
      #cameraman_bardos .sec12 .right .credit {
        text-align: right; }
        #cameraman_bardos .sec12 .right .credit a {
          margin-right: 0; }
  #cameraman_bardos .sec13 {
    margin: 0 calc(-37 * (100vw / 750)) calc(115 * (100vw / 750)); }
    #cameraman_bardos .sec13 .credit {
      margin-left: calc(37 * (100vw / 750)); }
  #cameraman_bardos .sec14 {
    margin-bottom: calc(115 * (100vw / 750)); }
    #cameraman_bardos .sec14 .left {
      margin-right: calc(75 * (100vw / 750));
      margin-bottom: calc(40 * (100vw / 750)); }
    #cameraman_bardos .sec14 .right {
      margin-left: calc(225 * (100vw / 750)); }
  #cameraman_bardos .sec15 {
    margin-bottom: calc(155 * (100vw / 750)); }

.spImgSec02_01 {
  width: calc(600 * (100vw / 750))!important;
  margin-left: 0!important;
}

.spImgSec02_02 {
  width: calc(638 * (100vw / 750))!important;
  margin-left: width: calc(38 * (100vw / 750))!important;
}

/*.spImgSec03_01 {
  width: calc(488 * (100vw / 750))!important;
  margin-left: width: calc(38 * (100vw / 750))!important;
}*/


/************ fade **********/
.fade {
  -webkit-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
  opacity: 0;
  -webkit-transform: translateY(50px);
  -ms-transform: translateY(50px);
  transform: translateY(50px); }
  .fade.onView {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); }