@charset "utf-8";

.home-bigbanner {

  position: relative;

}

.bigbanner-page {

  position: relative;

}

.bigbanner-img {

  position: relative;

  line-height: 0;

}

.bigbanner-img img {

  width: 100%;

  height: calc(100vh - 280px);

  object-fit: cover;

}

.imgshadown {

  position: absolute;

  left: 0;

  top: 0;

  height: 100%;

  width: 100%;

  z-index: 1;

}

.bigbanner-typo {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  color: #fff;

  z-index: 100;

}

.home-bigbanner .box-viewmore a {

  color: #fff;

  background-image: url(../images/icon-viewmore-white.svg);

}

.home-bigbanner .box-viewmore a span {

  border-color: #fff;

}

.box-news .box-viewmore a {

  background-size: auto 19px;

  font-size: 20px;

  padding: 2px 25px 2px 0;

}

.box-news {

  margin-bottom: 30px;

}

/*highlight*/



.home-highlight {

  text-align: center;

  margin-bottom: 100px;

  padding-top: 50px;

  background-image: url(../images/bg-hit-topright.svg);

  background-repeat: no-repeat;

  background-position: 98% 10px;

}

.home-highlight-in {

  background-image: url(../images/bg-hil-leftbottom.svg);

  background-repeat: no-repeat;

  background-position: left bottom;

}

.home-highlight .box-headline p {

  color: #646464;

  font-size: 50px;

  line-height: 60px;

}

.home-highlight .des-headline p {

  color: #646464;

  font-size: 30px;

  line-height: 32px;

  margin-bottom: 65px;

}

.home-highlight .des-headline p span {

  color: #ee3d96;

}

.img-highlight{

  line-height: 0;

}

.img-highlight img {

  width: 100%;

}

/*highlight*/



/*home_01*/

.home-banner01 {

  height: 600px;

  line-height: 0;

  background-image: url(../images/bg-home01.jpg);

  background-repeat: no-repeat;

  background-size: cover;

  display: flex;

  justify-content: center;

  align-items: center;

}

.home-banner01 .container {

  position: relative;

}

.box-opacity {

  max-width: 1170px;

  width: 100%;

  height: 36.8vh;

  transform: translate(-50%, -50%);

  -webkit-backdrop-filter: blur(8px);

  backdrop-filter: blur(8px);

  position: absolute;

  top: 50%;

  left: 50%;

}

.box-text-home {

  text-align: center;

  position: relative;

  z-index: 1;

}

.box-text-home h2 {

  font-size: 90px;

  line-height: 52px;

  color: #000;

  margin-bottom: 50px;

  letter-spacing: 3px;

  font-family: "DB Helvethaica X bold";

}

.box-text-home p {

  color: #ee3d96;

  font-size: 30px;

  line-height: 20px;

  letter-spacing: 2px;

  font-family: "DB Helvethaica X bold";

  margin-bottom: 5px;

}

.home-news p strong {

  font-weight: normal;

  color: #ee3d96;

  font-family: "DB Helvethaica X Reg";

}

.home-news {

  background-image: url(../images/bg-left-new.svg);

  background-repeat: no-repeat;

  background-position: -30px 250px;

  position: relative;

}

.home-news::after {

  background-image: url(../images/bg-news-bottomright.svg);

  background-repeat: no-repeat;

  background-position: right bottom;

  position: absolute;

  width: 40%;

  right: -10px;

  bottom: 0;

  z-index: -1;

  content: "";

  height: 100%;

}

/*home_01*/



/*home_02*/

.home-banner02 {

  height: 600px;

  line-height: 0;

  background-image: url(../images/bg-home02.jpg);

  background-repeat: no-repeat;

  background-size: auto;

  display: flex;

  justify-content: center;

  align-items: center;

  margin-bottom: 65px;

}

.home-banner02 .container {

  position: relative;

}

.home-banner02 .box-opacity {

  background-color: #fff;

  opacity: 0.3;

}

/*home_02*/



/*Activities*/

.home-news .box-headline {

  text-align: center;

}

.box-headline p {

  color: #646464;

  font-size: 50px;

  line-height: 50px;

  font-family: "DB Helvethaica X Reg";

}

.box-headline p:last-child {

  margin-bottom: 25px;

  display: block;

}

.home-news .box-viewmore {

  text-align: center;

  margin-bottom: 60px;

}

.img-thumnail-activities {

  position: relative;

  width: 100%;

  margin-bottom: 20px;

  overflow: hidden;

}

.box-activities-big .img-thumnail-activities {

  padding-top: 70%;

}

.box-activities-small .img-thumnail-activities {

  padding-top: 70.1%;

}

.img-thumnail-activities a {

  position: absolute;

  top: 0;

  left: 0;

  bottom: 0;

  right: 0;

}

.img-thumnail-activities a img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.date-activities {

  font-size: 25px;

  line-height: 20px;

  color: #ee3d96;

  font-family: "DB Helvethaica X Med";

  margin-bottom: 10px;

}

.detail-activities a {

  font-size: 25px;

  line-height: 26px;

  color: #000;

  display: block;

  font-family: "DB Helvethaica X Med";

  margin-bottom: 5px;

  max-height: 50px;

  overflow: hidden;

}

.detail-activities a:hover {

  color: #ee3d96;

}

.detail-activities p {

  font-size: 23px;

  line-height: 25px;

  color: #646464;

  max-height: 100px;

  overflow: hidden;

}

.box-thumnail-activities .box-viewmore {

  text-align: left;

  margin-bottom: 40px;

}

