@charset "utf-8";
/**=========================================
* NAME:module.css
* OUTLINE:各パーツのスタイルの詳細を記述します;
*
* 1.MANSION_LIST
* 2-1.1_COLUMN_BLOCK(OBLONG-BLOCK)
* 2-2.2_COLUMN_BLOCK(OBLONG-BLOCK)
* 3.ATLAS_CLUB,ATLAS_COLLECTION
* 4.MANSION_TAG
* 5.TITLE_VISUAL
* 6.SMART_PHONE-640
* 7.SMART_PHONE-480
* 8.ATLAS_ABOUT_MARGE
=========================================*/

/**=========================================
* 1.MANSION_LIST
* * マンションリストのスタイルを記述します。
=========================================*/
  /* for_bg-wrapper */
  .bg_white-wrapper{
    background-color:#fbfbfb;
  }

  /* [section] mansion_list */
  .mansion_list .section-container{
    width:1024px;
    position:relative;
    margin-bottom:30px;
  }

  .mansion_list-block{
    margin-top:35px;
  }

  .mansion_list-block .block_item{
    border:1px solid #e9e9e9;
  }

  .mansion_list-block .img-block_item{
    display: block;
      width:312px;
      height:312px;
  }

  .mansion_list-block img.bukken_image{
      position:relative;
      width:312px;
      height:312px;
   }

  .mansion_list-block .img-block_item .center_center img{
    width:123px;
    height:54px;
    left:-64px;
    top:-27px;
  }
/*
  .mansion_list-block .tag-block_item{
    height:312px;
  }
*/
  .mansion_list-block .content-block_item-container{
    display: block;
    padding:25px 20px 15px 20px;
    top:320px;
  }

  .mansion_list-block h3{
    font-size:15px;
    margin-bottom:8px;
  }

  .mansion_list-block p{
    font-size:13px;
    line-height:15px;
  }

  .mansion_list-block .hidden-block_item-wrapper{
    display:block;
  }

  .mansion_list-block .hidden-block_item{
    display:none;
    position: absolute;
    background-image:url("/atlas/common/img/mansion/item/bg-mansion_list-mouse_over.png");
    height: 100%;
    width: 100%;
    z-index:1;
    opacity:0;
    filter: alpha(opacity=0);
    -ms-filter: "alpha(opacity=0)";
    -moz-opacity:0;
    -khtml-opacity: 0;
    zoom:1;
  }

  .mansion_list-block .hidden-block_item-container{
    padding:24px 18px;
  }

  .mansion_list-block .hidden-block_item h3{
    padding-bottom:12px;
    line-height:18px;
    margin: 0 3px 12px 3px;
    border-bottom:1px solid #a8a8a8;
  }

  .mansion_list-block .hidden-block_item span{
    display:inline-block;
    color:#fff;
    text-align:center;
    padding:5px 0px;
    margin: 0 2px 4px 1px;
    font-size:12px;
    width:85px;
    background-color:#474747;
  }

  .mansion_list-block .hidden-block_item p{
    font-size:12px;
    line-height:18px;
    margin-top:5px;
    padding: 0px 3px;
  }

  .mansion_list-block .hidden-block_item img{
    position:absolute;
    bottom:1px;
    left:1px;
  }

  /* now XX count */
  .list_count_value{
    margin:11px 10px 20px 10px;
  }

  .list_count_value span{
    font-size:24px;
    margin-right:3px;
  }

  /* read next XX count */
  .btn_next_list{
    width:100%;
    text-align:center;
    background-color:#998e80;
  }

  .btn_next_list p{
    cursor:pointer;
    color:#fff;
    display:block;
    font-size:14px;
    padding:13px 0px;
  }

  .btn_next_list p:before{
    content:"";
    padding:0px 15px;
    margin-right:10px;
    background-image:url("/atlas/common/img/btn-list-next_down_allow.png");
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
  }

  /* see other mansion */
  .mansion_list .btn-wrapper{
    display:block;
    text-align:center;
    margin-bottom:20px;
  }

  /* used mansion */
  .mansion_list-block.used_mansion .block_item{
    height:auto;
  }

  .used_mansion.mansion_list-block .content_detail-block_item{
    width:100%;
  }

  .used_mansion.mansion_list-block .content_detail-block_item-container{
    /*position:absolute;*/
    /*top:385px;*/
    padding: 0 20px 20px 20px;
    /*margin-top:50px;*/
  }

