/* --------------------------------------------------------------------------
   overwrite
--------------------------------------------------------------------------- */
.l-page {
  padding: 0;
}

html,
body {
  width: 100%;
  height: 100%;
}

/* --------------------------------------------------------------------------
   common
--------------------------------------------------------------------------- */
.l-sec-base {
  position: relative;
  z-index: 1;
  background: no-repeat 50% 0;
  -webkit-background-size: cover;
  background-size: cover;
}

.u-fit-img img {
  width: 100%;
  height: auto;
}

.logo {
  position: absolute;
  top: 3%;
  left: 50%;
  z-index: 3;
  width: 11%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.ttl,
.ttl-obj,
.btn {
  opacity: 0;
}

.to-top {
  position: absolute;
  right: 0;
  bottom: 3%;
  width: 25%;
  opacity: 0;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}

/* --------------------------------------------------------------------------
   sec-mv
--------------------------------------------------------------------------- */
.sec-mv {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  min-height: 100vh;
  padding: 66% 0 64%;
  background-image: url(../../img/himatsubushi/mv_bg.png);
  background-position: center center;
}

.sec-mv__ttl {
  position: relative;
  z-index: 2;
  opacity: 0;
}

.sec-mv::before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 59px;
  content: '';
  background: url(../../img/himatsubushi/mv_flag.png) no-repeat 50% 0;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
}

.sec-mv::after {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 59px;
  content: '';
  background: url(../../img/himatsubushi/mv_obj.png) no-repeat 50% 100%;
  -webkit-background-size: cover;
  background-size: cover;
}

.sec-mv .obj-wrap__item {
  position: absolute;
  z-index: 2;
  display: block;
  opacity: 0;
}

.sec-mv .obj-wrap__item img {
  width: 100%;
  height: auto;
}

.sec-mv .obj-wrap__item--01 {
  top: 5%;
  left: 0;
  width: 41.8%;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}

.sec-mv .obj-wrap__item--02 {
  top: 9%;
  right: 0;
  width: 52.8%;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}

.sec-mv .obj-wrap__item--03 {
  bottom: 6%;
  left: 0;
  width: 74.6%;
}

.sec-mv .obj-wrap__item--04 {
  right: 0;
  bottom: 4.7%;
  width: 40.6%;
}

/* --------------------------------------------------------------------------
   sec-road
--------------------------------------------------------------------------- */
.sec-road {
  padding-top: 30px;
  padding-bottom: 25px;
  margin-top: -16px;
  background-image: url(../../img/himatsubushi/road_bg.png);
}

.sec-road .img--01 {
  position: relative;
  z-index: 1;
  margin: -12px 0 -52px;
  opacity: 0
}

.sec-road .btn--01 {
  position: absolute;
  top: 78%;
  left: 8%;
  z-index: 2;
  width: 24%;
}

/* --------------------------------------------------------------------------
   sec-aruaru
--------------------------------------------------------------------------- */
.sec-aruaru {
  padding-top: 40px;
  padding-bottom: 25px;
  margin-top: -16px;
  background-image: url(../../img/himatsubushi/aruaru_bg.png);
}

.sec-aruaru .img--01 {
  position: relative;
  z-index: 1;
  margin: -60px 0 32px;
  opacity: 0;
}

.sec-aruaru .btn--01 {
  position: absolute;
  top: 75%;
  right: 8%;
  z-index: 2;
  width: 24%;
}

/* --------------------------------------------------------------------------
   sec-sagashi
--------------------------------------------------------------------------- */
.sec-sagashi {
  padding-top: 64px;
  padding-bottom: 25px;
  margin-top: -16px;
  background-image: url(../../img/himatsubushi/sagashi_bg.png);
}

.sec-sagashi .img--01 {
  margin: -25px 0 32px;
  opacity: 0;
}

.sec-sagashi .btn--01 {
  position: absolute;
  top: 72%;
  left: 8%;
  width: 25%;
}

/* --------------------------------------------------------------------------
   sec-bonus
--------------------------------------------------------------------------- */
.sec-bonus {
  padding-top: 29px;
  padding-bottom: 25px;
  margin-top: -16px;
  background-image: url(../../img/himatsubushi/bonus_bg.png);
}

.sec-bonus__ttl {
  opacity: 0;
}

.sec-bonus .img--01 {
  opacity: 0;
}

.sec-bonus .btn--01 {
  position: absolute;
  top: 66%;
  right: 6%;
  width: 26%;
}

.sec-bonus .obj-wrap__item {
  position: absolute;
  display: block;
  opacity: 0;
}

.sec-bonus .obj-wrap__item img {
  width: 100%;
  height: auto;
}

.sec-bonus .obj-wrap__item--01 {
  top: 24%;
  left: 3%;
  width: 10%;
}

.sec-bonus .obj-wrap__item--02 {
  top: 26%;
  right: 2%;
  width: 10.25%;
}