.box-thumnail-activities .box-viewmore a {

  background-size: 19px;

  font-family: "DB Helvethaica X Reg";

  padding: 6px 30px 6px 0;

}

.box-thumnail-activities.box-activities-small.box-activities-paddingtop {

  padding-top: 130px;

}

.box-thumnail-activities.box-activities-small {

  padding-left: 20px;

  padding-right: 20px;

}

.box-thumnail-activities.box-activities-small .detail-activities p {

  margin-bottom: 20px;

}

.box-thumnail-activities.box-activities-big .detail-activities p {

  margin-bottom: 25px;

}

.row-eq-height {

  display: -webkit-box;

  display: -webkit-flex;

  display: -ms-flexbox;

  display: flex;

  flex-wrap: wrap;

}

.ccccc {

  -webkit-column-count: 3;

  column-count: 3;

  -webkit-column-gap: 55px;

  column-gap: 55px;

}

/* .box-thumnail-activities{

  width: 30%;

  float: left;

}

.content-activities .box-thumnail-activities:nth-child(1),

.content-activities .box-thumnail-activities:nth-child(4){

  width: 40%;

} */

/*Activities*/



.home-calculator {

  background-color: #f5f5f7;

  position: relative;

}

.box-control-calculator {

  display: flex;

  flex-direction: row;

}

.img-calculator {

  max-width: 575px;

  margin-right: 100px;

  line-height: 0;

  position: relative;

  height: 100%;

}

.img-calculator img {

  height: 100%;

}

.right-calculator {

  padding: 70px 0 40px 0;

}

.head-calculator h4 {

  font-size: 60px;

  line-height: 50px;

  color: #000000;

  font-family: "DB Helvethaica X Reg";

  margin-bottom: 15px;

}

.head-calculator p {

  font-size: 30px;

  line-height: 36px;

  color: #646464;

  margin-bottom: 15px;

}

.box-calculator-in {

  background-color: #fff;

  border-radius: 8px;

  padding: 30px 40px;

  max-width: 870px;

  min-height: 480px;

}

.title-calculator-in {

  font-size: 40px;

  line-height: 38px;

  margin-bottom: 10px;

  color: #000;

}

.box-input label {

  font-size: 25px;

  line-height: 30px;

  color: #000;

}

.box-input {

  position: relative;

  margin-bottom: 25px;

}

.box-input .form-control {

  color: #ee3d96;

  font-size: 50px;

  border-width: 0 0 1px 0;

  border-color: #cccccc;

  padding: 30px;

}

.text-unit {

  position: absolute;

  font-size: 22px;

  line-height: 30px;

  top: 50px;

  right: 0;

  color: #000;

}

.text-helper {

  font-size: 22px;

  line-height: 30px;

  color: #002b6d;

}

.box-input select.form-control {

  color: #000;

  font-size: 20px;

  line-height: 30px;

}

.btn-pink {

  color: #fff;

  background-color: #ee3d96;

  font-size: 22px;

  line-height: 30px;

  border-radius: 0;

  min-width: 200px;

  height: 50px;

}

.btn-pink:hover {

  background-color: #646464;

  color: #fff;

}

.btn-custom {

  font-size: 22px;

  line-height: 30px;

  color: #ee3d96;

  text-decoration: underline;

  background-color: transparent;

  border: none;

  min-width: 110px;

  background-image: url(../images/ic-re.svg);

  background-position: left center;

  background-repeat: no-repeat;

  background-size: 25px;

  padding: 0;

}

.btn-custom:hover {

  text-decoration: underline;

}

.btn-submit-calculator .btn-pink {

  margin-right: 60px;

}

.btn-submit-calculator {

  padding-left: 30px;

}

.box-result-calculator {

  max-width: 730px;

  background-color: #ee3d96;

  padding: 30px;

  margin: 0 auto;

  position: relative;

  top: -30px;

}

.box-result-calculator::after {

  content: "";

  position: absolute;

  top: 0;

  left: 90px;

  width: 0;

  height: 0;

  border-left: 10px solid transparent;

  border-right: 10px solid transparent;

  border-top: 15px solid #fff;

}

.box-result-calculator .title-calculator-in {

  color: #fff;

}

.box-result-calculator .form-control {

  height: 40px;

  font-size: 32px;

  line-height: 30px;

  text-align: right;

  padding: 4px 60px 4px 12px;

  background-color: #fff;

  border: 1px solid #fda2d0;

  font-family: "DB Helvethaica X bold";

}

.box-result-calculator .text-unit {

  top: auto;

  bottom: 6px;

  right: 15px;

  font-family: "DB Helvethaica X bold";

}

.box-result-calculator .box-input {

  margin-bottom: 5px;

}

.box-result-calculator .box-input label {

  font-size: 22px;

  line-height: 30px;

  color: #fff;

}

.des-result-calculator {

  padding-top: 20px;

}

.des-result-calculator h4 {

  color: #fff;

  font-size: 20px;

  line-height: 20px;

}

.des-result-calculator p {

  color: #fff;

  font-size: 16px;

  line-height: 18px;

}

.btn-blue {

  font-size: 20px;

  background-color: #002b6d;

  color: #fff;

  border-radius: 0;

  min-width: 172px;

}

.btn-blue:focus,

.btn-blue:hover {

  background-color: #646464;

  color: #fff;

}

.bigbanner-img a {

  display: block;

  line-height: 0;

  height: 100vh;

}

.headline-promotion .container {

  position: relative;

}

.slider-promotion.slick-slider .slick-list {

  width: 85vw;

}