/*  .used_mansion.mansion_list-block .content_detail-block_item-container:before{
    content:"";
    border-top:1px solid #e9e9e9;
    display:block;
    width:100%;
  }*/

  .used_mansion.mansion_list-block .content_detail-block_item table{
    margin-top:10px;
  }

  .used_mansion.mansion_list-block .content_detail-block_item td{
    vertical-align:middle;
    padding:7px;
    font-size:12px;
    line-height:15px;
  }

  .used_mansion.mansion_list-block .content_detail-block_item td:first-child{
    width:70px;
  }

  .used_mansion.mansion_list-block .content_detail-block_item td.strong{
    font-weight:bold;
    font-size:15px;
  }

  .used_mansion.mansion_list-block .content_detail-block_item tr.bg_brown{
    background-color:#ddd5cd;
  }

  .used_mansion.mansion_list-block .content_detail-block_item p{
    margin-top:15px;
  }

/**=========================================
* 2-1.1_COLUMN_BLOCK(OBLONG-BLOCK)
* * 1カラムのブロックのスタイルを記述します。
=========================================*/
  /* for_bg-wrapper */
  .bg_gray-wrapper{
    background-image:url("/atlas/img/index/bg-sub_wrapper.png");
    background-repeat:repeat-x;
    background-size:contain;
    padding-top:65px;
    padding-bottom:50px;
  }

    /* column1-block(oblong-block) */
  .column1-block{
    height:220px;
    margin-top:45px;
  }

  .column1-block .img-block_item{
    width:499px;
  }

  .column1-block .content-block_item{
    width:473px;
    height:220px;
  }

  .column1-block .content-block_item-container{
    width:422px;
    margin-left:45px;
  }

  .column1-block h3{
    font-size:20px;
    margin-bottom:15px;
  }

  .column1-block h4{
    margin-top:-10px;
    margin-bottom:15px;
  }

  .column1-block p{
    line-height:21px;
    letter-spacing:1px;
  }

  .column1-block .link-block_item{
    height:220px;
    width:27px;
  }

  .column1-block .link-block_item img{
    width:100%;
    height:100%;
  }

/**=========================================
* 2-2.2_COLUMN_BLOCK(OBLONG-BLOCK)
* * 2カラムのブロックのスタイルを記述します。
=========================================*/
  /* column2-block(oblong-block) */
  .column2-block{
    width:480px;
    height:160px;
    float:left;
    margin:35px 0px 0px 35px;
  }

  .column2-block:first-child{
    margin-left:0px;
  }

  .column2-block .img-block_item{
    width:160px;
  }

  .column2-block .content-block_item{
    width:294px;
    height:160px;
  }

  .column2-block .content-block_item h3{
    font-size:17px;
    line-height:26px;
  }

  .column2-block .content-block_item img{
    margin-bottom:10px;
  }

  .column2-block .content-block_item-container{
    width:240px;
    padding:0px 20px;
  }

  .column2-block .link-block_item{
    height:160px;
    width:25px;
  }

  .column2-block .link-block_item img{
    width:100%;
    height:100%;
  }

/**=========================================
* 3.ATLAS_CLUB,ATLAS_COLLECTION
* * アトラスクラブ、アトラスコレクションへのリンクエリアのスタイルを記述します。
=========================================*/
  /* [section] club_invitation */
  .club_invitation{
    background-image:url("/atlas/common/img/atlas-club_invitation/bg-atlas-club.png");
    background-size:cover;
    height:380px;
  }

  /* [section] club_collection */
  .club_collection{
    background-image:url("/atlas/common/img/atlas_collection/bg-atlas_collection.png");
    background-size:cover;
    height:380px;
  }

  .invitation-collection .collection{
    height:282px;
  }

  .club_collection .unique_link-block .content-block_item-container{
    margin-top:15px;
  }

  /* section-container(invitation-collection) */
  .invitation-collection .section-container{
    margin-bottom:0px;
    height:380px;
  }

  /* unique_link-block */
  .unique_link-block{
    background: none;
    border: none;
    width: 995px;
    margin-top: 0px;
  }

  .unique_link-block .img-block_item{
    width:500px;
    height:220px;
  }

  .unique_link-block .content-block_item{
    float:right;
    width: 473px;
    height: 220px;
    display: block;
  }

  .club_collection .content-block_item{
    height:282px;
  }

  .unique_link-block .content-block_item-container{
    float: left;
    margin-left: 80px;
  }

  .unique_link-block h2{
    margin-bottom:28px;
  }

  .unique_link-block p{
    line-height:22px;
    margin-bottom:28px;
    width:330px;
  }

  .unique_link-block a span{
    display:block;
    background-color:#fff;
    line-height:0;
    width:334px;
  }

