/*  #mainImg
================================================ */
@media screen and (min-width: 600px) { #mainImg .img { background-image: url("../img/company/img_mainimg01-pc.jpg"); } }

/*  #message
================================================ */
#message .inner { padding-bottom: 50px; }

#message .img { margin: 0 -20px; }

#message .txtWrap { position: relative; margin-top: -50px; padding: 36px 25px; background: #fff; color: #222; }

#message .txt { padding-top: 15px; }

#message .sign { padding-top: 15px; text-align: right; }

#message .sign span { display: inline-block; }

#message .name { width: 105px; padding-left: 8px; }

@media screen and (min-width: 600px) { #message { position: relative; overflow: hidden; }
  #message .inner { padding-bottom: 0; }
  #message .img { position: relative; left: 50%; width: 100vw; min-width: 1200px; margin: 0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
  #message .img img { width: 100%; max-width: none; }
  #message .txtWrap { position: absolute; top: 50%; right: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); box-sizing: border-box; width: 615px; margin-top: 0; padding: 80px; }
  #message .txt { padding-top: 40px; }
  #message .sign { padding-top: 20px; text-align: left; }
  #message .sign span { display: inline-block; }
  #message .name { width: 105px; padding-left: 15px; } }

/*  #philosophy
================================================ */
#philosophy { position: relative; color: #222; background: #fff; }

#philosophy .inner { padding-top: 44px; padding-bottom: 50px; }

#philosophy .txtWrap { margin-top: 24px; padding: 30px 50px; background: #333; text-align: center; }

#philosophy .part01 { position: absolute; width: 202px; left: 0; top: 17px; }

@media screen and (min-width: 600px) { #philosophy .inner { padding-top: 115px; padding-bottom: 120px; }
  #philosophy .txtWrap { margin-top: 40px; box-sizing: border-box; width: 100%; padding: 55px; }
  #philosophy .part01 { width: 404px; left: 210px; top: 85px; } }

/*  #principles
================================================ */
#principles { background: url(../img/company/bg_principles_sp.jpg) no-repeat; background-size: cover; }

#principles .inner { padding-top: 40px; padding-bottom: 50px; }

#principles .txtWrap { margin-top: 25px; padding: 40px 25px; background: rgba(255, 255, 255, 0.95); }

@media screen and (min-width: 600px) { #principles { background-image: url(../img/company/bg_principles_pc.jpg); background-size: cover; }
  #principles .inner { padding-top: 110px; padding-bottom: 120px; }
  #principles .txtWrap { box-sizing: border-box; width: 100%; margin-top: 40px; padding: 60px; text-align: center; } }

/*  #gallery
================================================ */
#gallery { background-color: #333; }

#gallery .inner { padding-top: 50px; padding-bottom: 70px; }

@media screen and (min-width: 600px) { #gallery .inner { padding-top: 120px; padding-bottom: 0; }
  #gallery .img { position: relative; left: 50%; width: 100vw; min-width: 1200px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
  #gallery .img img { width: 100%; max-width: none; } }