@charset "utf-8";

/* pageTitle ////////////////////////////////////////////////////////// */

#pageTitle {
background		: url(../img/contact/pageTitle_bg.jpg) center no-repeat;
background-size	: cover;
}




/* contactMain //////////////////////////////////////////////////////// */

/* contact_flow */
#contact_flow {
width			: 220px;
border			: 1px solid #ccc;
box-sizing		: border-box;
float			: left;
}

#contact_flow li {
line-height		: 60px;
text-align		: center;
border-bottom	: 1px solid #ccc;
}

#contact_flow li:last-child {
border-bottom	: none;
}


#flow_now {
color			: #fff;
font-weight		: bold;
background		: #004983;
}



/* contact_form */
#contact_form {
width			: 750px;
float			: right;
}


#contact_form dt {
color			: #004983;
font-weight		: bold;
margin-bottom	: 10px;
}


#contact_form dd {
margin-bottom	: 40px;
}


form input[type=text],
form input[type=email],
form input[type=tel],
form select,
form textarea {
display			: block;
font-size		: 17px;
padding			: 15px;
background		: #E9EEF2;
border			: none;
border-radius	: 10px;
box-sizing		: border-box;
}


form input[type=text],
form input[type=email],
form input[type=tel],
form textarea {
width			: 100%;
}


form input[type=text],
form input[type=email],
form input[type=tel],
form select {
height			: 50px;
}


form textarea {
height			: 10em;
}


/* contact_check */
#contact_check {
text-align		: center;
margin-bottom	: 50px;
}

#contact_check label {
display			: inline-block;
line-height		: 60px;
background		: #eee;
padding			: 0 25px;
border			: 1px dotted #ccc;
border-radius	: 10px;
cursor			: pointer;
}

#contact_check label:hover {
background		: #fff;
}

#contact_check input {
display			: inline-block;
font-size		: 17px;
margin-right	: 10px;
}


/* nav_detail */
.nav_detail li {
margin-bottom	: 15px;
}

.nav_detail li:last-child {
margin-bottom	: 0;
}

.nav_detail input,
.nav_detail button {
width			: 400px;
padding			: 0 !important;
}

.nav_detail button {
background		: #666;
}


/* for popup */

/*popup template design*/
.popup-background {
  /*position size*/
  position: fixed;
  z-index : 10000;
  top : 0;
  left : 0;
  height : 100vh;
  width : 100vw;

  /*design*/
  background-color: gray;
  opacity : 0.5
}
.popup{
  z-index : 10001;
  position: fixed;
  top: 70px;
  left: 5%;
  height : calc(100vh - 100px);
  width : 90%;
  overflow-y: scroll;
  background-color: white;
  padding: 20px;
}
.popup > .close-button {
  display: block;
  background-color: #00498B;
  color : white;
  font-weight: bold;
  width: 310px;
  margin: 0 auto;
  line-height: 60px;
  padding: 0 25px;
  border-radius: 40px;
  cursor: pointer;
  height : 60px;
  width: 310px;
  margin-bottom: 20px;
}
.popup > .close-button:hover {
  opacity: 0.7;
}


/*hide popup*/
.popup-flag {
  display:none;
}
.popup-flag:not(:checked) + .popup-background {
  display:none;
}
.popup-flag:not(:checked) + * + .popup {
  display:none;
}


#contact_check label#agree.-disabled {
  opacity: 0.5;
  pointer-events: none;
}
section#cusData {
    margin-bottom: 10px !important;
}

#contact_check label.confirm {
  display: block;
  background: #fff;
  color: #004983;
  border: 2px solid #a55442;
  font-weight: bold;
  width: 310px;
  margin: 0 auto;
  margin-bottom: 20px;
}
#contact_check label.confirm:hover {
  background: rgba(234, 85, 50, 0.2);
}

#contact_form form {
  padding: 0 20px;
}