/**=========================================
* 4.MANSION_TAG
* * マンションリストのタグのスタイルを記述します。
=========================================*/
  .mansion-tag{
    height:26px;
    background-size:contain;
    background-repeat:no-repeat;
  }

  .mansion-tag.new{
    width:60px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-new.png");
  }

  .mansion-tag.reservation{
    width:116px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-reservation01.png");
  }

  .mansion-tag.sold_out{
    width:59px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-sold_out.png");
  }

  .mansion-tag.sale_now{
    width:65px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-sale_now.png");
  }

  .mansion-tag.sale_plan{
    width:79px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-sale_plan.png");
  }

  .mansion-tag.tokyo_23{
    width:76px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-tokyo_23.png");
  }

  .mansion-tag.tokyo_23_outer{
    width:88px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-tokyo_23_outer.png");
  }

  .mansion-tag.tyubu{
    width:52px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-tyubu.png");
  }

  .mansion-tag.nishi_nihon{
    width:60px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-nishi_nihon.png");
  }

  .mansion-tag.kansai{
    width:52px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-kansai.png");
  }

  .mansion-tag.kanagawa{
    width:74px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-kanagawa.png");
  }

  .mansion-tag.sonota{
    width:60px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-sonota.png");
  }
  .mansion-tag.complete_contract{
    width:81px;
    background-image:url("/atlas/common/img/mansion/mansion_status_tag/tag-complete_contract.png");
  }

/**=========================================
* 5.TITLE_VISUAL
* * タイトルビジュアルのスタイルを記述します。
=========================================*/
  .atlas-club .title_visual-container{
    background-image:url("/atlas/img/atlas-club/title_visual/title_visual.jpg");
  }

  .title_visual-container.used_mansion{
    background-image:url("/atlas/img/used/title_visual/title_visual.jpg");
  }

  .title_visual-container.investment_mansion{
    background-image:url("/atlas/img/investment/title_visual/title_visual.jpg");
  }

