@charset "utf-8";
/* ==========================================================

title : 東建ウェブサイト 建築商品一覧 RC・ユニヴァリィ・プロシード
scope : 「RC・ユニヴァリィ・プロシード」

last modify : 2020/12/22 Doan Thi Tuong Vi 改修

2020/04/05 306_Kondou
=============================================================== */

/* --------------------------------------------------------
  共通
==========================================================
  /apartment/2_4_suite_terrace/
---------------------------------------------------------- */
header#header_3rd #logoarea {
  margin: 10px 0 0 17px;
}

/* -area
---------------------------------------------------------- */
[id$="-area"] {
  margin: 0 auto;
}

[id$="-area"] p {
  line-height: 27px;
}

/* 詳しくはこちら共通 */
[id$="-area"] .btn_info {
  background: #fff;
  display: block;
  height: 35px;
  width: 150px;
}

[id$="-area"] a.btn_info:hover {
  opacity: 1;
}

/* -box
---------------------------------------------------------- */
[class$="-box"] {
  margin: auto;
  width: 1020px;
}

/* --------------------------------------------------------
  トップページ
==========================================================
  /apartment/2_4_europure_f3/
---------------------------------------------------------- */

/* #top-area
---------------------------------------------------------- */
#top-area {
  background-color: #403131;
  height: 100%;
}

#top-area h1 {
  margin: 0 auto;
  overflow: hidden;
  position: absolute;
  left: calc(50% - 490px);
  top: 0;
  width: 980px;
  z-index: 2;
}

/* #visual
---------------------------------- */
#visual {
  color: #000;
  height: 512px;
  overflow: hidden;
  position: relative;
  text-align: center;
  width: 100%;
}

#visual .fader-slides-wrap {
  width: 100%;
}

#visual .slide {
  background: #000 none no-repeat scroll center top;
  display: block;
  height: 512px;
  margin-left: -50%;
  position: absolute;
  left: 50%;
  top: 0;
  text-align: center;
  width: 100%;
}

#visual .slide span {
  background: #111;
  display: block;
  margin: 0 auto;
  width: 980px;
}

#visual .slide img {
  -webkit-box-shadow: 0 2px 15px rgba(0, 0, 0, .75);
  box-shadow: 0 2px 15px rgba(0, 0, 0, .75);
}

#visual a:hover,
#visual a:hover img {
  opacity: 1;
}

/* #slider
---------------------------------- */
#slider {
  display: table;
  margin: 0 auto;
  padding: 34px 0 33px;
  position: relative;
  width: 843px;
  z-index: 1;
}

#slider a:hover,
#slider a:hover img {
  opacity: 1;
}

#slider .nav {
  display: table-row;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  width: 843px;
}

#slider .nav li {
  width: 192px;
  /* display:table-cell; */
}

/* #slider .nav li:nth-child(3){
  width: 240px;
} */

/* #slider .nav li > a
---------------------------------- */
#slider .nav li>a {
  display: block;
  height: 100px;
  width: 192px;
}

#slider .nav li>a .img {
  display: block;
  height: 100px;
  text-indent: -9999999px;
  -webkit-transition: all .8s;
  transition: all .8s;
  width: 192px;
}

#slider .nav li:nth-child(1)>a .img {
  background: url(../image/img_slide1_sam.png?date=20201216) 0 0 no-repeat;
  background-size: contain;
}

#slider .nav li:nth-child(1)>a.js_current .img {
  background: url(../image/img_slide1_sam_ov.png?date=20201216) 0 0 no-repeat;
  background-size: contain;
}

#slider .nav li:nth-child(2)>a .img {
  background: url(../image/img_slide2_sam.png?date=250626) 0 0 no-repeat;
  background-size: contain;
}

#slider .nav li:nth-child(2)>a.js_current .img {
  background: url(../image/img_slide2_sam_ov.png?date=250626) 0 0 no-repeat;
  background-size: contain;
}

#slider .nav li:nth-child(3)>a .img {
  background: url(../image/img_slide3_sam.png?date=250626) 0 0 no-repeat;
  background-size: contain;
}

#slider .nav li:nth-child(3)>a.js_current .img {
  background: url(../image/img_slide3_sam_ov.png?date=250626) 0 0 no-repeat;
  background-size: contain;
}

#slider .nav li:nth-child(4)>a .img {
  background: url(../image/img_slide4_sam.png?date=20201216) 0 0 no-repeat;
  background-size: contain;
}

