@charset "utf-8";

main { background: url(../../images/corp/bg.png) no-repeat center 0; }

#greeting                   { margin-top: 120px; font-size: 1.8rem; }
#greeting .greet            { display: flex; justify-content: space-between; }
#greeting .exp              { width: calc(100% - 590px); }
#greeting .exp p + p        { margin-top: 1em; }
#greeting figure            { position: relative; right: -25px; width: 565px; }
#greeting figure img        { width: 100%; height: auto; }
#greeting figcaption        { position: absolute; bottom: -30px; right: 70px; text-align: right; line-height: 1.5; }
#greeting figcaption strong { margin-left: 1em; font-size: 2.4rem; font-weight: 700; }
#greeting .exp .read        { font-size: 26px; font-weight: bolder; }

#outline    { margin-top: 170px; font-size: 1.6rem; }
#outline th,
#outline td { padding: 30px; border-top: 1px solid #000; vertical-align: top; }
#outline th { width: 12em; font-weight: 700; }
#outline dt:not(:first-of-type) { margin-top: 1em; }
#outline dd { margin-left: 1em; }

#access               { margin-top: 120px; font-size: 1.6rem; }
#access h3            { margin-bottom: 10px; font-size: 3rem; font-weight: 700; }
#access .traffic dt   { display: flex; align-items: center; margin-top: 30px; font-size: 1.8rem; font-weight: 700; }
#access .traffic dt i { display: flex; justify-content: center; align-items: center; width: 45px; height: 45px; margin-right: 12px; border: 2px solid #333; border-radius: 50%; background: #fff; font-size: 2.4rem; }
#access .traffic dd   { margin-left: 57px; }
#access figure img    { width: 100%; height: auto; border-radius: 30px; }
#access .gmap         { margin-top: 70px; }
#access .gmap iframe  { width: 100%; border: 2px solid #333; border-radius: 30px; }
#access #sun-to-f     { margin-top: 140px; }

@media (max-width: 767px) {
  main { background: none; }

  #corp .ttl-green { font-size: 2.4rem; }
  
	#greeting                   { margin-top: 60px; font-size: 1.6rem; }
  #greeting p { background-color: #fbf5e3; }
  #greeting .greet            { display: block; }
  #greeting .exp              { width: auto; }
  #greeting figure            { right: auto; width: auto; margin-top: 30px; text-align: center; }
  #greeting figure img        { max-width: 375px; }
  #greeting figcaption        { bottom: -40px; right: 0; }
  #greeting figcaption strong { font-size: 2.4rem; }
  
  #outline    { margin-top: 90px; font-size: 1.4rem; }
  #outline table
  #outline tbody,
  #outline tr,
  #outline th,
  #outline td { display: block; }
  #outline th { width: 100%; padding: 10px 0 0; }
  #outline td { padding: 0 0 10px; border: 0; }
  
  #access               { margin-top: 40px; font-size: 1.4rem; }
  #access h3            { margin-bottom: 5px; font-size: 2.4rem; }
  #access .traffic dt   { margin-top: 15px; font-size: 1.6rem; }
  #access .info         { order: 2; }
  #access figure        { margin-bottom: 15px; order: 1; }
  #access figure img    { border-radius: 10px; }
  #access .gmap         { margin-top: 30px; }
  #access .gmap iframe  { height: 300px; border-radius: 10px; }
  #access #sun-to-f     { margin-top: 70px; }
}