@charset "utf-8";

/* .danang-topimg
================================================== */
.danang-topimg {
  position: relative;
  width: 100%;
  height: 65vh;
  min-height: 450px;
  overflow:hidden;
  z-index:1;
}

@media screen and (max-width: 810px) {
.danang-topimg {
  margin:-10px 0 3%;
  height: auto;
}
}

@media screen and (max-width: 568px) {
.danang-topimg {
  min-height: 350px;
  max-height: 430px;
  margin:-15px 0 3%;
}
}

#bgs_danan {
  background-image: url("//www.danangvillarealty.com/images/danang-topimg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

@media screen and (max-width: 810px) {
#bgs_danan {
  background-attachment: scroll;
}
}

#bgs_hoi-An{
  background-image: url("//www.danangvillarealty.com/images/hoi-An-topimg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

@media screen and (max-width: 810px) {
#bgs_hoi-An {
  background-attachment: scroll;
}
}

#bgs_hai-chau{
  background-image: url("//www.danangvillarealty.com/images/hai-chau-topimg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

@media screen and (max-width: 810px) {
#bgs_hai-chau {
  background-attachment: scroll;
}
}

#bgs_ngu-hanh-son{
  background-image: url("//www.danangvillarealty.com/images/ngu-hanh-son-topimg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

@media screen and (max-width: 810px) {
#bgs_ngu-hanh-son {
  background-attachment: scroll;
}
}

#bgs_son-tra{
  background-image: url("//www.danangvillarealty.com/images/son-tra-topimg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

@media screen and (max-width: 810px) {
#bgs_son-tra {
  background-attachment: scroll;
}
}

#bgs_lien-chieu{
  background-image: url("//www.danangvillarealty.com/images/lien-chieu-topimg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

@media screen and (max-width: 810px) {
#bgs_lien-chieu {
  background-attachment: scroll;
}
}

#bgs_cam-le{
  background-image: url("//www.danangvillarealty.com/images/cam-le-topimg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

@media screen and (max-width: 810px) {
#bgs_cam-le {
  background-attachment: scroll;
}
}

#bgs_thanh-khe{
  background-image: url("//www.danangvillarealty.com/images/thanh-khe-topimg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

@media screen and (max-width: 810px) {
#bgs_thanh-khe {
  background-attachment: scroll;
}
}

/* .danang-box
================================================== */
.danang-box{
  width:100%;
  padding:3% 1%;
  box-sizing: border-box;
}

.danang-box .dantx{
  padding:1% 2%;
  text-align: center;
  line-height: 2;
  font-family: Roboto,sans-serif;
  font-weight:400;  
  font-size:1.05em;
}

@media screen and (max-width: 568px) {
.danang-box .dantx{
  text-align: left;
  line-height: 1.8;
  font-size:1em;
}
}

.danang-box img{
  width:auto;
  max-width:100%;
  height:auto;
  margin:1.5% auto;
}

/* .danang-erea-box
================================================== */
.danang-erea-box{
  width:100%;
  padding:3% 1%;
  box-sizing: border-box;
}

.danang-erea-box .dan-ttl{
  padding:1% 2%;
  text-align: center;
  font-family: 'Inter',sans-serif;
  font-weight:400;
  font-size:1.45em;
}

@media screen and (max-width: 810px) {
.danang-erea-box .dan-ttl{
  font-size:1.2em;
}
}

.danang-erea-box .dantx{
  padding:1% 2%;
  text-align: left;
  line-height: 2;
  font-family: Roboto,sans-serif;
  font-weight:400;  
  font-size:1.05em;
}

@media screen and (max-width: 568px) {
.danang-erea-box .dantx{
  text-align: left;
  line-height: 1.8;
  font-size:1em;
}
}

.danang-erea-ph{
  margin:1.5% auto 4%;
}

.danang-erea-ph img{
  width:auto;
  max-width:100%;
  height:auto;
}

.danang-erea-box table{
  width : 100%;
  margin : 2% auto;
  max-width:600px;
  background: #FFF;
  border-top : solid 1px #ccc;
  border-left : solid 1px #E0E0E0;
  border-right : solid 1px #E0E0E0;
  font-size:14px;
  box-sizing: border-box;
  line-height:1.6;
}

@media screen and (max-width: 568px) {
.danang-erea-box table{
  font-size:13px;
}
}

.danang-erea-box td{
  padding : 14px 1% 10px 2.5%;
  box-sizing: border-box;
  width:60%
  color : #000000;
  border-bottom : solid 1px #E0E0E0;
  text-align : left;
}

.danang-erea-box th{
  color : #000;
  border-bottom : solid 1px #E0E0E0;
  border-right : solid 1px #E0E0E0;
  text-align : center;
  font-weight:normal;
  padding : 14px 5px 10px;
  background : #FBFBFB;
  box-sizing: border-box;
 width:40%;
}

