/* ------------------------------------------------------------------
placeholder
------------------------------------------------------------------ */
@media print,screen and (min-width:768px) {
  input::-webkit-input-placeholder,
  textarea::-webkit-input-placeholder{
    color: #999;
    font-size: 1.6rem;
  }
  input:-moz-placeholder,
  textarea:-moz-placeholder {
    color: #999;
    font-size: 1.6rem;
  }
}
@media only screen and (max-width:767.98px) {
  input::-webkit-input-placeholder,
  textarea::-webkit-input-placeholder{
    color: #999;
    font-size: 1.6rem;
  }
  input:-moz-placeholder,
  textarea:-moz-placeholder {
    color: #999;
    font-size: 1.6rem;
  }
}

/* ------------------------------------------------------------------
form
------------------------------------------------------------------ */
@media print,screen and (min-width:768px) {
  div.formArea {
  }
  div.formArea div.form{
  }
  div.form dl {
    display: table;
    width: 100%;
    border-bottom: 1px solid #ddd;
    line-height: 1.6;
    box-sizing: border-box;
  }
  div.form dl:first-of-type{
    border-top: 1px solid #ddd;
  }
  div.form dl dt {
    display: table-cell;
    width: 30%;
    padding: 20px;
    vertical-align: middle;
    font-weight: 700;
    background: rgba(0,0,0,0.02);
  }
  div.form dl dt span {
    display: inline-block;
    vertical-align: middle;
    width: 40px;
    margin: -4px 15px 0 0;
    padding: 3px 0;
    border-radius: 3px;
    text-align: center;
    font-size: 1.2rem;
    font-weight: 400;
  }
  div.form dl dt span.must {
    background: #ea4949;
    color: #FFF;
  }
  div.form dl dt span.option {
    background: #999;
    color: #FFF;
  }
  div.form dl dd {
    display: table-cell;
    width: 70%;
    padding: 20px;
    vertical-align: middle;
  }
	div.form dl dd .row{
		margin: 0 0 15px;
	}
	div.form dl dd .row:last-child{
		margin: 0;
	}
  div.form dl dd textarea,
  div.form dl dd input[type="text"],
  div.form dl dd input[type="date"],
  div.form dl dd input[type="tel"],
  div.form dl dd input[type="email"],
  div.form dl dd input[type="number"],
  div.form dl dd select{
    font-size: 1.6rem;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    width: 100%;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 10px;
    box-sizing: border-box;
  }
  div.form dl dd input[type="radio"],
  div.form dl dd input[type="checkbox"]{
    display: inline-block;
    vertical-align: middle;
    margin: -6px 10px 0 0;
  }
  div.form dl dd label{
    cursor: pointer;
  }
  div.form dl dd textarea{
    height: 10em;
  }
  div.form dl dd p.note{
    margin: 5px 0 0;
		font-size: 1.4rem;
  }
  .select-wrap {
    position: relative;
  }
  .select-wrap:before {
    z-index: 1;
    content: "";
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    transform: translate(0, -50%);
    border: 5px solid transparent;
    border-top: 8px solid #222;
    margin: 5px 0 0;
    pointer-events: none;
  }
  .select-wrap select {
    outline:none;
    text-overflow: '';
    vertical-align: middle;
    font-size: inherit;
    color: inherit;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 10px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 100%;
    box-sizing: border-box;
  }
  .select-wrap select::-ms-expand {
    display: none;
  }
  .select-wrap select:-moz-focus-inner {
    border: 0;
  }
  .select-wrap select::-moz-focusring { 
    color: transparent; 
    text-shadow: 0 0 0 #999;
  }
}
@media only screen and (max-width:767.98px) {
  div.formArea {
  }
  div.formArea div.form{
  }
  div.form * {
    font-size: 1.6rem;
  }
  div.form dl {
    padding: 15px 0;
    border-bottom: 1px dotted #ddd;
    line-height: 1.6;
    box-sizing: border-box;
  }
  div.form dl:first-of-type{
    border-top: 1px dotted #ddd;
  }
  div.form dl dt {
    font-weight: 700;
    margin: 0 0 10px;
  }
  div.form dl dt span {
    display: inline-block;
    vertical-align: middle;
    width: 30px;
    margin: -4px 10px 0 0;
    padding: 3px 0;
    border-radius: 3px;
    text-align: center;
    font-size: 1.0rem;
    font-weight: 400;
  }
  div.form dl dt span.must {
    background: #ea4949;
    color: #FFF;
  }
  div.form dl dt span.option {
    background: #999;
    color: #FFF;
  }
  div.form dl dd {
  }
	div.form dl dd .row{
		margin: 0 0 10px;
	}
	div.form dl dd .row:last-child{
		margin: 0;
	}
  div.form dl dd textarea,
  div.form dl dd input[type="text"],
  div.form dl dd input[type="date"],
  div.form dl dd input[type="tel"],
  div.form dl dd input[type="email"],
  div.form dl dd input[type="number"],
  div.form dl dd select{
    font-size: 1.6rem;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    width: 100%;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 10px;
    box-sizing: border-box;
  }
  div.form dl dd input[type="radio"],
  div.form dl dd input[type="checkbox"]{
    display: inline-block;
    vertical-align: middle;
    margin: -4px 5px 0 0;
  }
  div.form dl dd label{
    cursor: pointer;
  }
  div.form dl dd textarea{
    height: 10em;
  }
  div.form dl dd p.note{
    margin: 5px 0 0;
		font-size: 1.0rem;
  }
  .select-wrap {
    position: relative;
  }
  .select-wrap:before {
    z-index: 1;
    content: "";
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    transform: translate(0, -50%);
    border: 5px solid transparent;
    border-top: 8px solid #222;
    margin: 5px 0 0;
    pointer-events: none;
  }
  .select-wrap select {
    outline:none;
    text-overflow: '';
    vertical-align: middle;
    font-size: inherit;
    color: inherit;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 10px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 100%;
    box-sizing: border-box;
  }
  .select-wrap select::-ms-expand {
    display: none;
  }
  .select-wrap select:-moz-focus-inner {
    border: 0;
  }
  .select-wrap select::-moz-focusring { 
    color: transparent; 
    text-shadow: 0 0 0 #999;
  }
  .ui-widget-content{
    font-size: 125% !important;
  }
}

