@charset "utf-8";
/* Snow Monkey Forms用
***************************/
.contact-form-txt {
text-align:center;
padding:10px;
}
[data-screen="confirm"] .hidetxt p {
display: none;
}
[data-screen="confirm"] .smf-placeholder{
	font-size:18px;
}
.smf-form--business .smf-item {
  border: 1px solid #ddd;
  margin-bottom: 0;
  margin-top: -1px;
}
.smf-form--business .smf-item:not(:first-child) {
  border-top: 1px solid #ddd;
}
.smf-checkbox-control input[type="checkbox"] {
width:10px;
height:10px;
padding:7px;
border-radius:5px;
position:relative;
display: inline-block;
bottom:7px;
}
.smf-label{
text-align:center;
}
[data-screen=confirm] .smf-placeholder:has([name="checkboxes-doui[]"]){
text-align:center;
}
.smf-text-control input[type="email"] {
font-size:18px;
padding:0.5em;
border-radius:5px;
margin-bottom:0.5em;
width:90%;
}
.smf-radio-buttons-control input[type="radio"] {
width: 24px;
height: 24px;
vertical-align: middle;
}
.smf-radio-button-control__label{
padding-top:5px;
font-size:18px;
}
.txt_w30{
border:1px #89BDDE solid;
font-size:18px;
padding:0.5em;
border-radius:5px;
margin-bottom:0.5em;
width:30%;
}
.txt_w50{
border:1px #89BDDE solid;
font-size:18px;
padding:0.5em;
border-radius:5px;
margin-bottom:0.5em;
width:50%;
}
.txt_w70{
border:1px #89BDDE solid;
font-size:18px;
padding:0.5em;
border-radius:5px;
margin-bottom:0.5em;
}
.txt_w90{
border:1px #89BDDE solid;
font-size:18px;
padding:0.5em;
border-radius:5px;
margin-bottom:0.5em;
width:80%;
}
.smf-textarea-control textarea {
border:1px #89BDDE solid ;
font-size:18px;
padding:0.5em;
border-radius:5px;
margin-bottom:0.5em;
height:300px;
width:100%;
box-sizing: border-box; 
}
.smf-item:has([data-validations~="required"]) .smf-item__label__text::after { /* 必須ラベル */
content: "必須";
float:right;
padding: 5px 3px;
color: #fff;
background-color: crimson;
font-size: 12px;
line-height: 1;
border-radius: 4px;
}
[data-screen="confirm"] .smf-item:has([data-validations~="required"]) .smf-item__label__text::after { 
display: none;
}
.smf-focus-point {/*確認・完了表示位置をページトップに*/
  top: -9999px;
}
.screen-reader-text{
	display: none;
}
.smf-error-messages {
margin:0 auto 10px;
background: #ee0101;
position:relative;
color: #fff;
max-width :400px;
min-width: 120px;
font-size: 16px;
border: 2px solid #fff;
box-shadow: 0 0 6px #000;
-moz-box-shadow: 0 0 6px #000;
-webkit-box-shadow: 0 0 6px #000;
-o-box-shadow: 0 0 6px #000;
padding: 5px 10px 5px 10px;
border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-o-border-radius: 6px;
}

/* 生年月日3カラム設定 */
.smf-item__controls:has([class="smf-text-control__control three-column"]){
	display:inline-flex;
	width:100%;
	flex-direction:row;
}
.smf-item__controls:has([class="smf-text-control__control three-column"]) p{
	margin:12px;
}
[data-screen=confirm] .smf-item__controls:has([data-name="birth01"],[data-name="birth02"],[data-name="birth03"]){
	display:inline-flex;
	width:100%;
	flex-direction:row;
}
[data-screen=confirm] .smf-item__controls:has([data-name="birth01"],[data-name="birth02"],[data-name="birth03"]) p{
	margin:3px 7px 0 3px;
}
.three-column {
	font-size:18px;
}

/* プログレストラッカー */
.smf-progress-tracker {
  display: flex;
  flex-wrap: nowrap;
  list-style: none;
  margin-bottom: var(--_margin1);
  margin-left: 0;
  padding-left: 0;
}
.smf-progress-tracker__item {
  align-items: center;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  margin: 0;
  position: relative;
  width: 33.33333%;
}
/* 進捗バー（横線）*/
.smf-progress-tracker__item:after,
.smf-progress-tracker__item:before {
  background-color:#D0E1F9;
  content: "";
  display: block;
  height: 3px;
  position: absolute;
  top: 10px;
}
.smf-progress-tracker__item:before {
  left: 0;
  right: 50%;
}
.smf-progress-tracker__item:after {
  left: 50%;
  right: 0;
}
/* 完了・入力中状態の表示切替 */
.smf-progress-tracker__item--complete:after,
.smf-progress-tracker__item--input:before {
  display: none;
}
/* 番号表示 */
.smf-progress-tracker__item__number {
  align-items: center;
  background-color: #D0E1F9;
  border-radius: 100%;
  color: #fff;
  display: flex;
  height: 24px;
  justify-content: center;
  letter-spacing: 0;
  overflow: hidden;
  position: relative;
  width: 24px;
  z-index: 1;
}
/* 番号下のテキスト */
.smf-progress-tracker__item__text {
  color: var(--_light-color-gray);
  margin-top: 0.5em;
}
/* 進行状況に応じた背景・文字色 */
[data-screen=back] .smf-progress-tracker__item--input .smf-progress-tracker__item__number,
[data-screen=complete] .smf-progress-tracker__item--complete .smf-progress-tracker__item__number,
[data-screen=confirm] .smf-progress-tracker__item--confirm .smf-progress-tracker__item__number,
[data-screen=input] .smf-progress-tracker__item--input .smf-progress-tracker__item__number,
[data-screen=invalid] .smf-progress-tracker__item--input .smf-progress-tracker__item__number {
  background-color: #2b83ff;
  font-weight: 700;
}
[data-screen=back] .smf-progress-tracker__item--input .smf-progress-tracker__item__text,
[data-screen=complete] .smf-progress-tracker__item--complete .smf-progress-tracker__item__text,
[data-screen=confirm] .smf-progress-tracker__item--confirm .smf-progress-tracker__item__text,
[data-screen=input] .smf-progress-tracker__item--input .smf-progress-tracker__item__text,
[data-screen=invalid] .smf-progress-tracker__item--input .smf-progress-tracker__item__text {
  color: #2b83ff;
  font-weight: 700;
}

/* 送信ボタン等のカスタマイズ */
form .smf-action{
  display: flex;
}
form .smf-action .smf-button-control{
  margin: 0 auto;
}
form .smf-action .smf-button-control button{
  position: relative;
  text-align: left;
  box-sizing: border-box;
  border-radius: 1em;
  padding: 1em 3em;
  font-size: 1.5em;
  font-weight: 600;
  display: flex;
  align-items: center;
  color: #fff;
  background: #0099ff;
  border: none;
  transition: .3s;
}
form .smf-action .smf-button-control button:hover {
  transition: .3s;
  opacity: .7;
}
form .smf-action .smf-button-control button[data-action="back"]{
  background: #cccccc;
}

/* 発送方法選択ボタン */

.choice-button{
  text-align: center;
}
.buttonRound {
  display: inline-block;
  width: 80%;
  max-width: 200px;
  height: 65px;
  padding: 40px 34px 0;
  font-size: 18px;
  margin:0 5px;
  color: #fff;
  text-align: center;
  background-color: #0099ff;
  border-radius: 15px; /* (buttonの高さ / 2) の値 */
}
.buttonRound:hover {
  transition: .3s;
  opacity: .7;
}