.sec-bonus .obj-wrap__item--03 {
  bottom: 2%;
  left: 53%;
  width: 14.75%;
}

/* --------------------------------------------------------------------------
   sec-panda
--------------------------------------------------------------------------- */
.sec-panda {
  padding-top: 7.5%;
  padding-bottom: 35%;
  margin-top: -7.5%;
  background-image: url(../../img/himatsubushi/panda_bg.png);
}

.sec-panda__ttl {
  width: 67%;
}

.sec-panda .ttl-obj {
  position: absolute;
  top: 7%;
  left: 3%;
  width: 26%;
}

.sec-panda .img--01 {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 72%;
  opacity: 0;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}

.sec-panda .btn--01 {
  position: absolute;
  top: 56%;
  left: 8%;
  width: 25.5%;
}

/* --------------------------------------------------------------------------
   sec-tuna
--------------------------------------------------------------------------- */
.sec-tuna {
  padding-bottom: 44%;
  margin-top: -7%;
  background-image: url(../../img/himatsubushi/tuna_bg.png);
}

.sec-tuna .ttl-obj {
  position: absolute;
  top: -2%;
  left: 0;
  width: 39%;
}

.sec-tuna .img--01 {
  position: absolute;
  top: 37%;
  left: 0;
  opacity: 0;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}

.sec-tuna .btn--01 {
  position: absolute;
  right: 6%;
  bottom: 13.5%;
  width: 25.5%;
}

/* --------------------------------------------------------------------------
   sec-recipe
--------------------------------------------------------------------------- */
.sec-recipe {
  padding-bottom: 36%;
  margin-top: -7%;
  background-image: url(../../img/himatsubushi/recipe_bg.png);
}

.sec-recipe__ttl {
  width: 65%;
}

.sec-recipe .ttl-obj {
  position: absolute;
  top: 0;
  left: 0;
  width: 28%;
}

.sec-recipe .img--01 {
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
}

.sec-recipe .btn--01 {
  position: absolute;
  top: 60%;
  left: 3%;
  width: 25.5%;
}

/* --------------------------------------------------------------------------
   sec-chef
--------------------------------------------------------------------------- */
.sec-chef {
  padding-top: 45.5%;
  padding-bottom: 38%;
  margin-top: -6%;
  background-image: url(../../img/himatsubushi/chef_bg.png);
}

.sec-chef__ttl {
  position: absolute;
  top: 0;
  right: 0;
  width: 68%;
}

.sec-chef .obj--01 {
  position: absolute;
  top: 4%;
  left: 28%;
  width: 32%;
  opacity: 0;
}

.sec-chef .img--01 {
  position: absolute;
  bottom: -3%;
  left: 0;
  width: 87%;
  opacity: 0;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
}

.sec-chef .btn--01 {
  position: absolute;
  right: 6%;
  bottom: 14%;
  width: 27.5%;
}

/* --------------------------------------------------------------------------
   sec-photo
--------------------------------------------------------------------------- */
.sec-photo {
  padding-bottom: 20%;
  margin-top: -8%;
  background-image: url(../../img/himatsubushi/photo_bg.png);
}

.sec-photo__ttl {
  position: relative;
  z-index: 2;
}

.sec-photo .img--01 {
  position: absolute;
  top: 4%;
  right: 20.5%;
  width: 22%;
}

.sec-photo .img--02 {
  position: absolute;
  right: 0;
  bottom: -2%;
  width: 47%;
}

.sec-photo .btn--01 {
  position: absolute;
  top: 62.5%;
  left: 6%;
  z-index: 3;
  width: 22%;
}

.mv-header {
  background-image: url(../../img/himatsubushi/header_img_01.jpg);
  background-position: center top;
  background-size: cover;
}

.mv-header h1 {
  width: 45%;
  padding: 22px 0 5px;
  margin: 0 auto;
  text-align: center;
}

.mv-header h1 img {
  width: 100%;
}

.mv-comment {
  display: none;
}

.mv-comment img {
  width: 100%;
}

.mv-comment a {
  display: block;
  width: 100%;
}

.mv-main {
  position: relative;
  background-image: url(../../img/himatsubushi/mv-bk_img.jpg);
  background-position: center top;
  background-size: cover;
}

.mv-main img {
  width: 100%;
}

.mv-main span {
  position: absolute;
  top: 74px;
  left: 50%;
  display: inline-block;
  width: 53.6%;
  transform: translateX(-50%);
}

.mv-txt,
.mv-btn {
  width: 86.3%;
  margin: 0 auto;
}

.mv-txt {
  margin-top: -124px;
  margin-bottom: 14px;
}

.mv-btn {
  margin-bottom: 10px;
}

.mv-txt__item {
  padding-bottom: 40px;
  margin-left: 10px;
}

.mv-txt__item img {
  width: 98%;
}