/* ------------------------------------------------------------------
agreebox
------------------------------------------------------------------ */
@media print,screen and (min-width:768px) {
  .agreebox{
  }
	.agreebox p,
	.agreebox p a{
		font-size: 1.4rem;
		line-height: 1.8;
	}
	.agreebox a{
		text-decoration: underline;
	}
  .agreebox .ag-agree{
    margin: 20px 0 0;
  }
  .agreebox .ag-agree label{
    display: inline-block;
		vertical-align: middle;
    padding: 15px 30px;
    border: 4px solid #ea4949;
    border-radius: 5px;
    cursor: pointer;
  }
  .agreebox .ag-agree label input{
    display: inline-block;
    vertical-align: middle;
    margin: -4px 8px 0 0;
  }
}
@media only screen and (max-width:767.98px) {
  .agreebox{
  }
	.agreebox p,
	.agreebox p a{
		font-size: 1.2rem;
		line-height: 1.4;
	}
	.agreebox a{
		text-decoration: underline;
	}
  .agreebox .ag-agree{
    margin: 10px 0 0;
  }
  .agreebox .ag-agree label{
    display: block;
		text-align: center;
    padding: 15px;
    border: 4px solid #ea4949;
    border-radius: 5px;
    cursor: pointer;
  }
	.agreebox .ag-agree label span{
		font-size: 1.4rem !important;
	}
  .agreebox .ag-agree label input{
    display: inline-block;
    vertical-align: middle;
    margin: -2px 6px 0 0;
  }
}

