@charset "UTF-8";
.contact .intro_low {
    background-image: url(/src/img/intro/tit_contact.jpg);
    background-position: center;
}
.contact .side .navTit {
    margin-bottom: 200px;
}
.contact .contact-area {
    border:  #d3e2f5 3px solid;
    border-radius:  7px;
    padding: 20px 20px 15px 20px;
    text-align:  center;
}

.contact .contact-area .contact_text {
    color: #14379d;
    border-bottom: #d1d8ed 1px solid;
    padding-bottom: 10px;
}

.contact .contact-area .con_num p {
    color: #193dab;
    font-size: 200%;
    font-weight: bold;
    font-family: 'Open Sans', sans-serif;
    display: inline-block;
    background-position: left center;
    background-repeat: no-repeat;
    padding-left: 30px;
}

.contact .contact-area .con_num p.fd {
    background-image: url(/src/img/common/ico_fd.jpg);
    padding-left: 35px;
}

.contact .contact-area .con_num p.tel {
    background-image: url(/src/img/common/ico_tel.png);
}

.contact .contact-area .con_num p.fd:after {
    content: '';
    background-color: #d1d8ed;
    width: 2px;
    height: 25px;
    display: inline-block;
    vertical-align: middle;
    margin: 0 8px;
}

.contact .cont_h3 {
    font-size: 1.6em;
    padding-top: 2vw;
    font-weight: 600;
    padding-bottom: 1vw;
}

.contact .cont_h3:before {
    content: '';
    background: #003296;
    width: 7px;
    height: 1em;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.5em;
}

.contact .orange {
    color: #f07422;
}

.contact .form {
    border-top: #acacac 1px solid;
    margin-top: 30px;
}

.contact .form th {
    padding: 20px 15px 20px 20px;
    color: #231f20;
    font-size: 14px;
    line-height: 1.7em;
    text-align: left;
    vertical-align: middle;
    font-weight: normal;
    word-break: keep-all;
    background-color: #e9f1fc;
    width: 20%;
}

.contact .form td {
    padding: 14px 15px 10px 25px;
    color: #231f20;
    font-size: 14px;
    line-height: 1.7em;
    text-align: left;
    vertical-align: middle;
    font-weight: normal;
    word-break: break-all;
    background-color: #fff;
    width: 80%;
}
.contact .form input[type=radio] { 
	 
}

.contact .form input[type=radio]:checked + .radio:before { 
	opacity: 1;
}



.contact .form .radio {
	box-sizing: border-box;
	position: relative;
	display: inline-block;
	margin: 5px 25px 5px 0;
	padding: 0 0 0 30px;
	vertical-align: middle;
	cursor: pointer;
	}
	
.contact .form .radio:hover:after { 
	border-color: #1b41a7; 
}
	
.contact .form .radio:after {
	position: absolute;
	top: 57%;
	left: 0;
	display: block;
	margin-top: -12px;
	width: 13px;
	height: 13px;
	border: 2px solid #bbb;
	border-radius: 50%;
	content: '';
}

.contact .form .radio:before {
	position: absolute;
	top: 57%;
	left: 6px;
	display: block;
	margin-top: -6px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background-color: #1b41a7;
	content: '';
	opacity: 0;
}


.contact .form .text {
    line-height: 1.8;
}

.contact .form .text_field {
	background-color: #FFF;
	border: 1px solid #C6CBCC;
	width: 180px;
	height: 30px;
	width: 95%;
}

.contact .form tr {
    border-bottom: 1px dotted #948C8A;
    /* width: 100%; */
}

.contact .form .name .text_field {
    width: 40%;
    margin: 0 10px;
}


.contact .form .mailarea td input {
    margin: 5px 0;
}

.contact .form .mailarea td > input {
    margin-bottom: 10px;
}

.contact .form textarea.text_field {
    background-color: #FFF;
    border: 1px solid #C6CBCC;
    width: 450px;
    height: 150px;
    margin: 10px 0px;
}

.contact .form .radio.agreeR, .contact .form .agree {
    display:  inline-block;
	padding-left: 30px;
}

.contact .form .agree a {
    color: #3a67b0;
    text-decoration:  underline;
}

.contact .form .agree a:hover {
    text-decoration:  none;
}


.contact .form_btn {
	margin: 50px auto 0;
	padding: 0 0 50px;
	text-align:  center;
}

.contact .form_btn input {
	padding: 1.0em 0;
	text-decoration: none;
	color: #FFF;
	border-radius: 4px;
	width: 270px;
	font-weight: bold;
	padding-left: 20px;
}

.contact .form_btn input:disabled {
	background: #b9bcc1 url(/src/img/personnel/btn_arrow.png) 60px center no-repeat;
    border-bottom: solid 2px #959aa1;
	box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
}

.contact .form_btn input:enabled {
    background: #fd9535 url(/src/img/personnel/btn_arrow.png) 60px center no-repeat;
    border-bottom: solid 2px #d27d00;
}

@media screen and (max-width: 1024px) {
.container .contact-area, .cont_h3, .contactForm > p {
    width:  95%;
    margin: 0 auto;
}

.contactForm {
    margin-top: 30px;
}
.contactForm table {
    width: 100%;
}
}
@media screen and (max-width: 750px) {
.contact .contact-area .con_num p.fd:after {
    content:  none;
}

.contact .contact-area .con_num {
    margin: 10px 0;
}

.contact .contact-area .contact_text {
    font-size:  0.95em;
    text-align:  left;
}

.contact .form th, .contact .form td {
    display:  block;
    width: inherit;
    padding: 10px 15px 10px 10px;
    margin-bottom: 10px;
    /* width: 100%; */
}

.contact .form .text_field {
    width: 100%;
}

.contact .form .name .text_field {
    width: 35%;
}

.contact .form textarea.text_field {
    width: 100%;
}
}


.btnArea {
	display: block;
	text-align: center;
	width: 100%;
}

.btnArea p{
	display: initial;
}

#backtoBtn {
    background-color: #ccc;
    padding: 20px 40px;
    display: inline-block;
    margin-top: 20px;
    border-radius: 10px;
    border: 1px solid #888;
	width: 30%;
}

#submitBtn2 {
    background-color: #fd9535;
    padding: 20px 40px;
    display: inline-block;
    margin-top: 20px;
    border-radius: 10px;
    border: 1px solid #d27d00;
	width: 30%;
}