@charset "utf-8";
/* CSS Document */
/* Sameparts of form style */
::-webkit-input-placeholder {
color:#bac9cc;
transition:all .2s;
}
::-moz-placeholder {
color:#bac9cc;
transition:all .2s;
}
:-ms-input-placeholder {
color:#bac9cc!important;
transition:all .2s;
}
:-moz-placeholder {
color:#bac9cc;
transition:all .2s;
}
:focus::-webkit-input-placeholder {
color:transparent
}
:focus::-moz-placeholder {
color:transparent
}
:focus:-ms-input-placeholder {
color:transparent!important
}
:focus:-moz-placeholder {
color:transparent
}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
-webkit-appearance:none;margin:0;}
select::-ms-expand { display: none; }

.view01 h1 {text-align: center; font-size: 1.9rem; letter-spacing: 0.07em; margin: 6% auto; color: #000; height: auto; padding: 0}
.flow {display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; width: 1000px; margin: 0 auto; max-width: 95%;}
.flow li {background: #edf4f5; padding: .8em 2em; box-sizing: border-box; position: relative; font-size: 1.1rem;letter-spacing: 0.05em; width: 34%;}
.flow li p {color: #4f929a;}
.flow li:after {content: ""; position: absolute; top: 0; right: 0; border: 1.8rem solid #fff; border-left: 1.5rem solid transparent; border-right: 0;}
.flow li:last-child {width: 29%;}
.flow li:last-child:after {border: 0;}
.flow .on {background: #4f929a;}
.flow .on p {color: #fff;}
.view02 {margin-top: 3%;}
input,textarea,select,.policy {border-radius:7px; border: 1px solid #a8d1d6; font-size: 1rem; padding: .8em 1em; box-sizing: border-box; line-height: 1.3; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.policy ol {padding: 0.001em 1em 1em 1em;}
textarea {font-family: "Noto Sans JP","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"; }
select {background: url("/common/images/form/select.png") 95% center no-repeat;}
form>div {width: 1000px; border-top: 1px solid #a8d1d6; margin: 0 auto; padding: 2.5rem 0; box-sizing: border-box; max-width: 95%;}
form table {border-collapse: collapse; border-spacing: 0; margin: 0 auto; width: 100%; font-family: "Noto Sans JP","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"; font-weight: 500;}
form th {width: 29%; text-align: left; letter-spacing: 0.07em; line-height: 1.3; padding: 0 .7em; box-sizing: border-box;font-size: 1.15rem; font-weight: 500}
form th p {display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-justify-content: space-between; justify-content: space-between;}
form td {padding: .9em 1em; box-sizing: border-box; font-size: 1.1rem;}
.required:after {content: "必須"; font-size: .9rem; color: #fff; background:#c60f0f; border-radius: 5px; font-weight: normal;padding: .2em .4em; float: right; line-height: 1.2}
.txtTop {vertical-align: top; padding-top: 1em;}
.full {width: 100%;}
.half .full {width: 95%;}
.nonepd {padding: .5em 1em;}
.half {width: 50%; float: left; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: flex-end; justify-content: flex-end;}
.dateBlk .half:first-of-type {-webkit-justify-content: flex-start; justify-content: flex-start;}
.half input {width: 85%;}
.half select {width: 98%;}
.half label {margin-right: .5em}
#zip {width: 100%;}
.chk {position: relative; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: flex-start; justify-content: flex-start; margin: .3em 1.3em .3em 0;}
.chk.disabled:before {border-color: #e4eaec; outline: 0; background: #f6f8f9;}
.chk:not(.disabled){cursor: pointer;}
.chk input {position: absolute; left: -9999px;}
.chk:before {width: 20px; height: 20px; border: 1px solid #a8d1d6; display: inline-block; content: ""; border-radius: 3px; margin-right: .7em;}
.chk:not(.disabled):hover {color:#4f929a;}
.chk span:after {content: ""; display: block; width: 26px; height: 18px; background: url(/common/images/form/chk.png) center center no-repeat; position: absolute; top: 3px; left: 1px; transition: all .3s cubic-bezier(.68,-.55,.265,1.55); -webkit-transform: scale(0); transform: scale(0); -webkit-transform-origin: center; transform-origin: center; background-size: 100% auto;}
.chk input:checked+span:after {-webkit-transform: scale(1); transform: scale(1);}
.smaller {font-size: .8em; font-weight: 400; letter-spacing: .05em;}
.smaller:before {content: "※";}
.policy {margin: 2% auto; overflow-y: auto; height: 225px; font-weight: normal; line-height: 1.5;}
.policy .right {font-size: .9em; line-height: 1.3; margin: 3% auto;}
.btn {margin: 0 auto 5%; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;}
button#confirm {width: 450px;}
button#send,button#goMain {width: 400px;}
button#return {width: 400px; margin-right: 1rem;}
.readonly {border: 0; outline: 0; background: #f6f8f9; cursor: default;}
.thanks {padding: 2.5rem 3.5em;}
.thanks p {display: inline-block; margin: 1% auto;}
p.red {overflow: hidden; width: 100%; margin: 1% auto 0;}

@media screen and (max-width: 1000px) {
    .flow li {font-size: 1.85vw;}
    .flow li:after {border-width: 3vw 0 3vw 2vw;}
    form th {font-size: 2vw;}
    form td,.policy {font-size: 1.7vw;}
    .chk:before {width: 2.2vw; height: 2.2vw;}
    .chk span:after {width: 3vw;}
    input, textarea, select,p.red,.thanks p {font-size: 1.6vw;}
    button#confirm,button#send, button#goMain,button#return {width: 40vw;}
    .flow li:after {border-width: 3.1vw 0 3.1vw 2vw;}
}
@media screen and (max-width: 1000px) and (min-width: 481px) {
    .chk span:after {top: .1vw;}
}
@media screen and (max-width: 737px) {

    .flow{
        display: none;
    }

    .view01 h1 {font-size: 4.3vw;}
    input, textarea, select,.flow li,.policy,.required:after {font-size: 2vw;}    
    .flow li {padding: .8em 3vw}
    form td,form th p, p.red, .thanks p,.seminarNotice .center {font-size: 2.3vw}
    form th,form td {width: 100%; display: block; overflow: hidden;}
    form td {margin: 1vw auto;}
    .nonepd {margin: 0 auto;}
    .nonepd .half,#mail {margin-top: 2vw;}
    #mailchk {margin-bottom: 2vw;}
    form th p {-webkit-justify-content: flex-start; justify-content: flex-start;}
    .required:after {margin-left: 1vw;}
    .chk:before {width: 3vw; height: 3vw; margin-right: 1.5vw;}
    .chk span:after {width: 4vw; height: 3vw;}
    .chk {margin-right: 2vw;}
    form th p {border-left: 1vw solid #bac9cc; padding: .5vw 2vw}
    .else {padding-bottom: 0;}
    button#confirm, button#send, button#goMain, button#return {width: 95%;}
    .thanks {padding: 5vw 4vw}

}
@media screen and (max-width: 480px) {
    .flow li {width: 15%; height: 10vw; padding: 2.5vw 3vw}
    .flow li:last-child {width: 10%}
    .flow li p {display: none;}
    .flow .on {width: 75% !important;}
    .flow .on p {display: block; line-height: 1.45; font-size: 4vw}
    .flow li:after {border-width: 5vw 0 5vw 5vw}
    .required:after {font-size: 3vw;}
    form th p {-webkit-align-items: center; align-items: center; padding: 1vw 3vw;}
    .required:after {margin-left: 2vw;}
    .policy {padding: 3vw 5vw;}
    .smaller {font-size: 3vw; letter-spacing: normal;}
    .dateBlk .half {width: 100%; -webkit-justify-content: center !important; justify-content: center !important;}
    .half select {width: 100%;}
    .dateBlk .half:first-of-type {margin-bottom: 3%;}
}
@media screen and (max-width: 480px) and (min-width: 381px) {
    form th p {font-size: 3.5vw; }
    form td, p.red, .thanks p,input, textarea, select, .policy,.seminarNotice .center  {font-size: 3.1vw;}
    .half label {margin-right: .1em;}
    .chk:before {width: 3.5vw; height: 3.5vw;}
}
@media screen and (max-width: 380px) {
    .view01 h1 {font-size: 6vw;}
    form th p {font-size: 4.5vw;}
    form td, p.red, .thanks p, input, textarea, select,.seminarNotice .center {font-size: 4vw;}
    form td p, .policy{font-size: 3.5vw}
    .half {width: 100%;}
    .half:last-of-type {margin-top: 3%}
    .chk:before {width: 4.5vw; height: 4.5vw;}
    .chk span:after {width: 5.5vw; height: 4.5vw;}
    .inquiryDetail {padding-bottom: 4vw}
}

.seminarNotice .center {text-align: center;}
.seminarNotice .btn {margin: 3% auto 10%;}
.seminarNotice .btn a {width: 500px; padding: 1.5em 1em 1.5em 2em;}

@media screen and (max-width: 640px) {
    .seminarNotice .center {max-width: 90%; text-align: left; margin: 0 auto;}
    .seminarNotice .btn a {max-width: 90%;}
}