@charset "utf-8";
/* CSS Document */

/* ------------------------------- */
/* Eyecatch
/* ------------------------------- */

#eyecatch {
 padding: 100px 0 0;
 color: #FFF;
 text-align: center;
 background-image: url(/img/index/img_eyecatch.jpg);
 background-size: cover;
 background-position: center top;
}

#eyecatch h1 {
 display: flex;
 margin-bottom: 20px;
 font-size: 2.4rem;
 font-weight: 600;
 flex-direction: column;
 align-items: center;
}

#eyecatch h1 img {
 margin-bottom: 50px;
}

#eyecatch h1 span span {
 margin-left: 30px;
 font-size: 4rem;
}

#eyecatch h2 {
 margin-bottom: 80px;
 font-size: 1.6rem;
}

#eyecatch p {
 display: flex;
 justify-content: center;
 align-items: center;
 margin-bottom: 50px;
 font-size: 1.6rem;
 letter-spacing: 2px;
}

#eyecatch p img {
 margin: 0 20px;
}

#eyecatch .photos {
 margin-top: 60px;
 padding: 30px;
 background-color: rgba(0, 0, 0, 0.562);
}

#eyecatch video {
 margin-top: 60px;
 width: 100%;
}

@media (max-width: 767px) {
 #eyecatch h1 img {
  width: 150px;
  margin-bottom: 20px;
 }

 #eyecatch h1 {
  font-size: 2rem;
 }

 #eyecatch h1 span span {
  margin-left: 0;
  font-size: 3rem;
 }

 #eyecatch h2 {
  margin-bottom: 40px;
 }

 #eyecatch .instagram-media{
  min-width: 100% !important;
  margin: 0 -1px !important;
  border-right: none !important;
  border-left: none !important;
 }
}

@media (max-width: 577px) {
 #eyecatch p img {
  display: none;
 }
}


/* ------------------------------- */
/* Message
/* ------------------------------- */

#message {
 padding: 120px 0 0;
 text-align: center;
 background-color: #e6e6e6;
}

#message .title {
 margin-bottom: 30px;
 color: #caa35f;
 font-size: 1.2rem;
 font-weight: bold;
 line-height: 1.2;
}

#message h2 {
 display: flex;
 justify-content: center;
 align-items: center;
 margin-bottom: 50px;
 color: #231815;
 font-size: 5rem;
 font-weight: 600;
 letter-spacing: 10px;
}

#message h2 img {
 margin: 0 10px;
}

#message h3 {
 margin-bottom: 30px;
 font-size: 1.2rem;
 font-weight: bold;
}

#message p {
 line-height: 2;
}

@media (max-width: 991px) {
 #message h2 {
  font-size: 3rem;
 }

 #message h2 img {
  width: 100px;
 }
}

@media (max-width: 577px) {
 #message h2 {
  display: block;
  line-height: 1.4;
 }
}


/* ------------------------------- */
/* Business
/* ------------------------------- */

#stillness {
 background-image: url(/img/index/img_stillness.png);
 background-position: -300px top;
 background-repeat: no-repeat;
}

#movement {
 background-image: url(/img/index/img_movement.png);
 background-position: -300px top;
 background-repeat: no-repeat;
 background-color: #e6e6e6;
}

.business {
 padding: 120px 0;
}

.business .gold {
 position: relative;
 top: 0;
 left: -100px;
 margin-bottom: 10px;
 color: #caa35f;
 font-size: 3.6rem;
 font-weight: bold;
 font-family: "Carattere", cursive;
 letter-spacing: 4px;
 line-height: 1;
}

.business .title {
 font-size: 1.4rem;
 font-weight: 600;
 text-align: center;
}

.business h3 {
 display: inline-block;
 margin-bottom: 20px;
 padding: 10px 60px;
 color: #FFF;
 font-size: 2rem;
 font-weight: 500;
 background-color: #231815;
}

.business .subtitle {
 padding-left: 20px;
}

.business h4 {
 margin-bottom: 10px;
 font-size: 1.6rem;
}

