/******************************************************

 common
 
******************************************************/
.localNav {
  max-width: 1000px;
  width: 90%;
  font-size: 15px;
  padding-top: 60px;
  margin: 0 auto; }
  .localNav ul {
    margin: 0 auto;
    display: flex;
    justify-content: center; }
    .localNav ul li {
      max-width: 240px;
      width: 24%;
      margin: 0 1.1%; }
      .localNav ul li a {
        display: block;
        padding: 16px;
        background-color: #c9caca;
        color: #000;
        text-align: center; }
        .localNav ul li a:hover, .localNav ul li a.current {
          background-color: #27acb8;
          color: #fff; }

.mainCopy {
  margin-top: 50px; }

.categoryName {
  font-family: Montserrat, sans-serif;
  font-weight: bold;
  font-size: 20px;
  border: 1px solid #27acb8;
  color: #27acb8;
  padding: 16px 22px;
  text-transform: uppercase;
  margin-top: 60px;
  text-align: center; }
  .categoryName span {
    background: linear-gradient(transparent 80%, #ffea00 80%, #ffea00 90%, transparent 90%);
    display: inline-block; }

.aboutOrange {
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
  justify-content: flex-start;
  align-items: center;
  margin-top: 50px; }
  .aboutOrange .logo {
    margin: 0 4%; }
    .aboutOrange .logo img {
      width: 100%;
      height: auto; }

.unitList {
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap; }

.unit {
  width: 30%;
  margin-top: 35px; }

.img {
  position: relative; }
  .img img {
    width: 100%;
    height: auto; }
  .img .note {
    position: absolute;
    bottom: 3px;
    right: 5px;
    color: #000;
    text-shadow: #fff 1px 1px 1px, #fff -1px 1px 1px, #fff 1px -1px 1px, #fff -1px -1px 1px; }

.img + .name {
  margin-top: 12px; }

.name {
  font-size: 16px;
  font-weight: bold;
  vertical-align: middle; }

.bodyCopy {
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.8; }

#shoes .layout_b {
  width: 100%;
  margin-bottom: 30px; }
  #shoes .layout_b .unit {
    display: inline-block;
    overflow: hidden;
    width: 48%; }
    #shoes .layout_b .unit.sp {
      display: none; }
    #shoes .layout_b .unit .img {
      float: left;
      width: 47%; }
    #shoes .layout_b .unit .txtArea {
      float: right;
      width: 47%; }
    #shoes .layout_b .unit:nth-child(3) {
      float: right;
      background: #ddd; }
    #shoes .layout_b .unit .name {
      font-size: 14px;
      line-height: 1.2;
      overflow: visible; }
      #shoes .layout_b .unit .name .no {
        border-radius: 50%;
        background-color: #27acb8;
        color: #fff;
        display: inline-block;
        width: 16px;
        height: 16px;
        line-height: 16px;
        text-align: center;
        margin-right: 5px;
        float: left; }
      #shoes .layout_b .unit .name .text {
        display: block;
        overflow: hidden; }
@media screen and (max-width: 768px) {
  #shoes .layout_b .unit {
    width: 46.26%; }
    #shoes .layout_b .unit.pc {
      display: none; }
    #shoes .layout_b .unit.sp {
      display: block; }
    #shoes .layout_b .unit .img {
      float: none;
      width: 100%; }
    #shoes .layout_b .unit .txtArea {
      float: none;
      width: 100%; }
    #shoes .layout_b .unit .name {
      margin-top: 12px; } }

