@charset "utf-8";

/* ****************************************************************************************************
   * ビジュアル
**************************************************************************************************** */

div#visual {
  background-image: url(../../_images/plant/organic/visual-bg.jpg);
}

/* ****************************************************************************************************
   * 写真
**************************************************************************************************** */

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
   * 写真
/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

#organic figure.photo {
  margin-left: -3.03%;
  margin-bottom: -3.03%;
  letter-spacing: -0.4em;
}

#organic figure.photo > * {
  letter-spacing: normal;
}

#organic figure.photo div.item {
  width: 30.30%;
  margin-left: 3.03%;
  margin-bottom: 3.03%;
  vertical-align: top;
  display: inline-block;
}

/* * ブレイクポイント
/* ------------------------------------------------------------------------------------------------- */

@media screen and (max-width:540px) {

#organic figure.photo {
  margin-left: 0;
  margin-bottom: 0;
  letter-spacing: normal;
}

#organic figure.photo div.item {
  width: 100%;
  margin-left: 0;
  margin-bottom: 0;
}

#organic figure.photo div.item ~ div.item {
  margin-top: 10px;
}

#organic figure.photo div.item img {
  width: 100%;
}

}

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
   * 補足
/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

#organic aside.default {
  padding: 1em 2em;
  border: solid 1px #ddd;
  background: #f9f9f9;
}

/* * ブレイクポイント
/* ------------------------------------------------------------------------------------------------- */

@media screen and (max-width:540px) {

#organic aside.default {
  padding: 10px;
}

}