@charset "utf-8";
/*!
 * contact CSS
 * ---------------------------------------------
 * 下層ページのcss
 *
 */

/*===================================
	element
=====================================*/
.inner {
    width: 908px;
    line-height: 1.6;
}
.sec {
    font-size: 18px;
    line-height: 1.6;
}
.sec h2 {
    margin-bottom: 70px;
}
.sec > p {
    margin-bottom: 2em;
}
/*===================================
	フォーム
=====================================*/
/*  form
---------------------------------*/

.form__list span.confirm {
    font-size: 27px;
}

.sec form {
    margin: 80px 0 140px;
    line-height: 1.4;
}
.sec form > p {
    margin-bottom: 1.6em;
    font-size: 21px;
    font-weight: 600;
}
.sec form h3 {
    margin-top: 70px;
    font-weight: normal;
}
.sec form h3 + ul {
    margin-bottom: 100px;
}
.form__list {
    letter-spacing: -.40em;
    margin-bottom: 40px;
}
.form__list > dt,.form__list > dd {
    display: inline-block;
	vertical-align: top;
	letter-spacing: normal;
}
.form__list > dt {
    width: 245px;
    padding-top: 5px;
}
.form__list > dd {
    width: 659px;
    margin-bottom: 20px;
}
.form__list > dt.end,.form__list > dt.end + dd {
    margin-top: 30px;
    padding-top: 0;
    vertical-align: middle;
}
.form__list > dt span {
    display: inline-block;
    vertical-align: middle;
}
.form__list > dt span:nth-of-type(1) {
    width: 147px;
    font-size: 20px;
}
span.required {
    display: inline-block;
    padding: 0.2em 0.4em;
    border-radius: 5px;
    background: #ff0000;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
}
span.required.gray {
    background: #afafaf;
}
.form__list > dd label {
    font-size: 24px;
    font-weight: 600;
}
.form__list > dd .note {
    display: inline-block;
    vertical-align: middle;
    font-size: 17px;
}
.note.n1 {
    width: 25em;
    margin-left: -2em;
}
.note.n2 {
    width: 18em;
    margin-left: 0.7em;
}
.note.n3 {
    width: 18em;
}
.form__list > dd .note.n4 {
    display: block;
    margin-top: 10px;
    text-align: right;
}
.submitBtn {
    margin-top: 70px;
    text-align: center;
}

/*  form parts
---------------------------------*/
:placeholder-shown {
	color: #afafaf;
    opacity: 1;
    font-weight: bold;
}
::-webkit-input-placeholder {
	color: #afafaf;
    opacity: 1;
    font-weight: bold;
}
:-moz-placeholder {
	color: #afafaf;
	opacity: 1;
    font-weight: bold;
}
::-moz-placeholder {
	color: #afafaf;
	opacity: 1;
    font-weight: bold;
}
:-ms-input-placeholder {
	color: #afafaf;
	opacity: 1;
    font-weight: bold;
}
input[type="text"],input[type="email"],select {
    height: 41px;
    line-height: 41px;
    padding-left: 13px;
    border: solid 1px;
    font-size: 20px;
}
input[type="radio"] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: solid 1px;
}
input[type="radio"] {
    display: inline-block;
    vertical-align: middle;
}
.radioBlock {
    position: relative;
    margin-right: 2em;
}
.radioBlock input {
    margin-right: 0.5em;
}
.radioBlock input:checked:after {
    display: block;
    position: absolute;
    top: 50%;
    left: 8px;
    margin-top: -6px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #afafaf;
}
@-moz-document url-prefix() {
	.radioBlock input:checked:after  {
		margin-top: -5px;
	}
}
textarea {
    width: 100%;
    height: 110px;
    margin-bottom: 20px;
    padding: 10px;
    border: solid 1px;
    line-height: 1.2;
}
input[type="text"],
input[type="email"],
select,
input[type="radio"],
textarea {
    border-color: #f7ac3b;
    background: #fff9b3;
}
.radioBlock input:checked:after {
    background: #f7ac3b;
}
input[type="text"] + input[type="text"] {
    margin-left: 42px;
}
select {
    color: #afafaf;
    font-size: 20px;
    font-weight: bold;
}
.selectbox {
    position: relative;
}
.selectbox:after {
    display: block;
    position: absolute;
    top: 50%;
    right: 13px;
    margin-top: -5px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 6px 0 6px;
    border-color: #afafaf transparent transparent transparent;
}
.submitBtn input[type="submit"],
.submitBtn input[type="button"],
.submitBtn button {
    width: 279px;
    height: 73px;
    line-height: 73px;
    border-radius: 10px;
    background: #afafaf;
    color: #fff;
    font-size: 30px;
    letter-spacing: 0.5em;
    text-indent: 0.5em;
}
.submitBtn button {
    border: none;
    cursor: pointer;
}
.submitBtn button:hover {
    opacity: 0.7;
}
.txt1 {
    width: 305px;
}
.txt2 {
    width: 100%;
}
.txt3 {
    width: 337px;
}
.txt4 {
    width: 212px;
}

