@charset "utf-8";

#main-banner {
 background: -moz-linear-gradient(115deg, #000a7f, #3f4fa8);
 background: -webkit-linear-gradient(115deg, #000a7f, #3f4fa8);
 background: linear-gradient(-25deg, #000a7f, #3f4fa8);

 display: none;
}

#banner-title {
 -ms-transform: translate(-20%, -50%);
 -webkit-transform: translate(-20%, -50%);
 transform: translate(-20%, -50%);
}

h3 {
 font-size: 2em;
 /*text-align: center;*/
 text-align: left;
 padding-bottom: 15px;
 line-height: 1em;
}
h3 span.h3-2 {
 font-size: 0.7em;
 font-weight: normal;
 padding-left: 20px;
}
h3 span.h3-day {
 font-size: 0.5em;
 font-weight: normal;
 padding-left: 5px;
}

div#main-content {
 width: 100%;
 padding: 0;
 margin: 0;
}

div#main-content p {
 font-size: 1.2em;
 padding: 0 5px;
}

section {
 width: 100%;
 padding-left: 5%;
 padding-right: 5%;
 position: relative;
 padding-top: 8px;
 padding-bottom: 8px;
 margin-top: -8px;
}
div#main-content section:first-child {
 margin-top: 10px;
}
div#main-content section:first-child:before {
 content: '';
 display: block;
 height: 8px;
 width: 5%;
 position: absolute;
 top: 0;
 left: 0;
}
section:after {
 content: '';
 display: block;
 height: 8px;
 width: 5%;
 position: absolute;
 bottom: 0;
}
div#main-content section:nth-child(odd):after {
 right: 0;
}
div#main-content section:nth-child(even):after {
 left: 0;
}

div.section-inner {
 padding-top: 30px;
 padding-bottom: 50px;
 position: relative;
}

div.section-inner > div.side-box {
 display: -webkit-box;
 display: -webkit-flex;
 display: -ms-flexbox;
 display : flex;
}
div.section-inner > div.side-box > div.inside {
 width: 50%;
}
div.section-inner > div.side-box > div.inside > p {
 font-weight: bold;
}
div.section-inner > div.side-box > div.inside > div.ps-image {
 width: 90%;
 margin: 0 auto;
 position: relative;
}
div.section-inner > div.side-box > div.inside > div.ps-image:after {
 position: absolute;
 display: block;
 content: "";
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 box-shadow:
  inset 0 0 20px #fff,
  inset 0 0 20px #fff,
  inset 0 0 20px #fff,
  inset 0 0 20px #fff;
}
div.ps-image > img {
 width: 100%;
}

#hands-i,
#hands-s {
 position: absolute;
 width: 100%;
 left: 0;
 top: -60px;
}

dl.overview-info {
 width: 100%;
 position: relative;
 z-index: 1;
}
dl.overview-info dt,
dl.overview-info dd {
 margin-top: 8px;
 margin-bottom: 8px;
}
dl.overview-info dt {
 font-size: 1.2em;
 padding: 0 5px;
 font-weight: bold;
 width: 20%;
 float: left;
 position: relative;
}
dl.overview-info dt:after {
 content: ':';
 display: block;
 position: absolute;
 right: 5px;
 top: 0;
}
dl.overview-info dd {
 width: 80%;
 float: left;
}
dl.overview-info dd p {
}
dl.overview-info dd ul {
 margin: 0;
 padding-left: 25px;
}
dl.overview-info dd ul li {
}

div#main-content p.hands-tool-info {
 padding-top: 15px;
 padding-bottom: 15px;
}

dl.overview-info:after {
 display: block;
 content: "";
 clear: both;
}

div.company-logo {
 position: absolute;
 width: 200px;
 height: 200px;
 background: url("../image/ehz_logo_003.jpg") no-repeat ;
 background-size:cover;
 background-position:center center;
 z-index: 0;
 right: 5%;
}

/* mobile media */
@media screen and (max-width: 768px) {
 div.section-inner > div.side-box {
  display : block;
 }
 div.section-inner > div.side-box > div.inside {
  width: 99%;
 }
 section {
  padding-left: 1%;
  padding-right: 1%;
 }
}

@media screen and (max-width: 360px) {
 #banner-title {
  -ms-transform: translate(-10%, -50%);
  -webkit-transform: translate(-10%, -50%);
  transform: translate(-10%, -50%);
 }
 h3 span.h3-2 {
  font-size: 0.6em;
  padding-left: 10px;
 }
 h3 span.h3-day {
  display: block;
 }
 div.company-logo {
  position: relative;
  width: 100%;
  right: 0;
  background-size: auto 100%;
 }
 dl.overview-info dt {
  width: 100%;
  float: none;
 }
 dl.overview-info dt:after {
  display: none;
 }
 dl.overview-info dd {
  float: none;
  width: 100%;
  padding-left: 10px;
 }
}