/**=========================================
* 6.SMARTPHONE-640
* * スマートフォン用のスタイルを記述します。
=========================================*/
@media screen and (max-width:640px) {
  /**=========================================
  * 1.MANSION_LIST
  =========================================*/
    .mansion_list .section-container{
      width:100%;
    }

    .list_count_value{
      font-size:28px;
      text-align:center;
    }

    .list_count_value span{
      font-size:38px;
      text-align:center;
      display: inline-block;
      margin-right: 5px;
    }

    .mansion_list-block .block_item{
      margin:0px 0px 5% 0px;
    }

    .mansion_list-block.used_mansion .block_item{
      height:auto;
    }

    .mansion_list-block .img-block_item{
        width:30%;
        height:auto;
    }

    .mansion_list-block img.bukken_image{
        width:100%;
        height:auto;
     }

    .mansion_list-block .img-block_item .center_center img{
      width:100%;
      height:auto;
      top:0px;
      left:-5px;
    }

    .mansion_list-block .content-block_item-container{
      padding:0;
    }

    .mansion_list-block h3{
      font-size:24px;
    }

    .mansion_list-block p{
      font-size:20px;
      line-height:27px;
    }

    .mansion_list-block .content-block_item p{
      position:absolute;
      bottom:13%;
    }

    .mansion_list-block .tag-block_item{
      height:auto;
    }

    /* hidden-block_item */
    .mansion_list-block .hidden-block_item-wrapper{
      display:none;
    }

    /* btn_next */
    .btn_next_list{
      width:80%;
      margin:auto;
    }

    .btn_next_list p{
      font-size:24px;
      padding:5%;
    }

    .btn_next_list p:before{
      padding-left: 4%;
      padding-right: 4%;
      margin-right: 3%;
    }

    /* used_mansion */
    .used_mansion .img-block_item{
      float:right;
      margin:4% 5% 3% 0;
    }

    .used_mansion.column3-block .block_item:before{
      content:none;
    }

    .used_mansion.column3-block .content-block_item,
    .used_mansion.column3-block .tag-block_item{
      width:55%;
    }

    .used_mansion.mansion_list-block .content-block_item p{
      position:relative;
    }

    .used_mansion.mansion_list-block .content_detail-block_item{
      float:left;
      width:90%;
      margin:0 5% 5% 5%;
    }

    .used_mansion.mansion_list-block .content_detail-block_item-container{
      /*position:relative;*/
      top:0px;
      padding:0px;
      margin-top:0px;
    }

    .used_mansion.mansion_list-block .content_detail-block_item table{
      width:100%;
    }

    .used_mansion.mansion_list-block .content_detail-block_item td{
      font-size:20px;
      line-height:27px;
      padding:2%;
    }

    .used_mansion.mansion_list-block .content_detail-block_item td:first-child{
      width:33%;
    }

    .used_mansion.mansion_list-block .content_detail-block_item td.strong{
      font-size:24px;
    }

    .used_mansion.mansion_list-block .content_detail-block_item .more_detail{
      position:relative;
      width:100%;
      border:1px solid #ae967c;
      text-align:center;
      margin-top:15px;
      padding:15px 0px;
    }

    .used_mansion.mansion_list-block .content_detail-block_item .more_detail span{
      color:#ae967c;
      font-size:17px;
      width:95%;
      display:inline-block;
      background-image: url("/atlas/common/img/btn-mansion_list-sp-left_arrow.png");
      background-repeat: no-repeat;
      background-position: right center;
      background-size: 3%;
    }

  /**=========================================
  * 2-1.1_COLUMN_BLOCK
  =========================================*/
    .bg_gray-wrapper{
      padding-bottom:0px;
    }
    .column1-block{
      height:100%;
      margin-top:10%;
    }

    .column1-block .img-block_item{
      width:100%;
    }

    .column1-block .img-block_item img{
      width:100%;
      height:auto;
    }

    .column1-block .content-block_item{
      width:100%;
      height:auto;
      min-height:110px;
      margin:7% 0;
    }

    .column1-block .content-block_item-container{
      width:85%;
      margin:0;
    }

    .column1-block h3{
      font-size:24px;
      margin-bottom:5%;
    }

    .column1-block p{
      font-size: 20px;
      line-height: 30px;
    }

  /**=========================================
  * 2-2.2_COLUMN_BLOCK(OBLONG-BLOCK)
  =========================================*/
    /* column2-block(oblong-block) */
    .column2-block{
      width:100%;
      height:auto;
      margin:35px 0px 0px;
      border-top:2px solid #ebebeb;
      border-bottom:2px solid #ebebeb;
    }

    .column2-block .img-block_item{
      width:30%;
      margin:5%;
    }

    .column2-block .content-block_item{
      width:60%;
      height:auto;
    }

    .column2-block .content-block_item img{
      width:25%;
      margin-bottom:0;
    }

    .column2-block .content-block_item-container{
      width:85%;
      padding:0 10% 0 0;
      background-size:6%;
    }

  /**=========================================
  * 3.ATLAS_CLUB,ATLAS_COLLECTION
  =========================================*/
    .invitation-collection{
      height:auto;
      background-size:100% 100%;
    }

    .club_invitation{
      background-image:url("/atlas/common/img/atlas-club_invitation/bg-sp-atlas-club.png");
    }

    .club_collection{
      background-image:url("/atlas/common/img/atlas_collection/bg-sp-atlas_collection.png");
    }

    .invitation-collection .collection{
      height:auto;
    }

    .invitation-collection .section-container{
      height:auto;
    }

    .invitation-collection .section-container:before{
      content:none;
    }

    .unique_link-block{
      width:100%;
      height:auto;
    }

    .unique_link-block .content-block_item{
      float:none;
      width:100%;
      height:auto;
    }

    .unique_link-block .content-block_item-container{
      margin:10% 5% 0% 5%;
    }

    .club_collection .unique_link-block .content-block_item-container{
      margin-top:10%;
    }

    .unique_link-block h2{
      margin-bottom:5%;
    }

    .unique_link-block h2 img{
      width:90%;
    }

    .unique_link-block p{
      width:100%;
      font-size:20px;
      line-height:30px;
    }

    .unique_link-block .img-block_item{
      width:90%;
      height:auto;
      margin:0px 5%;
    }

    .unique_link-block .img-block_item img{
      position:relative;
      width:100%;
    }

    .unique_link-block .link-block_item{
      margin:5% 5% 10% 5%;
    }

    .unique_link-block a span{
      width:auto;
    }

    /**=========================================
    * 5.TITLE_VISUAL
    =========================================*/
      .atlas-club .title_visual-container{
        background-image:url("/atlas/img/atlas-club/title_visual/sp-title_visual.jpg");
      }

      .title_visual-container.used_mansion{
        background-image:url("/atlas/img/used/title_visual/sp-title_visual.jpg");
      }

      .title_visual-container.investment_mansion{
        background-image:url("/atlas/img/investment/title_visual/sp-title_visual.jpg");
      }
}

