@charset "utf-8";

#main-banner {
 background: -moz-linear-gradient(115deg, #00808e, #00b8bf);
 background: -webkit-linear-gradient(115deg, #00808e, #00b8bf);
 background: linear-gradient(-25deg, #00808e, #00b8bf);
}

div.contact-us-contents {
 width: 100%;
}

div.contact-us-contents div.contents-inner {
 display: -webkit-box;
 display: -webkit-flex;
 display: -ms-flexbox;
 display : flex;
}

div.contact-us-contents div.contents-inner > div {
 width: 50%;
}

div.contact-us-infos {
 /*height: 100%;*/
 position: relative;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
}
div.contact-us-infos > div.contact-us-info {
 /*height: 50%;*/
 position: relative;
 padding: 20px;
}
div.contact-us-infos > div.contact-us-info > div {
 /*
 position: absolute;
 -ms-transform: translate(0, -50%);
 -webkit-transform: translate(0, -50%);
 transform: translate(0, -50%);
 top: 50%;
 */
 font-weight: bold;
 font-size: 1.2em;
}

div.contact-us-form {
 padding: 20px;
}
div.contact-us-form > div.error-message {
 font-size: 1em;
 line-height: 1.5em;
}
div.contact-us-form > div.error-message > p {
 font-weight: bold;
 color: #cc3d00;
}

div.input-title:before {
 content: "";
 display: block;
 width: 100%;
 height: 2em;
}

input[type="text"] {
 width: 80%;
}

#tos .input-title > p {
 font-weight: normal;
}
#tos:before {
 content: "";
 display: block;
 width: 100%;
 height: 2em;
}

div.send-btn {
 padding-top: 10px;
}
div.send-btn > a {
 display: inline-block;
 color: #ffffff;
 font-weight: bold;
 background-color: #00effc;
 padding-top: 10px;
 padding-bottom: 10px;
 padding-left: 15px;
 padding-right: 15px;
 border-radius: 6px;
 opacity: 0.8;
 white-space: nowrap;
 width: 60%;
 text-align: center;
 font-size: 1.2em;
}
div.send-btn > a:hover {
 opacity: 1;
 text-decoration: none;
}

div.comp-message {
 font-size: 1.2em;
 font-weight: bold;
 color: #0800fc;
}
div.comp {
 font-size: 1.2em;
}
div.top-btn {
 padding-top: 10px;
}
div.top-btn > a {
 display: inline-block;
 color: #ffffff;
 font-weight: bold;
 background-color: #e0c600;
 padding-top: 10px;
 padding-bottom: 10px;
 padding-left: 15px;
 padding-right: 15px;
 border-radius: 6px;
 opacity: 0.8;
 white-space: nowrap;
 width: 60%;
 text-align: center;
 font-size: 1.2em;
}
div.top-btn > a:hover {
 opacity: 1;
 text-decoration: none;
}

/* mobile media */
@media screen and (max-width: 768px) {
 div.contact-us-contents div.contents-inner {
  display: block;
 }
 div.contact-us-contents div.contents-inner > div {
  width: 100%;
 }
 div.contact-us-infos > div.download-info {
  height: auto;
  padding: 15px 5px;
 }
 div.contact-us-infos > div.download-info > div {
  /*
  position: relative;
  */
  top: 0;
  /*
  transform: translate(0, 0);
  */
 }
 div.contact-us-form {
  padding: 20px 5px;
 }
}