/* ------------------------------------------------------------------
placeholder
------------------------------------------------------------------ */
@media print,screen and (min-width:1000px) {
  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 screen and (max-width:999px) {
  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:1000px) {
  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 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: 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック 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 screen and (max-width:999px) {
  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 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: 16px;
    font-family: 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック 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:980px) {
  .agreebox{
  }
	.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 screen and (max-width:979px) {
  .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:1000px) {
  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: 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック 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: 3.0rem;
		font-weight: 700;
		letter-spacing: 0.02em;
    background: #3da1cd;
    color: #FFF;
		border-radius: 50px;
  }
  div.form div.formbtn div.back input {
    padding: 10px 60px;
    font-size: 1.8rem;
		font-weight: 700;
		letter-spacing: 0.02em;
    border: 1px solid #3da1cd;
    background: #fff;		color: #0d90ca;
border-radius: 50px;
  }
  div.form div.formbtn div.submit input:hover{
    opacity: 0.75;
  }
  div.form div.formbtn div.back input:hover{
    opacity: 0.75;
  }
}

@media screen and (max-width:999px) {
  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: 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック 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;
		border-radius: 50px;
  }
  div.form div.formbtn div.submit input {
    width: 100%;
    padding: 20px 0px;
    font-size: 2.0rem;
		font-weight: 700;
		letter-spacing: 0.02em;
    background: #3da1cd;
    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 #3da1cd;
    background: #fff;		color: #0d90ca;
border-radius: 50px;
  }
  div.form div.formbtn div.submit input.hover{
    opacity: 0.75;
  }
  div.form div.formbtn div.back input.hover{
    opacity: 0.75;
  }
}

/* ------------------------------------------------------------------
width
------------------------------------------------------------------ */
@media print,screen and (min-width:1000px) {
	div.form dl.name dd{
		letter-spacing: -.4em;
	}
	div.form dl.name div.col{
		display: inline-block;
		letter-spacing: normal;
		width: 49%;
		margin: 0 2% 0 0;
	}
	div.form dl.name div.col:last-of-type{
		margin: 0;
	}
	div.form dl.name div.col span.nm{
		display: inline-block;
		width: 15%;
		text-align: right;
		padding: 0 10px 0 0;
		box-sizing: border-box;
	}
	div.form dl.name div.col input{
		width: 85%;
	}
  div.form dl.name p{
    letter-spacing: normal;
  }
	div.form dl.ad div.row{
		margin: 0 0 10px;
	}
	div.form dl.ad div.row:last-of-type{
		margin: 0;
	}
	div.form dl.ad div.row span.nm{
		display: block;
		font-size: 1.4rem;
		margin: 0 0 3px;
	}
  div.form dl.ad dd div.zip input {
    width: 20%;
  }
  div.form dl.ad dd div.zip input:first-of-type{
    margin: 0 0 0 5px;
  }
  div.form dl.tel dd input {
    width: 30%;
  }
	div.form dl.items div.row{
		margin: 0 0 15px;
    padding: 0 0 15px;
    border-bottom: 1px dotted #ddd;
	}
	div.form dl.items div.row:last-of-type{
		margin: 0;
    padding: 0;
    border: none;
	}
  div.form dl.items div.row span.horizontal-item{
    margin: 0 20px 0 0;
  }
  div.form dl.items div.row span.horizontal-item:last-child{
    margin: 0;
  }
	div.form dl.items div.row span.nm{
		display: block;
		font-size: 1.4rem;
		margin: 0 0 10px;
	}
}

@media screen and (max-width:999px) {
	div.form dl.name dd{
		letter-spacing: -.4em;
	}
	div.form dl.name div.col{
		display: inline-block;
		letter-spacing: normal;
		width: 49%;
		margin: 0 2% 0 0;
	}
	div.form dl.name div.col:last-of-type{
		margin: 0;
	}
	div.form dl.name div.col span.nm{
		display: block;
		font-size: 1.2rem;
		margin: 0 0 3px;
	}
	div.form dl.name div.col input{
		width: 100%;
	}
	div.form dl.ad div.row{
		margin: 0 0 10px;
	}
  div.form dl.name p{
    letter-spacing: normal;
  }
	div.form dl.ad div.row:last-of-type{
		margin: 0;
	}
	div.form dl.ad div.row span.nm{
		display: block;
		font-size: 1.2rem;
		margin: 0 0 3px;
	}
  div.form dl.ad dd div.zip input {
    width: 30%;
  }
  div.form dl.ad dd div.zip input:first-of-type{
    margin: 0 0 0 5px;
  }
  div.form dl.tel dd input {
    width: 50%;
  }
	div.form dl.items div.row{
		margin: 0 0 10px;
    padding: 0 0 10px;
    border-bottom: 1px dotted #ddd;
	}
	div.form dl.items div.row:last-of-type{
		margin: 0;
    padding: 0;
    border: none;
	}
  div.form dl.items div.row span.horizontal-item{
    display: block;
    margin: 0 0 5px;
  }
  div.form dl.items div.row span.horizontal-item:last-child{
    margin: 0;
  }
	div.form dl.items div.row span.nm{
		display: block;
		font-size: 1.2rem;
		margin: 0 0 10px;
	}
}

/* ------------------------------------------------------------------
valid
------------------------------------------------------------------ */
@media print,screen and (min-width:1000px) {
  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 screen and (max-width:999px) {
  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:1000px) {
  div.message{
    display: block;
    padding: 20px 0;
    margin: 0 0 40px 0;
    font-size: 2.0rem;
    font-weight: 700;
    text-align: center;
    background: #fff;
		border-radius: 10px;
  }
  div.message.error{
    border: 4px solid #ea4949;
    color: #e53c56;
  }
  div.message.confirm{
    border: 4px solid #333;
    color: #222;
  }
}

@media screen and (max-width:999px) {
  div.message{
    display: block;
    padding: 10px;
    margin: 0 0 20px;
    font-size: 1.6rem;
    line-height: 1.4;
    font-weight: 700;
    text-align: center;
		border-radius: 10px;
  }
  div.message.error{
    border: 4px solid #ea4949;
    color: #e53c56;
  }
  div.message.confirm{
    border: 4px solid #333;
    color: #222;
  }
}

/* ------------------------------------------------------------------
confirm
------------------------------------------------------------------ */
@media print,screen and (min-width:1000px) {
	.mw_wp_form_confirm dl.name dd{
		letter-spacing: normal !important;
	}
  .mw_wp_form_confirm dl.name div.col {
    width: auto !important;
    margin: 0 20px 0 0 !important;
  }
  .mw_wp_form_confirm dl.name div.col span.nm {
    width: auto !important;
    padding: 0 !important;
  }
  .mw_wp_form_confirm dl.name div.col span.nm:after{
    content: "：" !important;
  }
  .mw_wp_form_confirm dl.ad div.row input,
  .mw_wp_form_confirm dl.ad div.row label{
    width: auto !important;
    float: none !important;
  }
  .mw_wp_form_confirm dl.ad div.row span.nm:after{
    content: "：" !important;
  }
  .mw_wp_form_confirm .select-wrap:before {
    display: none !important;
  }
}

@media screen and (max-width:999px) {
	.mw_wp_form_confirm dl.name dd{
		letter-spacing: normal !important;
	}
  .mw_wp_form_confirm dl.name div.col {
    width: auto !important;
    margin: 0 10px 0 0 !important;
  }
  .mw_wp_form_confirm dl.name div.col span.nm {
    width: auto !important;
    padding: 0 !important;
  }
  .mw_wp_form_confirm dl.name div.col span.nm:after{
    content: "：" !important;
  }
  .mw_wp_form_confirm dl.ad div.row input,
  .mw_wp_form_confirm dl.ad div.row label{
    width: auto !important;
    float: none !important;
  }
  .mw_wp_form_confirm dl.ad div.row span.nm:after{
    content: "：" !important;
  }
  .mw_wp_form_confirm .select-wrap:before {
    display: none !important;
  }
}