/*  確認ページ
---------------------------------*/
.confirm input[type="text"],.confirm input[type="email"],.confirm select,.confirm input[type="radio"],.confirm textarea {
    background: transparent;
}
.confirm select {
    color: #000;
}
.confirm .selectbox:after {
    display: none;
}
.confirm .submitBtn input {
    margin-right: 53px;
}
.confirm .submitBtn input[type="submit"],
.confirm .submitBtn input[type="button"],
.confirm .submitBtn button {
    letter-spacing: 0.2em;
    text-indent: 0.2em;
}

/*  応募完了
---------------------------------*/
.thanks .sec p {
    margin: -1.2em 0 0.9em;
    font-size: 28px;
    text-align: center;
    line-height: 1.6;
    font-weight: 600;
}
.thanks .sec figure img {
    margin: auto auto 120px;
}

/************************************************************************************
smaller than 660px
*************************************************************************************/
@media screen and (max-device-width: 660px) {

	/*===================================
        element
    =====================================*/
    .inner {
        width: 640px;
        padding: 0 30px;
    }
    .sec {
        font-size: 26px;
    }
    .sec h2 {
        margin: 0 0 50px;
    }

    /*===================================
        フォーム
    =====================================*/
    /*  form
    ---------------------------------*/
    .sec form {
        padding: 0;
    }
    .sec form > p {
        font-size: 28px;
    }
    .form__list > dt,.form__list > dd {
        display: block;
        width: auto;
    }
    .form__list > dt {
        margin-bottom: 20px;
    }
    .form__list > dd {
        margin-bottom: 30px;
        padding-bottom: 30px;
        border-bottom: solid 1px #ccc;
    }
    .form__list > dt.end,.form__list > dt.end + dd {
        margin-top: 0;
    }
    .form__list > dt span:nth-of-type(1) {
        width: 480px;
        font-size: 30px;
    }
    span.required {
        font-size: 24px;
    }
    .form__list > dd label {
        font-size: 30px;
        font-weight: 600;
    }
    .form__list > dd .note {
        margin-top: 10px;
        font-size: 24px;
    }
    .note.n1,.note.n2,.note.n3 {
        width: auto;
        margin-left: 0;
    }
    .submitBtn {
        margin-top: 40px;
    }

    /*  form parts
    ---------------------------------*/
    input[type="text"],input[type="email"],select {
        height: 50px;
        line-height: 50px;
        padding-left: 20px;
        font-size: 30px;
    }
    input[type="text"] + input[type="text"] {
        margin-left: 20px;
    }
    select {
        font-size: 30px;
    }
    .submitBtn input[type="submit"],
    .submitBtn input[type="button"],
    .submitBtn button {
        height: 90px;
        line-height: 90px;
        font-size: 40px;
    }
    .txt1,select {
        width: 270px;
    }

    /*  確認ページ
    ---------------------------------*/
    .confirm input[type="text"],.confirm input[type="email"] {
        overflow-x: auto;
    }
    .confirm .submitBtn input[type="submit"],
    .confirm .submitBtn input[type="button"],
    .confirm .submitBtn button {
        width: 250px;
    }
    .confirm .submitBtn input {
        margin-right: 20px;
    }

}

.non-active .submitBtn input {
    cursor: default;
}

.submitBtn input[type="submit"].active,
.submitBtn input[type="button"].active,
.submitBtn button.active {
    background: #00ac34;
}