.itemDetail {
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
  margin-top: 50px; }
  .itemDetail .main {
    width: 48.2%; }
  .itemDetail .unitList {
    width: 48.2%; }
    .itemDetail .unitList .unit {
      width: 46.26%;
      margin-top: 30px; }
      .itemDetail .unitList .unit:nth-child(-n+2) {
        margin-top: 0; }
      .itemDetail .unitList .unit .name {
        font-size: 14px;
        line-height: 1.2;
        overflow: visible; }
        .itemDetail .unitList .unit .name .no {
          border-radius: 50%;
          background-color: #27acb8;
          color: #fff;
          display: inline-block;
          width: 16px;
          height: 16px;
          line-height: 16px;
          text-align: center;
          margin-right: 5px;
          float: left; }
        .itemDetail .unitList .unit .name .text {
          display: block;
          overflow: hidden; }
      .itemDetail .unitList .unit .bodyCopy {
        font-size: 12px; }

@media screen and (max-width: 768px) {
  .localNav {
    font-size: 14px;
    padding-top: 40px; }
    .localNav ul li {
      max-width: 240px;
      width: 30%;
      margin: 0 1.1%; }
      .localNav ul li a {
        padding: 12px; }

  .mainCopy {
    margin-top: 30px; }

  .categoryName {
    font-size: 16px;
    margin-top: 40px;
    padding: 12px 16px; }

  .aboutOrange {
    margin-top: 40px; }

  .unit {
    width: 46.26%;
    margin-top: 30px; }

  .itemDetail {
    margin-top: 40px; }
    .itemDetail .main {
      width: 100%; }
    .itemDetail .unitList {
      width: 100%; }
      .itemDetail .unitList .unit .name br {
        display: none; }
      .itemDetail .unitList .unit:nth-child(-n+2) {
        margin-top: 30px; } }
@media screen and (max-width: 480px) {
  .localNav {
    font-size: 14px;
    padding-top: 30px; }
    .localNav ul {
      display: block; }
      .localNav ul li {
        max-width: 100%;
        width: 100%;
        margin: 5px 0 0; }
        .localNav ul li:first-child {
          margin: 0; }
        .localNav ul li a {
          padding: 10px; }

  .aboutOrange {
    display: block; }
    .aboutOrange .logo {
      width: 50% !important;
      margin: 0 auto; }
    .aboutOrange .text {
      width: 100% !important;
      margin-top: 20px; } }
/******************************************************

 equipment01
 
******************************************************/
@media screen and (max-width: 768px) {
  .mainCopy .br-cl {
    display: none !important; } }

#kitchen .aboutOrange .logo {
  width: 27.6%; }
#kitchen .aboutOrange .text {
  width: 62.5%;
  font-size: 16px;
  line-height: 1.8; }
#kitchen .itemDetail .main .bodyCopy {
  margin-bottom: 20px; }

#powderroom .aboutOrange .text {
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.8; }
#powderroom .categoryName + .name,
#powderroom .itemDetail {
  margin-top: 35px; }
  #powderroom .categoryName + .name .main .img .note,
  #powderroom .itemDetail .main .img .note {
    right: inherit;
    left: 5px; }

#bathroom .unitList + .note {
  margin-top: 35px; }

/******************************************************

 equipment02
 
******************************************************/
#share .aboutOrange .logo, #shoes .aboutOrange .logo, #closet .aboutOrange .logo {
  width: 30%; }
#share .aboutOrange .text, #shoes .aboutOrange .text, #closet .aboutOrange .text {
  width: 59%; }
#share .itemDetail + .note, #shoes .itemDetail + .note, #closet .itemDetail + .note {
  margin-top: 35px; }

#shoes, #closet, #otherCloset {
  border-top: 1px solid #dddddd;
  margin-top: 50px; }

#otherCloset {
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap; }
  #otherCloset #walkin, #otherCloset #futon {
    width: 47%;
    margin-top: 35px; }
    #otherCloset #walkin .img, #otherCloset #futon .img {
      margin-top: 20px; }

@media screen and (max-width: 768px) {
  #shoes, #closet, #otherCloset {
    margin-top: 40px; }

  #otherCloset #walkin, #otherCloset #futon {
    width: 100%;
    margin-top: 30px; } }
/******************************************************

 equipment03
 
******************************************************/
#amenity .unitList:after {
  display: block;
  width: 30%;
  content: ''; }
