@charset "utf-8";

/* gallery */
#hakatakawaii h2 {
  margin-bottom: 60px;
}
#hakatakawaii #gallery {
  background: #fff url("../../img/bg_stars.gif") repeat center top;
}
#hakatakawaii .inner {
  width: 700px;
}
#hakatakawaii #gallery .block {
  display: block;
  position: relative;
  float: left;
  width:330px;
  height: 100%;
  margin: 0 40px 60px 0;
}
#hakatakawaii #gallery .block:nth-child(2n) {
  margin-right: 0;
}
#hakatakawaii #gallery .block.new:before {
  display: block;
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 0;
  height: 0;
  border-right: 90px solid transparent;
  border-top: 90px solid #d70c19;
  z-index: 10;
}
#hakatakawaii #gallery .block.new:after {
  display: block;
  content: "NEW";
  position: absolute;
  top: 26px;
  left: 18px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  z-index: 11;
}
#hakatakawaii #gallery .border {
  position: relative;
  width: 100%;
  height: 100%;
  margin-bottom: 10px;
  padding: 15px 0 15px 15px;
}
#hakatakawaii #gallery .border img {
  display: block;
  position: relative;
  width: calc(100% - 15px);
  height: auto;
}
#hakatakawaii #gallery .border:before {
  top:30px;
  left: 30px;
  width: calc(100% - 30px);
  height: calc(100% - 30px);
  background: url("../../img/bg_stripe_lblue.png");
}
#hakatakawaii #gallery .border:after {
  top: 0;
  left: 0;
  width: calc(100% - 38px);
  height: calc(100% - 38px);
  border: 4px solid #e45800;
}



@media all and (max-width: 812px) {
#hakatakawaii .contents-wave h2 {
  margin-bottom: 8%;
}
#hakatakawaii #gallery {
  background: #fff url("../../img/bg_stars.gif") repeat center top / 120% auto;
}
#hakatakawaii .inner {
  max-width: 700px;
  width: 90%;
}
#hakatakawaii #gallery .block {
  max-width:330px;
  width: calc(50% - 20px);
  margin: 0 40px 60px 0;
}


}




@media all and (max-width: 568px) {
#hakatakawaii #gallery .block {
  width: calc(50% - 10px);
  margin: 0 20px 30px 0;
}
#hakatakawaii #gallery .block.new:before {
  top: 3px;
  left: 3px;
  border-right: 50px solid transparent;
  border-top: 50px solid #d70c19;
}
#hakatakawaii #gallery .block.new:after {
  top: 14px;
  left: 5px;
  font-size: 12px;
}
#hakatakawaii #gallery .border {
  padding: 10px 0 10px 10px;
}
#hakatakawaii #gallery .border img {
  width: calc(100% - 10px);
}
#hakatakawaii #gallery .border:before {
  top:20px;
  left: 20px;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
}
#hakatakawaii #gallery .border:after {
  width: calc(100% - 28px);
  height: calc(100% - 28px);
  border: 3px solid #e45800;
}

}