@charset "UTF-8";
.sub-eyecatch {
    background: url(../img/header.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding-top: 100px;
}

.sub-eyecatch h2 {
    margin: 0;
}

.contact-hdlead {
    padding: 60px 0;
    background: url(../img/lead-img01.png);
    background-repeat: no-repeat;
    background-position: right bottom;
    margin-bottom: 60px;
}

.contact-hdlead .lead {
    font-size: 1.6rem;
    line-height: 2.0;
    text-align: justify;
    font-weight: 500 !important;
}
.contact-hdlead .box {
    max-width: 500px;
    margin: 10px;
}

.contact-hdlead {
    background-size: 50%
}

@media screen and (max-width:1200px) {
    .contact-hdlead {
        background-size: 45%
    }
}

@media screen and (max-width:991px) {
    .contact-hdlead {
        background: none;
    }
}


/* ----------------------------------------------------------

FORM

---------------------------------------------------------- */

#w_contact_form {/* padding: 80px 15%; */position: relative;z-index: 1;/* background: #fafafa; */}

@media only screen and (max-width: 800px) {
    #w_contact_form { padding: 80px 5%; }
}
@media only screen and (max-width: 738px) { 
    #w_contact_form{padding: 70px 5%;/* background: url(../images/noise2.png) repeat #fefefe; */}
}
@media only screen and (max-width: 414px) { 
    #w_contact_form {padding: 30px 0;}
}



/* --- .contentBox --- */
#w_contact_form .formArea {position: relative;z-index: 2;padding: 80px 2%;font-size: 17px;} 

#w_contact_form .formArea:before {position: absolute;top: 7px;left: 0;bottom: 7px;right:0;content: "";/* border: #ddd 1px solid; *//* background:#fefefe; */z-index: -2;}
#w_contact_form .formArea:after {position: absolute;top: 0;left: 7px;bottom: 0;right:7px;content: "";/* border: #ddd 1px dotted; */z-index: -2;}

@media only screen and (max-width: 800px) {
    #w_contact_form .formArea { padding:50px 5%; } 
}
@media only screen and (max-width: 738px) {
    #w_contact_form .formArea {padding: 40px 2%;} 
}


/* -----------------------------
.detailBox
----------------------------- */
#w_contact_form .formBox { padding: 40px 0; text-align: left; border-top: #ddd 1px dashed; }  
#w_contact_form .formBox .leftBox { float: left; width: 25%; }
#w_contact_form .formBox .leftBox h3 {font-size: 14px;  letter-spacing: 1px;}
#w_contact_form .formBox .rightBox {/* float: right; */width: 70%;/* border-left: #ddd 1px dotted; */padding: 0 5%;margin: 0 15%;}

@media only screen and (max-width: 738px) {

    #w_contact_form .formBox { padding: 40px 2.5% ; text-align: left; border-top: #ddd 1px dashed; }
    #w_contact_form .formBox:first-child { padding: 0 2.5% 40px; border-top:none;  }
    #w_contact_form .formBox .leftBox { float: none; width: 100%; }
    #w_contact_form .formBox .leftBox h3 {text-align:center; }
    #w_contact_form .formBox .rightBox {float: none;width: 100%;border-left: none;padding: 25px 0 0;margin: 0;}
}



/* -----------------------------

.detailArea

----------------------------- */

#form .detailArea { margin-top: 30px; position: relative; z-index: 4; }
/* h3, h4*/
#form .detailArea h3 { font-size: 15px; font-weight: bold; letter-spacing: 1px; line-height: 1.8; }
#form .detailArea h4 { font-size: 15px; font-weight: bold; letter-spacing: 1px; }
#form .detailArea h5.quiz { margin: 5px 0; font-size: 16px; /*line-height:1; */ letter-spacing: 2px; }
#form .detailArea h5.quiz span { font-size: 14px; letter-spacing: 0; }

/* -----------------------------
.detailBox
----------------------------- */
#form .detailBox { padding: 40px 0; text-align: left; border-top: #a276c9 1px dotted; }

/* -----------------------------
.leftBox, .rightBox
----------------------------- */   
#form .detailBox .leftBox { float: left; width: 15%; }
#form .detailBox .rightBox { float: right; width: 80%; border-left: #a276c9 1px dotted; padding-left: 5%; }


/* -----------------------------

ol.formlist

----------------------------- */

ol.formlist {width: 100%;margin: 0;list-style:none;}
ol.formlist li { list-style: none; margin-top: 30px; }

ol.formlist li ol.plan { font-size:0; margin:-10px -10px 0; padding:0; }
ol.formlist li ol.plan li { display:inline-block; margin:20px 10px 0;padding:0; }
@media only screen and (max-width: 414px) {
    ol.formlist li ol.plan { margin:0 -5px; padding:0; }
    ol.formlist li ol.plan li { margin:10px 5px 0;padding:0; }	
}
/* -----------------------------

form

----------------------------- */

/* contact-form
--------------------------- */

.contact-form > dt {
    position: absolute;
    padding: 2.3em 0 0 10px;
}

.contact-form > dd {
    position: relative;
    padding: 2em 0 2em 11em;
    margin-bottom: 30px;
    border-bottom: 1px solid #4d4d4d;
}

.contact-form > dd > i {
    color: #999;
    display: block;
    cursor: text;
    position: absolute;
    bottom: 1.8em;
    z-index: -1;
}
.contact-form > dd.active > i {
    display: none;
}
.contact-confirm .contact-form > dd > i {
    display: none;
}

.contact-confirm .contact-form > dd > span {
    display: block;
    line-height: 3.6em;
    min-height: 3.6em;
}
.contact-confirm .contact-form > dd > span {
    display: block;
    line-height: 3.6em;
}
.contact-confirm .contact-form > dd.message > span {
    line-height: 2;
    padding: 1em 0;
    min-height: 1.6em;
}

.contact-form .contact-form > dd .error {
    color: red;
    position: absolute;
    top: -1.5em;
}

.contact-form > dd.active textarea {
    height: 18em;
}

.contact-complete {
    min-height: 480px;
}


.contact-form_btn {
    margin-bottom: 120px;
}

.contact-form .c-submitset > li:first-child {
    display: none;
}

.contact-confirm .c-submitset > li:first-child > .c-submit {
    background-color: #808080;
}
.contact-confirm .c-submitset > li:first-child > .c-submit:before {
    background-color: #666;
}



form {font-size: 16px;letter-spacing: 1px;}
input,
button,
textarea,
select { -webkit-appearance: none; border-radius: 0; }
input,
select { vertical-align: middle; }

@media only screen and (max-width: 738px) {
    form { font-size: 13px;  }
}
@media only screen and (max-width: 414px) {
    form { font-size: 12px;  }
}
/* ----- label ----- */
label {display: block;font-weight: bold;font-size: 16px;letter-spacing: 1px;line-height: 1.8;margin: 10px 0 5px;position: relative;}

@media only screen and (max-width: 500px) {
    .contact-form > dt {
        width:100%;
        padding: 1em 0 0 0px;
        display: block;
        font-size: 14px;
    }

    .contact-form > dd {
        /* position: relative; */
        padding: 4em 0 1em 0em;
        margin-bottom: 15px;
        border-bottom: 1px solid #4d4d4d;
        display: block;
        width: 100%;
    }

}

/* ----- input ----- */
input.st { margin: 0; padding: 10px; border: #ddd 1px solid; webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; width: 100%; }
/* input */
input.col-100 { max-width: 100%; display: block; }
input.col-half { max-width: 450px; display: block; }
input.col-address1 { max-width: 80px; margin: 0 5px 0 0; padding: 10px; border: #ddd 1px solid; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
input.col-address2 { max-width: 120px; margin: 0 0 0 5px; padding: 10px; border: #ddd 1px solid; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
input.col-address { max-width: 120px; margin: 0; padding: 10px; border: #ddd 1px solid; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
input:focus { border: #7eccd6 solid 1px; }
input.other { margin: 0; padding: 5px 10px; border: #7eccd6 1px solid; background: #f8f8f8; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; width: 100%; max-width: 400px; }

/* ----- select ----- */
select { border: #ddd 1px solid; background: #fefefe; padding: 5px 10px; letter-spacing: 1px; }
option { border: #ddd 1px solid; margin: -1px 0 0; padding: 5px; font-weight: normal; line-height: 1; }

/* ----- textarea ----- */
textarea { width: 100%; line-height: 1.7; padding: 10px; letter-spacing: 1px; border: #ddd 1px solid; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
textarea.talentname { height: 5em; }
textarea.small { height: 10em; }
textarea.detail { height: 15em; }
textarea:focus { border: #7eccd6 solid 1px; }

/* ----- span / br ----- */
span.small-category { display: block; margin-top: 5px; vertical-align: 0; }
span.birthday { padding: 0 15px 0 5px; vertical-align: 0; }
span.block { display: block; vertical-align: 0; }
br.block-1150 { display: none; }
span.import {color: #fefefe;background: #2ea2aa;border-radius: 5px;padding-left: 5px;padding-right: 5px;padding: 2px 5px;margin-left: 5px;font-weight:500;}
p.small { font-size: 12px; line-height: 1.8; margin-top: 5px; }

.mustTxt { margin-top: 5px; font-size: 12px; font-weight: bold; color: #fefefe; background: #e803a4; width: 50px; height: 20px; line-height: 20px; text-align: center; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }

input[type=radio], input[type=checkbox] {display: none;}

/* ----- .radio,.checkbox ----- */
.radio,
.checkbox {box-sizing: border-box;position: relative;display: inline-block;margin:0;padding: 10px 15px 10px 42px;/* border-radius: 8px; */background: #f5f5f5;vertical-align: middle;cursor: pointer;z-index:2;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
.radio:hover,
.checkbox:hover { background: #f0fafe; }
.radio:hover:after,
.checkbox:hover:after { border-color: #7eccd6; }
.radio:after,
.checkbox:after { position: absolute; top: 50%; left: 15px; display: block; margin-top: -10px; width: 16px; height: 16px; border: 1px solid #bbb; border-radius: 0; content: ''; background:#fefefe; z-index:-1; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.radio:after {border-radius: 100%; }
.radio:before { -webkit-transition: opacity 0.2s linear; transition: opacity 0.2s linear; position: absolute; top: 50%; left: 19px; display: block; margin-top: -6px; width: 10px; height: 10px; border-radius: 100%; background: #7eccd6; content: ''; opacity: 0; }
input[type=radio]:checked + .radio:before { opacity: 1; }
.checkbox:before {  position: absolute; top: 50%; left: 21px; display: block; margin-top: -8px; width: 5px; height: 9px; border-right: 2px solid #7eccd6; border-bottom: 2px solid #7eccd6; content: ''; opacity: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
input[type=checkbox]:checked + .checkbox:before { opacity: 1; }


input[type=liquidation], input[type=checkbox] {display: none;}

/* ----- .liquidation,.checkbox ----- */
.liquidation,
.checkbox {box-sizing: border-box;position: relative;display: inline-block;margin:0;padding: 10px 15px 10px 42px;/* border-radius: 8px; */background: #f5f5f5;vertical-align: middle;cursor: pointer;z-index:2;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
.liquidation:hover,
.checkbox:hover { background: #f0fafe; }
.liquidation:hover:after,
.checkbox:hover:after { border-color: #7eccd6; }
.liquidation:after,
.checkbox:after { position: absolute; top: 50%; left: 15px; display: block; margin-top: -10px; width: 16px; height: 16px; border: 1px solid #bbb; border-radius: 0; content: ''; background:#fefefe; z-index:-1; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.liquidation:after {border-radius: 100%; }
.liquidation:before { -webkit-transition: opacity 0.2s linear; transition: opacity 0.2s linear; position: absolute; top: 50%; left: 19px; display: block; margin-top: -6px; width: 10px; height: 10px; border-radius: 100%; background: #7eccd6; content: ''; opacity: 0; }
input[type=liquidation]:checked + .liquidation:before { opacity: 1; }
.checkbox:before {  position: absolute; top: 50%; left: 21px; display: block; margin-top: -8px; width: 5px; height: 9px; border-right: 2px solid #7eccd6; border-bottom: 2px solid #7eccd6; content: ''; opacity: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
input[type=checkbox]:checked + .checkbox:before { opacity: 1; }


form#mail_form dl dt span.required{
    background: #5b5763;
    color:#fff;
    padding: 7px 8px 5px 8px;
    border-radius: 5px;
    margin-right: 5px;
}





/* ----- label ----- */
ol.formlist li ol.plan li label { display: block; font-weight: 500; font-size: 13px; letter-spacing: 1px; line-height: 1.8; margin: 0; position: relative; }
@media only screen and (max-width: 738px) {
    ol.formlist li ol.plan li label { font-size: 12px;  }
    ol.formlist li ol.plan li label { margin: 0; position: relative; }
}


/* ul.notice */
ol.formlist ul.notice { margin: 0 0 5px; padding: 0; list-style: none;text-align: left;}
ol.formlist ul.notice li { margin-top:3px; padding-left: 1.5em; font-size: 14px; letter-spacing: 1px; line-height: 2; position:relative; }
ol.formlist ul.notice li:before { position:absolute; top:0; left:0; content: "※"; z-index:0;}
@media only screen and (max-width: 800px) {
    ol.formlist ul.notice li { font-size: 13px; }
}
@media only screen and (max-width: 738px) {
    ol.formlist ul.notice li { font-size: 12px; }
}



/* -----------------------------

.btnArea

----------------------------- */

#w_contact_form .btnArea { display: block; text-align: center; padding: 30px 0 40px; text-align: center; border-top: #ddd 1px dashed; }
#w_contact_form .submitbtn,
#w_contact_form .resetbtn { display: inline-block; padding: 0; margin:10px 1% 0; font-size: 13px; text-decoration: none; text-align:center; padding:0; line-height: 50px; letter-spacing: 1px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 5px;
    width:275px; max-width:100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
/* ----- .submitbtn ----- */
#w_contact_form .submitbtn { color:#fefefe; background:#111; border:#111 1px solid;}
#w_contact_form .submitbtn:hover { color:#999; background: #ccc; border:#ccc 1px solid; }
/* ----- .resetbtn ----- */
#w_contact_form .resetbtn { color:#111; background:none; border: #111 1px solid; }
#w_contact_form .resetbtn:hover { color:#333; background: #fefefe;background:none; border:#ccc 1px solid; }


@media only screen and (max-width: 800px) {
    #w_contact_form .submitbtn:hover { color:#fefefe; background:#111; border:#111 1px solid; }
    #w_contact_form .resetbtn:hover { color:#111; background:none; border: #111 1px solid; }
}
@media only screen and (max-width: 738px) {
    #w_contact_form .btnArea { padding: 30px 0 15px; }
}

/* -----------------------------

#formWrap

----------------------------- */

.formWrap { position: relative; z-index: 4; text-align:center; }
.formWrap h4 { margin: 0; padding: 0; font-size: 14px; font-weight: 500; line-height: 2.2; letter-spacing: 1px;}
@media only screen and (max-width: 800px) {
    .formWrap h4 { font-size: 13px; line-height: 2; }
}
@media only screen and (max-width: 738px) {
    .formWrap h4 { padding:0 5%; font-size: 12px; line-height: 2; text-align:left; }
}



/*@media screen and (max-width: 768px) {
#formWrap { text-align:left; }
}
*/


/* -----------------------------

table.formTable

----------------------------- */

table.formTable { width: 100%; margin: 30px auto 0; border-collapse: collapse; text-align: left; overflow: hidden; font-size: 14px; letter-spacing: 1px; line-height: 2; background:#fefefe; }
table.formTable tr { border: #ddd 1px solid; }
table.formTable th { padding: 15px; font-weight: bold; background: #fafafa ; width: 30%; }
table.formTable td { padding: 15px; border-left: #ddd 1px dotted; }

.noticeTxt { margin: 20px auto 0; width: 100%; }
.noticeTxt p { margin-top:10px; padding: 12px 15px; color:#7eccd6; background:#ccc; }


#w_contact_form .formWrap .btnArea { margin-top:40px; }

@media only screen and (max-width: 800px) {
    table.formTable { font-size: 13px; }
}
@media only screen and (max-width: 738px) {
    table.formTable { margin: 20px auto 0; font-size: 12px; letter-spacing: 1px; line-height: 2;}
    table.formTable tr { border:none; border-top: 10px solid transparent;}
    table.formTable th { padding: 10px 5%; display:block; width: 100%; border: #ddd 1px solid; border-bottom:#ddd 1px dotted;}
    table.formTable td { padding: 10px 5%; display:block; border: #ddd 1px solid; border-top:none; }
    .noticeTxt p { text-align:left; }

}



/* =============================================================

Forms

* ============================================================= */

textarea, input, select {
    font-size: 100%; /* 14px base */
    color: #333;
    letter-spacing: 1px;
}

input[type="text"],
textarea {
    display: block;
    width: 100%;
    /* height: 3.6em; */
    margin: 0;
    padding: 10px 10px;
    x;
    px; */
    background-color: rgba(255,255,255,.1);
    border: none;
    border-radius: 2px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance:none;
    border: 1px solid #eee;
}
html.IE8 input[type="text"] {
    line-height: 3.6em;
}

textarea {
    padding: 10px;
    max-width: none;
    transition: height .3s;
}

input[type="text"]:focus,
textarea:focus {
    background-color: #f2f2f2;
}
textarea:focus {
    height: 18em;
}

input[type="submit"] {
    background: none;
    border: none;
    -webkit-appearance:none;
}

/*
.c-submitset input[type="submit"]:hover {
background-color: #262626;
}
*/


.c-submit {
    text-align: center;
    display: inline-block;
    background-color: #3f3f3f;
    position: relative;
    overflow: hidden;
}

.c-submit > input {
    color: #fff;
    font-size: 0.929em;
    line-height: 1.6;
    display: inline-block;
    background-color: transparent;
    padding: 20px 30px;
    min-width: 240px;
    cursor: pointer;
    -webkit-transition: background-color .15s;
    transition: background-color .15s;
    position: relative;
    z-index: 1;
}

.c-submit:before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: #262626;
    position: absolute;
    left: 0;
    top: 100%;
    -webkit-transition: -webkit-transform .12s ease-out;
    transition: transform .12s ease-out;
}
.c-submit:hover:before {
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
}
.IE8 .c-submit:hover {
    background-color: #262626;
}

.c-submit:after {
    content: "";
    width: 8px;
    height: 14px;
    background: url(../images/sprite1.png) no-repeat -250px 0;
    position: absolute;
    right: 15px;
    top: 50%;
    margin-top: -7px;
    opacity: 0;
    -webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
    -webkit-transition: all .15s ease-in;
    transition: all .15s ease-in;
}
.c-submit:hover:after {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
}
.IE8 .c-submit:after {
    content: none;
}
.IE8 .c-submit:hover:after {
    content: "";
}

.c-submitset {
    text-align: center;
}

.c-submitset > li {
    display: inline-block;
    margin: 0 5px;
}






/* -----------------------------

.confirmTxt

----------------------------- */

.confirmArea { margin: 0 auto; max-width: 600px; }
.confirmTxt { margin: 40px auto 0; width: 100%; }
.confirmTxt p { margin-top: -1px; padding: 15px 5%; color: #e803a4; border: #e803a4 1px solid; line-height: 1.8; }

/*@media screen and (max-width: 768px) {
.confirmTxt { margin: 35px auto 0; }
}
@media screen and (max-width: 738px) {
.confirmTxt { margin: 30px auto 0; }
}*/


/* -----------------------------

#form .txtArea

----------------------------- */
#form .txtArea { padding: 0; position: relative; z-index: 4; text-align: left; }


/* -----------------------------
.applyArea2
----------------------------- */

#form .applyArea { border-top: #a276c9 1px dotted; margin-top: 45px; position: relative; z-index: 4; }
/* h3, h4*/
#form .applyArea h3 { font-size: 15px; font-weight: bold; letter-spacing: 1px; line-height: 1.8; }
#form .applyArea h4 { font-size: 15px; font-weight: normal; letter-spacing: 1px; line-height: 1.8; }


/* -----------------------------
.applyBox, .applyBox2
----------------------------- */

#form .applyBox,
#form .applyBox2 { padding: 35px 0; text-align: left; }
#form .applyBox { border-bottom: none; }
#form .applyBox2 { border-top: #a276c9 1px dotted; }


/* -----------------------------
.leftBox, .rightBox
----------------------------- */

#form .applyBox .leftBox,
#form .applyBox2 .leftBox { float: left; width: 20%; }
#form .applyBox .rightBox,
#form .applyBox2 .rightBox { float: right; width: 75%; border-left: #a276c9 1px dotted; padding-left: 5%; }
/* ul li */
#form .applyBox ul { list-style: disc; margin: 0; padding: 0; padding-left: 1em; }
#form .applyBox ul li { font-size: 14px; font-weight: normal; letter-spacing: 1px; line-height: 1.9; margin-bottom: 5px; }
#form .applyBox ul li:last-child { margin-bottom: 0; }
#form .applyBox ul li a { border-bottom: #111 1px dotted; }
#form .applyBox ul li a:hover { color: #fefefe; background: #111; border-bottom: #111 1px solid; }
/* ul li ul */
#form .applyBox ul li ul { list-style: decimal }
#form .applyBox ul li ul li { margin-bottom: 0; }
/* table */
#form table.info { border-collapse: collapse; margin-top: 10px; font-size: 13px; letter-spacing: 1px; line-height: 1.9; }
#form table.info tr { padding-bottom: 3px; display: block; }
#form table.info tr:last-child { margin-bottom: 0; }
#form table.info th { width: 90px; }
#form .linkArea { border-top: #a276c9 1px dotted; margin-top: 0px; padding-top: 30px; }