/**=========================================
* 7.SMARTPHONE-480
* * スマートフォン用のスタイルを記述します。
=========================================*/
@media screen and (max-width:480px) {
  /**=========================================
  * 1.MANSION_LIST
  =========================================*/
    .mansion_list-block .content-block_item h3{
      font-size:15px;
    }

    .mansion_list-block p{
      font-size: 12px;
      line-height:20px;
    }

    /* used_mansion */
    .mansion_list-block .content-block_item .mansion_detail td{
      font-size:12px;
    }

    .used_mansion.mansion_list-block .content_detail-block_item td{
      font-size:12px;
      line-height:20px;
    }

    .used_mansion.mansion_list-block .content_detail-block_item td.strong{
      font-size:17px;
    }

  /**=========================================
  * 2-1.1_COLUMN_BLOCK
  =========================================*/
    .column1-block .content-block_item{
      min-height:60px;
    }

    .column1-block h3{
      font-size:17px;
    }

    .column1-block p{
      font-size:15px;
      line-height:20px;
    }

  /**=========================================
  * 2-2.2_COLUMN_BLOCK
  =========================================*/
    .column2-block .content-block_item h3{
      font-size:15px;
      line-height:20px;
    }

  /**=========================================
  * 3.ATLAS_CLUB,ATLAS_COLLECTION
  =========================================*/
    .unique_link-block p{
      font-size:15px;
      line-height:22px;
    }

  /**=========================================
  * 4.MANSION_TAG
  =========================================*/
    .mansion-tag{height:20px;}
    .mansion-tag.new{                    width:46px;}
    .mansion-tag.reservation{            width:89px;}
    .mansion-tag.sold_out{               width:45px;}
    .mansion-tag.sale_now{               width:50px;}
    .mansion-tag.sale_plan{              width:60px;}
    .mansion-tag.tokyo_23{               width:58px;}
    .mansion-tag.tokyo_23_outer{         width:67px;}
    .mansion-tag.tyubu{                  width:40px;}
    .mansion-tag.nishi_nihon{            width:46px;}
    .mansion-tag.kansai{                 width:40px;}
    .mansion-tag.kanagawa{               width:56px;}
    .mansion-tag.sonota{                 width:46px;}
    .mansion-tag.complete_contract{      width:62px;}

    .mansion_list-block .content-block_item-container{
      padding:0;
    }
    .mansion_list-block h3{
      font-size:10px;
    }

}

/**=========================================
* 8.ATLAS_ABOUT_MARGE
* * アトラスの家づくりのスタイルを記述します。
=========================================*/
.local_navigation li .local_nav_blank {
  position: relative;
  padding-left: 16px;
}
.local_navigation li .local_nav_blank:before {
  display: block;
  position: absolute;
  left: 0;
  content: url("/atlas/img/about/a-target_blank03.png");
}
.local_navigation li .local_nav_blank em {
  color: #ffffff;
  font-size: 11px;
  font-style: normal;
}

.title_visual-container.about {
  background-image: url("/atlas/img/about/title_visual/title_visual.jpg");
}