/* ------------------------------------------------------------------
btnArea
------------------------------------------------------------------ */
@media print,screen and (min-width:768px) {
  div.form div.formbtn {
    overflow: hidden;
    padding: 40px 0 0 0;
    text-align: center;
  }
  div.form div.formbtn div{
    margin: 0 0 20px;
  }
  div.form div.formbtn div:last-of-type{
    margin: 0;
  }
  div.form div.formbtn input {
    cursor: pointer;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    border: none;
    display: inline-block;
    text-decoration: none;
    line-height: 1;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
  div.form div.formbtn div.submit input {
    padding: 20px 120px;
    font-size: 2.4rem;
		font-weight: 700;
		letter-spacing: 0.02em;
    background: #222;
    color: #FFF;
  }
  div.form div.formbtn div.back input {
    padding: 10px 60px;
    font-size: 1.8rem;
		font-weight: 700;
		letter-spacing: 0.02em;
    border: 1px solid #222;
    background: #fff;
    color: #222;
  }
  div.form div.formbtn div.submit input:hover{
    opacity: 0.75;
  }
  div.form div.formbtn div.back input:hover{
    opacity: 0.75;
  }
}
@media only screen and (max-width:767.98px) {
  div.form div.formbtn {
    overflow: hidden;
    padding: 30px 0 0 0;
    text-align: center;
  }
  div.form div.formbtn div{
    margin: 0 0 20px;
  }
  div.form div.formbtn div:last-of-type{
    margin: 0;
  }
  div.form div.formbtn input {
    cursor: pointer;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    border: none;
    display: inline-block;
    text-decoration: none;
    line-height: 1;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
  div.form div.formbtn div.submit input {
    width: 100%;
    padding: 20px 0px;
    font-size: 1.8rem;
		font-weight: 700;
		letter-spacing: 0.02em;
    background: #222;
    color: #FFF;
  }
  div.form div.formbtn div.back input {
    padding: 10px 60px;
    font-size: 1.4rem;
		font-weight: 700;
		letter-spacing: 0.02em;
    border: 1px solid #222;
    background: #fff;
    color: #222;
  }
  div.form div.formbtn div.submit input.hover{
    opacity: 0.75;
  }
  div.form div.formbtn div.back input.hover{
    opacity: 0.75;
  }
}

/* ------------------------------------------------------------------
valid
------------------------------------------------------------------ */
@media print,screen and (min-width:768px) {
  div.form dl dd span.error{
    display: block;
		letter-spacing: normal;
    margin: 5px 0 0 0;
    font-size: 1.4rem;
    color: #ea4949;
  }
  div.form dl dd span.error:before{
    display: inline-block;
    vertical-align: middle;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-style: normal;
    content: "\f071";
    margin: 0 0.6em 0 0;
  }
}
@media only screen and (max-width:767.98px) {
  div.form dl dd span.error{
    display: block;
		letter-spacing: normal;
    margin: 5px 0 0 0;
    font-size: 1.2rem;
    color: #ea4949;
  }
  div.form dl dd span.error:before{
    display: inline-block;
    vertical-align: middle;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-style: normal;
    content: "\f071";
    margin: 0 0.4em 0 0;
  }
}

/* ------------------------------------------------------------------
message
------------------------------------------------------------------ */
@media print,screen and (min-width:768px) {
  div.message{
    display: block;
    padding: 20px 0;
    margin: 0 0 40px 0;
    font-size: 2.0rem;
    font-weight: 700;
    text-align: center;
    background: #fff;
  }
  div.message.error{
    border: 4px solid #ea4949;
    color: #e53c56;
  }
  div.message.confirm{
    border: 4px solid #333;
    color: #222;
  }
}
@media only screen and (max-width:767.98px) {
  div.message{
    display: block;
    padding: 10px;
    margin: 0 0 20px;
    font-size: 1.6rem;
    line-height: 1.4;
    font-weight: 700;
    text-align: center;
  }
  div.message.error{
    border: 4px solid #ea4949;
    color: #e53c56;
  }
  div.message.confirm{
    border: 4px solid #333;
    color: #222;
  }
}

/* ------------------------------------------------------------------
width
------------------------------------------------------------------ */
@media print,screen and (min-width:768px) {
  div.form dl.tel dd input {
    width: 30%;
  }
	div.form dl.birth dd{
		letter-spacing: -.4em;
	}
	div.form dl.birth .col{
    display: inline-block;
		letter-spacing: normal;
		width: 33.3333333%;
	}
	div.form dl.birth .col .s{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
    width: 14%;
		padding: 0 0 0 5px;
    box-sizing: border-box;
		font-weight: normal;
	}
	div.form dl.birth .col .select-wrap{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
		width: 82%;
	}
	div.form dl.ad .row{
		letter-spacing: -.4em;
	}
	div.form dl.ad .row .s{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
    width: 14%;
		padding: 0 10px 0 0;
		text-align: right;
    box-sizing: border-box;
		font-weight: normal;
	}
	div.form dl.ad .row .col,
	div.form dl.ad .row .select-wrap{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
		width: 86%;
	}
	div.form dl.ad .row .col.zip input{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
		width: 30%;
	}
	div.form dl.ad .row .col.zip .line{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
		padding: 0 10px;
	}
}
@media only screen and (max-width:767.98px) {
  div.form dl.tel dd input {
    width: 28%;
  }
	div.form dl.birth dd{
	}
	div.form dl.birth .col{
    display: block;
		letter-spacing: normal;
		margin: 0 0 10px;
	}
	div.form dl.birth .col:last-of-type{
		margin: 0;
	}
	div.form dl.birth .col .s{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
    width: 10%;
		padding: 0 0 0 5px;
    box-sizing: border-box;
		font-weight: normal;
	}
	div.form dl.birth .col .select-wrap{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
		width: 88%;
	}
	div.form dl.ad .row{
		letter-spacing: -.4em;
	}
	div.form dl.ad .row .s{
		font-size: 1.0rem;
		display: block;
		letter-spacing: normal;
		vertical-align: middle;
		padding: 0 0 3px;
		font-weight: normal;
	}
	div.form dl.ad .row:first-of-type .s{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
		padding: 0 3px 0 0;
		text-align: right;
    box-sizing: border-box;
	}
	div.form dl.ad .row:first-of-type .col{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
		width: 90%;
	}
	div.form dl.ad .row .col.zip input{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
		width: 30%;
	}
	div.form dl.ad .row .col.zip .line{
    display: inline-block;
		letter-spacing: normal;
		vertical-align: middle;
		padding: 0 10px;
	}
}

/* ------------------------------------------------------------------
confirm
------------------------------------------------------------------ */
@media print,screen and (min-width:768px) {
	.mw_wp_form_confirm div.col {
    width: auto !important;
    margin: 0 20px 0 0 !important;
  }
  .mw_wp_form_confirm span.s{
    width: auto !important;
  }
  .mw_wp_form_confirm dl.ad span.s:after{
    content: "：" !important;
  }
  .mw_wp_form_confirm .select-wrap{
    width: auto !important;
  }
  .mw_wp_form_confirm .select-wrap:before {
    display: none !important;
  }
}
@media only screen and (max-width:767.98px) {
	.mw_wp_form_confirm div.col {
    width: auto !important;
    letter-spacing: normal !important;
    margin: 0 10px 0 0 !important;
  }
  .mw_wp_form_confirm span.s{
    width: auto !important;
  }
  .mw_wp_form_confirm dl.ad span.s:after{
    content: "：" !important;
  }
  .mw_wp_form_confirm .select-wrap{
    width: auto !important;
     letter-spacing: normal !important;
 	}
  .mw_wp_form_confirm .select-wrap:before {
    display: none !important;
  }
}