.business h4 img {
 margin-left: 30px;
}

.business h2 {
 margin: 60px 0 15px;
 font-size: 2.4rem;
 font-weight: 600;
}

.business h2 img {
 margin-right: 20px;
}

.business h5 {
 margin-bottom: 40px;
 font-weight: 500;
 line-height: 1.6;
}

@media (max-width: 1700px) {
 #stillness,
 #movement {
  background-position: -400px top;
 }
}

@media (max-width: 1399px) {
 #stillness,
 #movement {
  background-position: -470px top;
 }
}

@media (max-width: 1199px) {
 #stillness,
 #movement {
  background-position: -570px top;
 }
}

@media (max-width: 1160px) {
 #stillness,
 #movement {
  background-position: -620px top;
 }
}

@media (max-width: 991px) {
 .business .title {
  margin-bottom: 20px;
  text-align: left;
 }

 .business .title img {
  display: block;
 }

 .business h3 {
  padding: 10px 30px;
 }
}

@media (max-width: 767px) {
 #stillness,
 #movement {
  background-image: none;
 }

 .business .gold {
  position: static;
 }

 .business .title img {
  width: 150px;
 }

 .business h3 {
  display: block;
  padding: 10px;
  text-align: center;
 }

 .business .subtitle {
  padding-left: 0;
  text-align: center;
 }

 .business h4 img {
  display: block;
  margin: 10px auto 10px;
 }
}


/* ------------------------------- */
/* Greeting
/* ------------------------------- */

#greeting {
 padding: 100px 0;
}

#greeting img {
 margin-bottom: 20px;
}

#greeting h2 {
 margin-bottom: 30px;
 font-size: 2.4rem;
 font-weight: bold;
}

#greeting h2 span {
 display: block;
 margin-bottom: 20px;
 color: #caa35f;
 font-size: 3.6rem;
 font-weight: bold;
 font-family: "Carattere", cursive;
 letter-spacing: 4px;
 line-height: 1;
}

#greeting h3 {
 margin: 10px 0 20px 20px;
 font-size: 1.4rem;
 font-weight: bold;
}

#greeting p {
 margin-left: 20px;
 line-height: 1.8;
}

@media (max-width: 767px) {
 #greeting h3 {
  margin-left: 0;
 }

 #greeting p {
  margin-left: 0;
 }
}


/* ------------------------------- */
/* Media
/* ------------------------------- */

#media {
 padding: 100px 0 60px;
 background-color: #e6e6e6;
}

#media h2 {
 margin-bottom: 30px;
 font-size: 2.4rem;
 font-weight: bold;
}

#media h2 span {
 display: block;
 margin-bottom: 20px;
 color: #caa35f;
 font-size: 3.6rem;
 font-weight: bold;
 font-family: "Carattere", cursive;
 letter-spacing: 4px;
 line-height: 1;
}

#media .image a {
 display: inline-block;
 margin: 10px;
}

#media .photos {
 display: flex;
 justify-content: center;
 overflow-x: hidden;
 margin-top: 60px;
}

#media .photos img {
 width: 20%;
}

@media (max-width: 991px) {
 #media .image {
  text-align: center;
 }

 #media .photos {
  flex-wrap: wrap;
 }

 #media .photos img {
  width: 200px;
 }
}


/* ------------------------------- */
/* Recruit
/* ------------------------------- */

#recruit {
 padding: 100px 0 60px;
}

#recruit h2 {
 margin-bottom: 30px;
 font-size: 2.4rem;
 font-weight: bold;
}

#recruit h2 span {
 display: block;
 margin-bottom: 20px;
 color: #caa35f;
 font-size: 3.6rem;
 font-weight: bold;
 font-family: "Carattere", cursive;
 letter-spacing: 4px;
 line-height: 1;
}

#recruit table {
 width: 100%;
 border-bottom: 1px solid #333;
}

#recruit table th,
#recruit table td {
 padding: 20px;
 border-top: 1px solid #333;
}

#recruit table th {
 font-weight: bold;
}