@charset "utf-8";
/* Edge */
::-webkit-input-placeholder {color: #a8a8a8;  font-size: 1.6rem;}
/* Internet Explorer 10-11 */
:-ms-input-placeholder {color: #a8a8a8;  font-size: 1.6rem;}
::placeholder {color: #a8a8a8;  font-size: 1.6rem;}

.mainTxt {text-align: center; line-height: 2; margin-bottom: 80px;}
.mainTxt h3 {font-size: 3.2rem; font-weight: bold; margin-bottom: 20px;}

.red {color: #d10000;}
label.error {color: #d10000; width: 100%; display: block; font-size: 1.2rem;}
.flexBox {align-items: center;}


textarea,
input[type="email"],
input[type="text"] {border: 1px solid #ccc; padding: 1rem; width: 100%;  font-size: 1.6rem;}

table {width: 100%; margin-bottom: 5rem; font-size: 1.6rem;}
table tr {border-top: 1px solid #eae9e1;}
table tr:last-of-type {border-bottom: 1px solid #eae9e1;}
table tr td {padding: 3rem 1rem;}
table tr td:nth-of-type(1) {font-weight: bold; vertical-align: top; width: 30%;}
table tr td:nth-of-type(1) span {color: #d10000;}
table tr td:nth-of-type(2) {width: 70%; padding: 1.5rem 2rem;}
table ul li {margin-bottom: 10px;}
table ul li.last {margin-bottom: 0;}
table .col1 li {width: 100%;}
table .col1 li label {width: 120px; text-align: left;}
table .col1 li input[type="text"] {width: calc(100% - 120px);}
table .col2 li {width: 45%;}
table .col2 li label {width: 50px; text-align: left;}
table .col2 li input[type="text"] {width: calc(100% - 50px);}
table .col3 {max-width: 300px; width: 100%;}
table .col3 li input[type="text"] {width: 80px;}

table td > textarea,
table td > textarea.w100 {width: 100%;}
table .button {margin-bottom: 2rem; align-items: stretch; max-width: 550px;}
table .button li {width: 27%;}
table .button li:nth-of-type(2) {width: 4%; text-align: center; display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center;}
table .button li:nth-of-type(4) {width: 35%;}
table .button li input[type="text"] {width: 100%;}
table .button a {display: block; text-align: center; background: #666666; color: #fff;  font-size: 1.4rem; padding: 1.5rem 0; border-radius: 5px; cursor: pointer; width: 100%; line-height: 1;}
table .button a:hover {opacity: 0.6;}
button { font-size: 1.8rem; letter-spacing: 0.1em; background: #000 url(../images/common/ic_arr_white.png) no-repeat right 20px center; display: block; max-width: 300px; width: 100%; margin: 0 auto; text-align: center; color: #fff; padding: 15px 0; border-radius: 50px; transition: all 0.5s; border: 1px solid #55246d; cursor: pointer; -webkit-appearance: none; outline: none;}
button:hover {background-position: right 10px center;}



/*Confirm*/
.contact-btn {max-width: 800px; width: 100%; margin: 0 auto;}
.contact-btn button {width: 49%;  font-size: 1.8rem; letter-spacing: 0.1em; background: #55246d url(../images/common/ic_arr.png) no-repeat right 20px center; display: block; text-align: center; color: #fff; padding: 15px 0; border-radius: 5px; transition: all 0.5s; border: 1px solid #55246d; cursor: pointer;}
.contact-btn button:hover {background-color: #6b079c; background-position: right 10px center;}
.contact-btn button:nth-of-type(1) {background: #fff; color: #55246d;}
.contact-btn button:nth-of-type(1):hover {background: #55246d; color: #fff;}

/*Thank*/
.btn-back {letter-spacing: 0.1em; background: #000 url(../images/common/ic_arr_left_white.png) no-repeat left 20px center; display: block; max-width: 260px; width: 100%; margin: 50px auto 0; text-align: center; color: #fff; padding: 5px 0; border-radius: 50px; transition: all 0.5s; border: 1px solid #55246d; cursor: pointer; -webkit-appearance: none; outline: none;}
.btn-back:hover {background-position: left 10px center;}

.zf-errorMessage {color: #ff0000;}

/*          Media
----------------------------*/
@media (max-width: 767px){
    h2 {padding: 4vw 0 6vw;}
    .titH2 .jp {line-height: 1.4;}
    .titH2 .jp br {display: block;} 
    .mainTxt {text-align: left;}
    .mainTxt h3 {font-size: 2.4rem; text-align: left;}    


    table tr:last-of-type {border-bottom: 1px solid #ccc;}
    table tr td {border-bottom: 0;}
    table tr td:nth-of-type(1) {display: block; width: 100%; padding: 1rem 0 0;}
    table tr td:nth-of-type(2) {display: block; width: 100%; padding: 1rem 0;}

    table td > textarea,
    table td > input[type="text"] {width: 100%;}
    
    table ul {width: 100%;}
    table ul li {width: 100%; margin-bottom: 2vw;}
    table ul li label{text-align: left;}
    table .button {max-width: 768px;}

    table .col1 li label {width: 100%; margin-bottom: 5px; text-align: left;}
    table .col1 li input[type="text"] {width: 100%;}
    table .col2 li label {width: 10vw; text-align: left;}
    table .col2 li input[type="text"] {width: calc(100% - 10vw);}
    table .col3 li {width: auto;}

    button {width: 26rem;}
}


@media (max-width: 480px){
    #ifrmReq{height: 2375px !important;}
}