#slider .nav li:nth-child(4)>a.js_current .img {
  background: url(../image/img_slide4_sam_ov.png?date=20201216) 0 0 no-repeat;
  background-size: contain;
}

/* #top-concept-area
---------------------------------------------------------- */
#top-concept-area {
  background: #fcfaf2;
  position: relative;
}

#top-concept-area>.inner-box {
  padding-top: 59px;
  position: relative;
  text-align: center;
}

#top-concept-area>.inner-box h2 {
  text-align: center;
}

#top-concept-area>.inner-box p {
  margin: 21px auto 0;
  max-width: 715px;
}

#top-concept-area .block-image {
  background: #000;
  margin-top: 44px;
}

#top-concept-area .inner-image {
  margin: 0 auto;
  max-width: 980px;
  position: relative;
}

/* #top-design-area
---------------------------------------------------------- */
#top-design-area {
  background-color: #524b38;
  border-top: 10px solid #000;
  color: #fff;
}

#top-design-area>.inner-box {
  height: 398px;
  position: relative;
}

#top-design-area h2 {
  position: absolute;
  left: 59px;
  top: 116px;
}

#top-design-area h2+p {
  position: absolute;
  left: 60px;
  top: 149px;
  text-align: justify;
  text-indent: -.5em;
  width: 22.5em;
}

#top-design-area h2+p+figure {
  position: absolute;
  left: 50%;
}

#top-design-area .btn_info {
  position: absolute;
  bottom: 117px;
  left: 301px;
}

/* #top-equipment-area
---------------------------------------------------------- */
#top-equipment-area {
  border-top: 10px solid #000;
}

#top-equipment-area>.inner-box {
  height: 266px;
  position: relative;
}

#top-equipment-area h2 {
  position: absolute;
  left: 566px;
  top: 49px;
}

#top-equipment-area h2+p {
  position: absolute;
  left: 566px;
  top: 83px;
  text-align: justify;
  text-justify: inter-ideograph;
  width: 22.98em;
}

#top-equipment-area .btn_info {
  position: absolute;
  bottom: 50px;
  right: 63px;
}

/* #top-security-area
---------------------------------------------------------- */
#top-security-area {
  background-color: #524b38;
  border-top: 10px solid #000;
  color: #fff;
}

#top-security-area>.inner-box {
  height: 266px;
  position: relative;
}

#top-security-area h2 {
  position: absolute;
  left: 61px;
  top: 49px;
}

#top-security-area h2+p {
  position: absolute;
  left: 62px;
  top: 83px;
  text-align: justify;
  width: 22.8em;
}

#top-security-area h2+p+figure {
  position: absolute;
  left: 50%;
}

#top-security-area .btn_info {
  position: absolute;
  bottom: 50px;
  left: 302px;
}

/* #top-flexibility-area
---------------------------------------------------------- */
#top-flexibility-area {
  background-color: #524b38;
  border-top: 10px solid #000;
  color: #fff;
}

#top-flexibility-area>.inner-box {
  height: 266px;
  position: relative;
}

#top-flexibility-area h2 {
  position: absolute;
  left: 569px;
  top: 51px;
}

#top-flexibility-area h2+p {
  position: absolute;
  left: 569px;
  top: 84px;
  text-align: justify;
  text-justify: inter-ideograph;
  width: 22.98em;
}

#top-flexibility-area .btn_info {
  position: absolute;
  bottom: 49px;
  right: 59px;
}

/* #top-feature-area
---------------------------------------------------------- */
#top-feature-area {
  background-color: #524b38;
  border-bottom: 10px solid #000;
  border-top: 10px solid #000;
  color: #fff;
}

#top-feature-area>.inner-box {
  height: 266px;
  position: relative;
}

#top-feature-area h2 {
  position: absolute;
  left: 61px;
  top: 50px;
}

#top-feature-area h2+p {
  position: absolute;
  left: 61px;
  top: 85px;
  text-align: justify;
  width: 22.8em;
}

#top-feature-area h2+p+figure {
  position: absolute;
  left: 50%;
}

#top-feature-area .btn_info {
  position: absolute;
  bottom: 49px;
  left: 302px;
}

/* fancybox
---------------------------------------------------------- */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp {
  overflow: visible;
}

.fcb a {
  display: block;
  position: relative;
}

.fcb a img:nth-of-type(2) {
  position: absolute;
  left: 4px;
  top: 4px;
}