/* HEADER =========================================== */

section.header {
  background-image:url(../assets/7/bg\ pic.png);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center center;
  height:625px;
}

.header .content-title {
  text-align:center;
  color:#FFF;
  font-weight:700;
  font-size:55px;
  line-height:65px;
  margin-top:350px;
}

/* FORM =========================================== */

section.contact {
  background-color:#FFF;
  padding-bottom:100px;
}

.contact .content>div {
  padding:100px 0px;
}

.contact .left {
  width:calc(50% - 20px);
  text-align:right;
}

.contact .left .grid {
  margin:50px;
  display:grid;
  grid-template-columns: auto auto auto auto;
  grid-gap:50px;
}

.contact .left .grid-item {
  text-align:center;
}

.contact .left .qr-code {
  background-image:url(../assets/7/qr\ code.png);
  background-repeat:no-repeat;
  background-size:contain;
  background-position:center center;
  display:inline-block;
  width:200px;
  height:200px;
}

.contact .left .grid-item-img {
  background-repeat:no-repeat;
  background-size:contain;
  background-position:center center;
  width:60px;
  height:60px;
  display:inline-block;
}

.contact .left .grid-item-img.d1 {
  background-image:url(../assets/7/icon\ 1\ kor.png);
}

.contact .left .grid-item-img.d2 {
  background-image:url(../assets/7/icon\ 2\ jpn.png);
}

.contact .left .grid-item-img.d3 {
  background-image:url(../assets/7/icon\ 3\ usa.png);
}

.contact .left .grid-item-img.d4 {
  background-image:url(../assets/7/icon\ 4\ deu.png);
}

.contact .left .grid-item-img.d5 {
  background-image:url(../assets/7/icon\ 5\ sin.png);
}

.contact .left .grid-item-img.d6 {
  background-image:url(../assets/7/icon\ 6\ idn.png);
}

.contact .left .grid-item-img.d7 {
  background-image:url(../assets/7/icon\ 7\ mas.png);
}

.contact .left .grid-item-img.d8 {
  background-image:url(../assets/7/icon\ 8\ mex.png);
}

.contact .right {
  width:calc(50% - 20px);
  position:absolute;
  right:0px;
  top:0px;
  text-align:center;
}

.contact .form {
  background-color:#6CDDFD;
  padding:20px;
}

.contact .form input,
.contact .form textarea {
  padding:20px;
  width:100%;
  border:2px #E5E5E5 solid;
  border-radius:20px;
  font-size:22px;
  margin-top:20px;
}

.contact .form textarea {
  height:400px;
}

.contact .form button {
  width:50%;
  padding:20px 50px;
  margin-top:20px;
  background-color:#3991D8;
  color:#FFF;
  border:none;
  border-radius:20px;
  font-size:22px;
}



/* RESPONSIVE MEDIA QUERIES =========================================== */

@media only screen and (max-width: 1280px) {
  .contact .left {
    width:100%;
  }

  .contact .right {
    width:100%;
    position:relative;
  }
}