/*
@mixin fz($fzSize) {
	font-size: $fzSize + px;
	font-size: ($fzSize / 10) + rem;
}
*/
@media screen and (max-width: 769px) {
  /*----------------------------------------
		#global-header
	----------------------------------------*/
  .movie {
    padding: 2rem !important;
  }
  .movie h3 {
    margin-bottom: 1rem;
  }

  /*----------------------------------------
  	#target
  ----------------------------------------*/
  #target h3 {
    padding: 5rem 14rem 5rem 2rem;
    background: url(../images/back-target.jpg) no-repeat center top;
    background-size: cover;
  }
  #target .text {
    padding: 3rem;
  }
  #target .list-orange li {
    font-size: 12px;
    font-size: 3.75vw;
  }

  /*----------------------------------------
  	#prologue
  ----------------------------------------*/
  #prologue .text {
    padding: 3rem;
    background: #2d1508;
  }
  #prologue h3 {
    padding: 3rem 1rem 3rem 10rem;
    background: url(../images/back-prologue.jpg) no-repeat center 1.8rem;
    background-size: cover;
  }
  #prologue p {
    color: #fff;
  }

  #profile {
    padding: 5rem 2rem 3rem;
    background: #000 url(../images/back-profile.jpg) no-repeat center top;
    background-size: 100%;
  }
  #profile h4 {
    margin-bottom: 3rem;
  }
  #profile .text {
    background: rgba(0, 0, 0, 0.5) !important;
  }

  /*----------------------------------------
  	#prologue-b
  ----------------------------------------*/
  #prologue-b .text {
    padding: 3rem;
    background: #2d1508;
  }
  #prologue-b h3 {
    padding: 3rem 1rem 3rem 10rem;
    background: url(../images/back-prologue-b.jpg) no-repeat center 1.8rem;
    background-size: cover;
  }
  #prologue-b p {
    color: #fff;
  }

  #profile-b {
    padding: 5rem 2rem 3rem;
    background: #000 url(../images/back-prologue-b.jpg) no-repeat center top;
    background-size: 100%;
  }
  #profile-b h4 {
    margin-bottom: 3rem;
  }
  #profile-b .text {
    background: rgba(0, 0, 0, 0.5) !important;
  }




  /*----------------------------------------
  	#why
  ----------------------------------------*/
  #why h3 {
    padding: 3rem 2rem 3rem;
    background: url(../images/back-why.jpg) no-repeat center top;
    background-size: cover;
  }
  #why .text {
    padding: 3rem;
  }

  #why-country {
    margin-bottom: 10%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  #why-country li {
    margin-bottom: 1%;
    width: 49.5%;
  }

  /*----------------------------------------
  	#reason
  ----------------------------------------*/
  #reason h3 {
    padding: 3rem 2rem;
    background: url(../images/back-reason.jpg) no-repeat center top;
    background-size: cover;
  }
  #reason .text {
    padding: 3rem;
    background: black;
  }
  #reason p {
    color: #fff;
  }

  /*----------------------------------------
  	#notice
  ----------------------------------------*/
  #notice h3 {
    padding: 5rem 2rem 5rem 2rem;
    background: url(../images/back-notice.png) no-repeat center top;
    background-size: cover;
  }
  #notice .text {
    padding: 3rem;
  }
}
@media screen and (min-width: 769px) {
  /*----------------------------------------
		#global-header
	----------------------------------------*/
  .movie {
    padding: 5% 15% !important;
  }
  .movie h3 {
    margin-bottom: 3em;
  }

  /*----------------------------------------
  	#target
  ----------------------------------------*/
  #target {
    padding: 5% 0;
    background: url(../images/back-target.jpg) no-repeat center top fixed;
    background-size: cover;
  }
  #target .inner {
    margin: 0 38% 0 7%;
  }
  #target h3 {
    margin-bottom: 5%;
  }

  /*----------------------------------------
  	#prologue
  ----------------------------------------*/
  #prologue {
    padding: 5% 0;
    background: url(../images/back-prologue.jpg) no-repeat center top fixed;
    background-size: cover;
  }
  #prologue .inner {
    margin: 0 7% 0 38%;
  }
  #prologue .text {
    padding: 10%;
    background: rgba(45, 21, 8, 0.95);
  }
  #prologue h3 {
    margin-bottom: 5%;
  }
  #prologue p {
    color: #fff;
  }

  #profile {
    padding: 8% 5% 5%;
    background: #000 url(../images/back-profile.jpg) no-repeat center top;
    background-size: 100%;
  }
  #profile h4 {
    margin-bottom: 8em;
  }
  #profile .text {
    background: rgba(0, 0, 0, 0.5) !important;
  }


  /*----------------------------------------
  	#prologue-b
  ----------------------------------------*/
  #prologue-b {
    padding: 5% 0;
    background: url(../images/back-prologue-b.jpg) no-repeat center top fixed;
    background-size: cover;
  }
  #prologue-b .inner {
    margin: 0 7% 0 38%;
  }
  #prologue-b .text {
    padding: 10%;
    background: rgba(45, 21, 8, 0.95);
  }
  #prologue-b h3 {
    margin-bottom: 5%;
  }
  #prologue-b p {
    color: #fff;
  }

  #profile-b {
    padding: 8% 5% 5%;
    background: #000 url(../images/back-profile-b.jpg) no-repeat center top;
    background-size: 100%;
  }
  #profile-b h4 {
    margin-bottom: 8em;
  }
  #profile-b .text {
    background: rgba(0, 0, 0, 0.5) !important;
  }



  /*----------------------------------------
  	#why
  ----------------------------------------*/
  #why {
    padding: 5% 0;
    background: url(../images/back-why.jpg) no-repeat center top fixed;
    background-size: cover;
  }
  #why .inner {
    margin: 0 7% 0 38%;
  }
  #why h3 {
    margin-bottom: 5%;
  }
  #why .text {
    padding: 10%;
    background: rgba(255, 255, 255, 0.9);
  }

  #why-country {
    margin-bottom: 10%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  #why-country li {
    margin-bottom: 1%;
    width: 49.5%;
  }

  /*----------------------------------------
  	#reason
  ----------------------------------------*/
  #reason {
    padding: 5% 0;
    background: url(../images/back-reason.jpg) no-repeat center top fixed;
    background-size: cover;
  }
  #reason .inner {
    margin: 0 38% 0 7%;
  }
  #reason h3 {
    margin-bottom: 5%;
  }
  #reason .text {
    padding: 10%;
    background: rgba(0, 0, 0, 0.9);
  }
  #reason p {
    color: #fff;
  }

  /*----------------------------------------
  	#notice
  ----------------------------------------*/
  #notice {
    padding: 5% 0;
    background: url(../images/back-notice.png) no-repeat center top fixed;
    background-size: cover;
  }
  #notice .inner {
    margin: 0 38% 0 7%;
  }
  #notice h3 {
    margin-bottom: 5%;
  }
}
