/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/

#nonenal .ovfHid{
  overflow: hidden;
}

#nonenal .nioiContents01 {
  position: relative;
}

#nonenal .contents01-1 {
  background:url(/~/Media/com/mens-deou/promotion/201603/nioilabo/common/bgNonenalHeader01.jpg) no-repeat;
  background-position: center;
  background-color: #463E00;
  width: 100%;
  height:373px;
}

#nonenal .justPC .contents01-1 .pdb{
  margin: 90px auto;
}
#nonenal .justTAB .contents01-1 .pdb{
  margin: 100px 0 0 -320px;
}
#nonenal .justSMP .contents01-1 .pdb{
  margin: 45px auto;
}

#nonenal .contents01-2 {
  background:url(/~/Media/com/mens-deou/promotion/201603/nioilabo/common/bgClossNioi.png) repeat-x;
  width: 100%;
}

#nonenal .contents01-2 img {
  margin-top: -110px;
  vertical-align: bottom;
}

#nonenal .glass1 {
  position: absolute;
  top: 110px;
  left: 50%;
  margin-left: 240px;
  z-index: 100;
}

#nonenal .nioiContents02 {
  position: relative;
}

#nonenal .contents02-1 {
  background:url(/~/Media/com/mens-deou/promotion/201603/nioilabo/common/bgNonenalHeader02.png) no-repeat;
  background-position: center;
  background-color: #161616;
  width: 100%;
  height:404px;
}

#nonenal .contents02-2 {
  background:url(/~/Media/com/mens-deou/promotion/201603/nioilabo/common/bgClossNioi.png) repeat-x;
  width: 100%;
}

#nonenal .contents02-2 img {
  margin-top: -110px;
  vertical-align: bottom;
}

#nonenal .glass2 {
  position: absolute;
  top: 320px;
  left: 50%;
  margin-left: 290px;
  z-index: 100;
}

#nonenal .glass3 {
  position: absolute;
  top: 50px;
  left: 50%;
  margin-left: -510px;
  z-index: 100;
}

#nonenal .nioiContents03 {
  position: relative;
}

#nonenal .contents03-1 {
  background:url(/~/Media/com/mens-deou/promotion/201603/nioilabo/common/bgNonenalHeader03.png) no-repeat;
  background-position: center;
  background-color: #1A1A1A;
  width: 100%;
  height:405px;
}

#nonenal .contents03-2 {
  background:url(/~/Media/com/mens-deou/promotion/201603/nioilabo/common/bgClossNioi.png) repeat-x;
  width: 100%;
}

#nonenal .contents03-2 img {
  margin-top: -110px;
  vertical-align: bottom;
}

#nonenal .glass4 {
  position: absolute;
  top:260px;
  left:-130px;
  z-index: 100;
}

#nonenal .glass5 {
  position: absolute;
  top:440px;
  right:-90px;
  z-index: 100;
}

#nonenal .nioiContents04 {
  position: relative;
}

#nonenal .contents04-1 {
  background:url(/~/Media/com/mens-deou/promotion/201603/nioilabo/common/bgNonenalHeader04.png) no-repeat;
  background-position: center;
  background-color: #1A1A1A;
  width: 100%;
  height:930px;
}

#nonenal .btnFactor {
  width:806px;
  height:178px;
  margin: 0 auto;
}


/*
* media query
*/
/* pc */
@media screen and (min-width: 1025px)  {
}

/* tab */
@media screen and (min-width: 761px) and (max-width: 1024px) {
/*	#contents01-2 img, #contents02-2 img:not(#glass1), #contents03-2 img:not(#glass2):not(#glass3) {
width: 720px;
height: auto;
}*/

#nonenal .contents01-1,#nonenal .contents02-1,#nonenal .contents03-1,#nonenal .contents04-1,#nonenal .btnFactor{
  overflow: hidden;
}

#nonenal .contents01-1 img{
  position: absolute;
  left: 50%;
  margin-left: -320px;
  z-index: 200;
}

#nonenal .contents03-1 img,#nonenal .contents04-1 img{
  position: absolute;
  left: 50%;
  margin-left: -380px;
  z-index: 200;
}

#nonenal .contents01-2{
  height: 203px;
}

#nonenal .contents01-2 img,#nonenal .contents02-2 img,#nonenal .contents03-2 img {
  margin-top: 0;
  vertical-align: bottom;
}

#nonenal .contents02-2{
  height: 453px;
}

#nonenal .contents03-2{
  height: 694px;
}

#nonenal .contents04-1 {
  margin-bottom: 50px;
}

#nonenal .nioiContentsWidth01{
  top: -110px;
  overflow: hidden;
  height: 313px;
}

#nonenal .nioiContentsWidth02{
  top: -110px;
  overflow: hidden;
  height: 563px;
}

#nonenal .nioiContentsWidth03{
  top: -110px;
  overflow: hidden;
  height: 804px;
}

#nonenal .nioiItem01{
  position: absolute;
  left: 50%;
  margin-left: -475px;
}

#nonenal .nioiItem02{
  position: absolute;
  left: 50%;
  margin-left: -430px;
}

#nonenal .btnFactor {
  position: absolute;
  top: 709px;
  left: 50%;
  margin-left: -380px;
  width:760px;
  height:199px;
}

#nonenal .bnrSmallInnerBox {
  width:576px;
  margin: 0 auto;
}
}

/* smp */
@media screen and (min-width: 0px) and (max-width: 760px) {
  #nonenal .contents01-1 {
    background-size: 1000px;
    width: 100%;
    height:auto;
  }

  #nonenal .contents01-1 img {
    width: 320px;
    max-width: 100%;
    height:auto;
  }

  #nonenal .contents01-2 {
    background:url(/~/Media/com/mens-deou/promotion/201603/nioilabo/common/bgClossNioi2.png) repeat-x;
    background-size: auto 140%;
    width: 100%;
  }

  #nonenal .contents02-1 {
    background-size: 1000px;
    width: 100%;
    height:auto;
  }

  #nonenal .contents03-1 {
    background-size: 1000px;
    width: 100%;
    height:auto;
  }

  #nonenal .contents04-1 {
    background-size: 1100px;
    height:500px;
  }

  #nonenal .sikiri {
    background:url(/~/Media/com/mens-deou/promotion/201603/nioilabo/common/nonenalSmpBd.png) repeat-x;
    background-position: center top;
    background-color: #f6f6f6;
    background-size: 320px;
    height:60px;
  }

  #nonenal .contentsBodyColor{
    background-color: #f6f6f6;
  }

  #nonenal .contents01-2 img {
    margin-top: 0;
    width: 100%;
    height: auto;
  }

  #nonenal .contents02-1 img {
    padding-top: 20px;
    width: 320px;
    max-width: 100%;
    height:auto;
  }

  #nonenal .contents03-1 img {
    padding-top: 20px;
    width: 320px;
    max-width: 100%;
    height:auto;
  }

  #nonenal .contents04-1 img {
    width: 320px;
    max-width: 100%;
    height:auto;
  }

  #nonenal .bnrSmallInnerBox {
    width:303px;
    margin: 0 auto;
  }
}