/* style.css */



* {
  margin:0;
  padding:0;
}

html {
  height:100%;
  min-height:100%;
  background:#000;
}

body {
  width:1000px;
  min-height:100%;
  margin:0 auto;
  text-align:left;
  line-height:1.5;
  font-family:'Meiryo UI','Hiragino Kaku Gothic Pro',Osaka,'MS UI Gothic',sans-serif;
  font-size:14px;
  color:#ccc;
  background:#021;
  box-shadow:0 0 20px #363;
  -webkit-text-size-adjust:150%;
}



a,
a:link,
a:visited {
  text-decoration:none;
  color:#9d3;
}
a:hover {
  color:#d93;
  border-bottom:solid 1px #d93;
}



header {
  position:relative;
  margin:0 auto 20px auto;
  height:5em;
  padding:0;
  line-height:5em;
  text-indent:1em;
  text-align:left;
  color:#fff;
  background:#231;
  text-shadow:0 0 6px #000;
}
header h1 {
  padding:0 10px;
  font-size:14px;
  color:#ccc;
}
header h1 a#LSS {
  position:absolute;
  bottom:18px;
  right:20px;
  width:200px;
  height:32px;
  text-indent:-999em;
  background:url(../test/img/LSS-logo-WH.png) no-repeat left top;
  background-size:100%;
  opacity:0.5;
  overflow:hidden;
  outline:none;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
header h1 a#LSS:hover {
  border:0;
  opacity:1;
  transform:scale(1.06);
  -webkit-transition: 0.1s ease-in-out;
  -moz-transition: 0.1s ease-in-out;
  -o-transition: 0.1s ease-in-out;
  transition: 0.1s ease-in-out;
}



article {
  padding:10px 0 260px 0;
  vertical-align:top;
  background:#021 url(../test/img/bg-footer.jpg) no-repeat center bottom fixed;
}
article h2 {
  display:none;
}
article h3 {
  clear:both;
  margin:50px  0 15px 0;
  padding:0 20px 0 50px;
  line-height:50px;
  font-size:20px;
  background:#231 url(../test/img/icon-screw.png) no-repeat 10px center;
  text-shadow:0 0 6px #000;
}
article p {
  margin:0 0 15px 0;
  padding:0 20px;
  font-size:16px;
}
article p.catch {
  text-align:center;
  font-size:20px;
}
article p.note {
  margin-top:-10px;
  text-align:right;
  font-size:12px;
  color:#999;
}

article div#LED-dimmable {
  position:relative;
  height:500px;
  margin:0 0 20px 0;
}
article div#LED-dimmable img {
  position:absolute;
  left:0;
  top:0;
  z-index:1;
}
article div#LED-dimmable img.LED {
  left:581px;
  top:101px;
  opacity:0;
  filter:brightness(120%) contrast(120%);
  mix-blend-mode:lighten;
}
article div#LED-dimmable img#LED-470nm {
  z-index:2;
}
article div#LED-dimmable img#LED-530nm {
  z-index:3;
}
article div#LED-dimmable img#LED-660nm {
  z-index:4;
}
article div#LED-dimmable img#LED-6000K {
  z-index:5;
}
article div#LED-dimmable img#LED-3000K {
  z-index:6;
}
article div#LED-dimmable p.slider {
  position:absolute;
  left:760px;
  top:320px;
  z-index:3;
  margin:0;
  padding:0;
  opacity:0.6;
  transform:scale(0.8);
}
article div#LED-dimmable p.slider img#slider-bar {
  left:0;
  top:0;
  z-index:1;
  opacity:0.6;
  box-shadow:0 0 6px #000;
}
article div#LED-dimmable p.slider img.btn {
  top:116px;
  z-index:2;
  width:25px;
  height:25px;
}
article div#LED-dimmable p.slider img#btn-470nm {
  left:14px;
}
article div#LED-dimmable p.slider img#btn-6000K {
  left:44px;
}
article div#LED-dimmable p.slider img#btn-3000K {
  left:74px;
}
article div#LED-dimmable p.slider img#btn-530nm {
  left:104px;
}
article div#LED-dimmable p.slider img#btn-660nm {
  left:134px;
}
article div#LED-dimmable p.slider img#btn-power {
  left:164px;
}

article p#HEI-lens {
  height:520px;
}
article p#HEI-lens img {
  display:block;
}
article p#HEI-lens a {
  float:left;
}
article p#HEI-lens a img {
  width:480px;
  height:auto;
}
article p#HEI-lens img.figure {
  opacity:0.9;
}
article p#HEI-lens img.lens {
}
article p#HEI-lens img.beam {
}

article p#LED-emitter {
}
article p#LED-emitter img {
  width:960px;
  height:auto;
}

article img.wide {
  width:1000px;
  height:auto;
  margin:0 -20px;
}

article strong {
  margin:0 2px;
}

article a:hover {
  border-bottom:0;
}

article dl {
  position:relative;
  margin:0 0 0 20px;
}
article dl.LED {
}
article dl.LED:after {
  content:'';
  position:absolute;
  z-index:0;
  width:280px;
  height:120px;
  background:url(../test/img/LED.png) no-repeat 0 0;
  background-size:100%;
  opacity:0.6;
  left:600px;
  bottom:0;
}
article dl dt {
  position:absolute;
  left:0;
  z-index:2;
  width:12em;
  text-align:right;
}
article dl dd {
  position:relative;
  z-index:1;
  margin:0 0 5px 0;
  padding:0 20px 0 13em;
}
article dl dd span {
  color:#666;
}

article div#tip {
  position:relative;
  z-index:2;
  width:500px;
  margin:40px 0 10px 150px;
  padding:10px 20px;
  line-height:1.4;
  color:#333;
  background:#eee;
  border:solid 1px #000;
  border-radius:20px;
  box-shadow:0 0 3px #000;
}
article div#tip:after {
  content:'';
  position:absolute;
  left:150px;
  bottom:-20px;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 21px solid #eee;
}
article div#tip h4 {
  font-size:15px;
}
article div#tip p {
  margin:0;
  padding:5px 0;
  font-size:14px;
}
article div#tip em {
  margin:0 30px;
  font-weight:bold;
  white-space:nowrap;
  font-style:normal;
  font-size:14px;
}
article div#tip em.fine {
  color:#79a;
}
article div#tip em.luna {
  color:#c90;
}
article div#tip em.sunset {
  color:#d60;
}
article div#tip em.water {
  color:#0ae;
}



footer {
  position:relative;
  clear:both;
  height:20px;
  margin:0 auto;
  padding:30px 0 40px 0;
  line-height:20px;
  text-align:center;
  font-size:12px;
  color:#ccc;
  background:#231;
  text-shadow:0 0 6px #000;
}
footer:after {
  content:'';
  position:absolute;
  z-index:0;
  width:200px;
  height:32px;
  background:url(../test/img/LSS-logo-WH.png) no-repeat 0 0;
  background-size:100%;
  opacity:0.1;
  left:25px;
  top:30px;
}
footer p {
}
footer a {
  color:#9cf;
}