@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
@import url('https://fonts.googleapis.com/css?family=Sorts+Mill+Goudy&display=swap');
@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP:400,600,700&display=swap&subset=japanese');
body {
  color: #151514;
 font:normal normal 18px/1 'Open Sans', '游ゴシック', 'Yu Gothic', YuGothic, 'Hiragino Kaku Gothic ProN', "メイリオ", 'Meiryo', sans-serif;
  line-height: 1.75;
}

a {
  color: #a59aca;
}

.container {
  max-width: 100%;
  border: 0;
}

.help-block {
  font-size: 0.75em;
}

.form-column {
    display: flex;
flex-wrap: wrap;
  border-bottom: 1px dotted #cccccc;
margin-bottom:0;
}
.form-column:first-child {
    border-top: 2px solid #ccc;
}
input,
button,
textarea,
select {
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  outline: none;
  font-size: 1em;
}

.form-column-heading h2 {
  font-size: 1.5em;
    font-weight: bold;
    border-top: solid 2px #ccc;
    border-bottom: solid 2px #ccc;
    width: 100%;
    margin: -1px 0;
    padding: 60px 0 20px 0;
}
.form-column.form-column-zip-code-jp,
.form-column.form-column-prefecture-jp,
.form-column.form-column-text{
width:100%;
}
.form-column.form-column-zip-code-jp{
border-top:none;
}
.label{
    background-color: #f7f7f7;
    padding: 20px 10px;
margin-bottom: 0;
width: 30%;
    margin-right: 2.5%;
}
label h3 {
  font-size: 1em;
  display: inline-block;
  margin: 0 0 0.5em;
  font-weight: bold;
}

label .badge-optional {
  display: none;
}

label .badge-required {
  width: auto;
  display: inline-block;
  margin-left: 0.25em;
    color: #fff;
    background: #f06292;
    font-style: normal;
    font-size: 10px;
    padding: 2px 5px;
    margin: 0 5px 0 3px;
font-size: 16px;
    font-weight: 700;
}

.form-column-text .description-block {
  color: #f06292;
    line-height: 1.4;
    font-size: 14px;
    font-weight: bold;
    width: 65%;
    margin-left: 32.5%;
    margin-top: -17px;
}
.help-block, .description-block{color:#333;}
.button-group {
  margin-top: 1em;
}
.button-group .help-block {
  margin-top: 0.5em;
  font-size: 0.75em;
}

.button {
  display: inline-block;
  text-align: left;
  cursor: pointer;
  margin: 0 0.5em 0 0;
  width:300px;
    background-color: #005bab;
    overflow: hidden;
    border-radius: 0;
    color: #fff;
    border: none;
    font-size: 14px;
    height: 60px;
    padding: 0 0 0 24px;
position:relative
}
.button::before{
    content: "";
    width: 320px;
    height: 60px;
    background-color: #039be5;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    transform: translateX(-300px) skewX(-10deg);
    transition: all 0.7s ease;
}
.button::after {
   content:'→';
position:absolute;
top: 0.85em;
    right: 1em;
    font-size: 20px;
}
button.button-submit {
  color: #fff;
}
button.button.button-back {
    background: #039be5;
}
button.button-submit span.fa {
  margin-right: 4px;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
textarea {
  height: 1.75em;
  width: 60%;
  max-width: 100%;
  outline: none;
  line-height: 1.75em;
  padding: 2px 4px;
  border: 1px solid #6a767d;
  transition: all 0.3s;
border: 1px solid #c9c9c9;
    width: 50%;
    height: 45px;
    padding: 0 10px;
    font-size: 16px;
    box-sizing: border-box;
margin:20px 0;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
textarea:focus {
      
}

textarea {
  height: 10em;
border: 1px solid #c9c9c9;
    padding: 10px;
    border-radius: 3px;
    font-size: 16px;
    box-sizing: border-box;
margin: 20px 0;
}

input[type="file"] {
  display: block;
  line-height: 1.75;
}

input[type="password"] {
  height: 1.75em;
  width: 100%;
  outline: none;
  border: 1px solid #6a767d;
  transition: all 0.3s;
}

.form-column-date .input-group select {
  width: auto;
  display: inline-block;
}

.form-column-calendar input {
  width: auto;
}

.form-column-zip-code-jp .input-group input {
  width: auto;
  min-width: auto;
  display: inline-block;
}

.form-column-zip-code-autofill.form-column {
  border-bottom: 0;
  margin-bottom: 0;
}

.form-column-checkbox label,
.form-column-radio label {
  margin-right: 1em;
}

select {
    width: 330px;
    height: 45px;
    background: transparent;
    position: relative;
    z-index: 1;
    font-size: 16px;
    border: 1px solid #c9c9c9;
    border-radius: 2px;
margin: 20px 0;
}

.message-block-complete {
  border: 2px solid #316a8b;
  padding: 20px;
  text-align: center;
}
.form-column.form-column-heading.form-column-9f8f1074-d473-4c41-9ba5-77665aaf5411 {
    border-bottom: none;
}
.form-column.form-column-heading.form-column-9f8f1074-d473-4c41-9ba5-77665aaf5411 h2 {
    border-bottom: none;
}
.form-column.form-column-note.form-column-3ad4986f-7562-4dd9-bd11-7ec76a6bb93a {
    border-bottom: solid 2px #ccc;
}
.form-column.form-column-note.form-column-1f608580-23a6-4902-b48c-69ddeb6210ac {
    border-top: solid 2px #ccc;
    border-bottom: none;
    margin-top: -1px;
padding-top:50px;
}
.form-column.form-column-heading.form-column-b4d7c98f-2e25-4a0c-9715-503d633bfeba h2 {
    border-top: none;
}
.form-column.form-column-note.form-column-99dc95b1-2bf1-4404-80d3-422404487e9f {
    border: solid 1px #ccc;
    margin: 30px 0;
    padding: 25px;
    font-size: 15px;
}
.form-column.form-column-note.form-column-99dc95b1-2bf1-4404-80d3-422404487e9f .description-block{
color:#333;
}
.form-column.form-column-note.form-column-afe83511-48a0-417c-85f8-301bf04f2d23 {
    border-bottom: none;
}
.form-column.form-column-text.form-column-a0bee820-e4ff-40f0-a97f-775aa7a58154 label {
    margin-bottom: -14px;
}
.preview-block {
    padding-top: 20px;
max-width:65%;
white-space: normal;
    word-break: break-all;
}
.message-block-confirmation+.form-column {
    border-top: solid 2px #ccc;
}
.button[disabled]{background-color:#005bab;}
@media (max-width: 640px) {
body {
    font-size: 14px;
}
.label{width:100%; margin-right:0;padding: 8px 10px;}
label .badge-required{font-size:14px;}
.form-column-text .description-block{margin:0;width:100%;}
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="url"],
  textarea {
    width: 100%;
    min-width: 100%; margin:10px 0;
  }
  select {
    width: 100%;
  }
  .form-column-calendar input {
    width: auto;
    min-width: auto;
  }
  .form-column-heading h2 {
    font-size: 1.25em;
  }
.form-column.form-column-note.form-column-99dc95b1-2bf1-4404-80d3-422404487e9f{padding: 20px;
    font-size: 13px;}
.preview-block{width:100%; max-width:inherit;}
.button:not(.hidden) + .button{margin-left:0;}
.button{margin-right:0; margin-bottom:20px;}
}