@media only screen and (max-width: 568px)  {
.danang-erea-box td{
  padding : 10px 5px 6px 2.5%;
  width:50%;
  text-align : left;
}

.danang-erea-box th{
  padding : 10px 5px 6px;
  width:50%;
}
}

.danang-erea-box td p{
  margin:5px 0;
}

.danang-erea-box ul{
  width:100%;
  max-width:800px;
  margin:2% auto;
}

.danang-erea-box li{
  width:50%;
  display:inline-block;
  vertical-align:top;
  text-align: center;
  box-sizing: border-box;
  padding:2% 1%;
  font-size:14px;
}

@media only screen and (max-width: 568px)  {
.danang-erea-box li{
  font-size:13px;
}
}

.danang-erea-box li img{
  width:100%;
  height:auto;
  margin:0 0 10px;
}

/* .area_list
================================================== */
.area_list {
  width: 100%;
  padding:1.5% 0 5%;
  box-sizing: border-box;
  position: relative;
  text-align: center;
}

@media screen and (max-width: 810px) {
.area_list {
  padding:3% 1%;
  text-align: left;
}
}

.area_list ul{
  width:100%;
  margin:0 auto;
}

.area_list li{
  display:inline-block;
  vertical-align:top;
  text-align: center;
  box-sizing: border-box;
}

.area_list .img-wrapper {
  width:100%;
  height:auto;
  max-height:356px;
  display:block;
  text-align: center;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 810px) {
.area_list .img-wrapper {
  max-height:200px;
}
}

@media screen and (max-width: 680px) {
.area_list .img-wrapper {
  max-height:170px;
}
}

@media screen and (max-width: 568px) {
.area_list .img-wrapper {
  max-height:150px;
}
}

@media screen and (max-width: 500px) {
.area_list .img-wrapper {
  max-height:130px;
}
}


@media screen and (max-width: 400px) {
.area_list .img-wrapper {
  max-height:110px;
}
}

.area_list .img-wrapper img {
  width:100%;
  height:auto;
  margin:auto;
}

.area_list .w30{
  width:33.3333%;
  padding:10px;
}

@media screen and (max-width: 810px) {
.area_list .w30{
  padding:1px;
}
}

@media screen and (max-width: 568px) {
.area_list .w30{
  width:50%;
}
}

.area_list .img-wrapperL {
  width:100%;
  height:auto;
  max-height:356px;
  display:block;
  text-align: center;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 810px) {
.area_list .img-wrapperL {
  max-height:200px;
}
}

@media screen and (max-width: 680px) {
.area_list .img-wrapperL {
  max-height:170px;
}
}

@media screen and (max-width: 568px) {
.area_list .img-wrapperL {
  max-height:210px;
}
}

@media screen and (max-width: 500px) {
.area_list .img-wrapperL {
  max-height:190px;
}
}

@media screen and (max-width: 400px) {
.area_list .img-wrapperL {
  max-height:170px;
}
}

.area_list .img-wrapperL img {
  width:100%;
  height:auto;
  margin:auto;
}

.area_list .overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width:100%;
  height:100%;
  display:block;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.area_list .overlay p{
  letter-spacing:0.05em;
  font-weight:300;
  font-size:0.85em;
  line-height:1.6;
  color:#FFF;
  z-index: 2;
  position: relative;
  text-shadow:1px 1px 3px #000;
}

@media screen and (max-width: 810px) {
.area_list .overlay p{
  line-height:1.4;
  padding:0 5px;
}
}

@media screen and (max-width: 568px) {
.area_list .overlay p{
  letter-spacing:0.03em;
  text-shadow:1px 1px 1px #000;
}
}

.area_list .overlay strong{
  font-size:1.6em;
  letter-spacing:0.05em;
  font-family: 'Inter',sans-serif;
  font-weight:400;
}

@media screen and (max-width: 810px) {
.area_list .overlay strong{
  font-size:1.4em;
  margin-right:0px;
}
}

@media screen and (max-width: 568px) {
.area_list .overlay strong{
  font-size:1.3em;
}
}

@media screen and (max-width: 400px) {
.area_list .overlay strong{
  font-size:1.2em;
}
}

.area_sy{
  width: 100%;
  height: 100%;
  position: relative;
}

.area_list li a.bklink {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-indent: 100%;
  background: rgba(0, 0, 0, 0.15);
  z-index: 2;
}

.area_list li a.bklink:hover {
  opacity: 0.4;
  -webkit-transition: opacity 400ms;
  transition: opacity 400ms;
}

.area_list li a.tklink {
  color:#FFF;
  text-decoration: none;
}

.area_list li a.tklink:hover {
  color:#FFF;
  text-decoration: none;
  opacity: 0.8;
  -webkit-transition: opacity 400ms;
  transition: opacity 400ms;
}