@charset "UTF-8";
/**
 * block.css
 */

/* ブロック表示
--------------------------------------------------------- */
.contact_block {
	display: block;
	width: 100%;
	height: 100%;
	text-align: left;
	margin: 0;
	padding: 0;
}
	.contact_block .text_wrap {
		padding: 16px;
		/* color: #333533; */
	}

.contact_block .field_item .field_label {
    background: none;
    border: none;
    font-weight: bold;
    font-size: 12px;
}

.contact_btn_area {
	text-align: center;
	width: 100%;
	margin: 32px 0;
}



/* contact_style
--------------------------------------------------------- */
.contact_style {
	margin: 0;
	font-size: 14px;
	line-height: 21px;
	padding: 32px;
	border: none;
}
    .contact_style .field_items .field_item .field_label {
        background: none;
        border: none;
        font-weight: bold;
        font-size: 12px;
    }
    .contact_style .field_items .field_item .field_value {
        display: block;
        margin: 0;
        padding: 4px 20px;
        text-align: left;
    }
		.contact_style .field_items .field_item .field_value .radio_label {
			display: inline-block;
			font-size: 14px;
			margin: auto 16px auto 0;
			line-height: 21px;
			padding: 0;
			border: none;


/*
			margin-bottom: 3.2px;
			margin-left: 0px;
			margin-right: 16px;
			margin-top: 3.2px;
			position: relative;
			left: 0px;
			top: 0px;
			height: 22px;
			font-style: normal;
			text-align: left;
			width: auto;
*/

		}
        .contact_style .field_items .field_item .field_value input[type="radio"]{
            top:0;
            margin: 3px;
        }
		.contact_block_setting_modal .field_items .contact_style_field .contact_style label.radio_label.selected {
			border: none;
		}

/* contact_style1
--------------------------------------------------------- */
.contact_style1 {
    padding: 32px;
}
    .contact_style1 .field_items {
    }
        .contact_style1 .field_items .field_item {
            padding: 0 0 10px 0;
            margin-bottom: 20px;
        }
            .contact_style1 .field_items .field_item .field_label {
                border-bottom: dashed 1px #ddd;
                padding: 0 0 4px 8px;
                margin-bottom: 10px;
                display: block;
                height: auto;
                font-size: 16px;
            }
                .contact_style1 .field_items .field_item .field_label .required {
                    display: inline-block;
                    font-size: 0.7em;
                    font-weight: normal;
                    background: #f7f7f7;
                    border-radius: 3px;
                    padding: 2px 6px;
                }
            .contact_style1 .field_items .field_item .field_value {
                padding: 0 10px;
            }
                .contact_style1 .field_items .field_item .field_value .radio_label {
                    padding: 0;
                }
    .contact_style1 .contact_btn_area {
        padding: 0;
        margin: 0 auto;
        text-align: center;
    }


/* contact_style2
--------------------------------------------------------- */
.contact_style2 {
    padding: 32px;
}
    .contact_style2 .field_items {
        padding-bottom: 20px;
    }
        .contact_style2 .field_items .field_item {
            padding: 10px 0;
            border-bottom: solid 1px #ddd;
        }
        .contact_style2 .field_items .field_item:after {
            content:'';
            display:block;
            clear: both;
        }
            /* 項目名 */
            .contact_style2 .field_items .field_item .field_label {
                width: 25%;
                vertical-align: top;
                font-size: 1em;
                float: left;
                color: #666;
                background: #ededed;
            }
                .contact_style2 .field_items .field_item .field_label .required {
                    background: #f55936;
                    color: #fff;
                    padding: 4px 8px 2px 8px;
                    font-weight: normal;
                }

            /* 選択肢 */
            .contact_style2 .field_items .field_item .field_value {
                font-size: 1em;
                width: auto;
                display: block;
                margin-left: 25%;
            }
                /* ラジオボタン */
                .contact_style2 .field_items .field_item .field_value .radio_label {
                    display: block;
                    padding:0 0 6px 0;
                }
    .contact_style2 .contact_btn_area {
        padding: 0;
        margin: 0 auto;
        text-align: center;
    }


/* contact_style3
--------------------------------------------------------- */
.contact_style3 {
    padding: 32px;
    border:solid 1px #ddd;
}
    .contact_style3 .field_items {
    }
        .contact_style3 .field_items .field_item {
            padding: 0 0 10px 0;
            margin-bottom: 20px;
        }
            .contact_style3 .field_items .field_item .field_label {
                font-size: 1.1em;
                color: #666;
            }
            .contact_style3 .field_items .field_item .field_label:before {
                content: "\eb36";
                padding-right: 8px;
            }
                .contact_style3 .field_items .field_item .field_label .required {
                    border:solid 1px #bd2b2b;
                    border-radius: 3px;
                    padding: 3px 5px;
                    font-weight: normal;
                    font-size: 0.6em;
                    vertical-align: middle;
                }

            /* 選択肢 */
            .contact_style3 .field_items .field_item .field_value textarea,
            .contact_style3 .field_items .field_item .field_value input {
                background: #f4f4f4;
                border: none;
            }
            .contact_style3 .field_items .field_item .field_value input[type="radio"]{
                top:0;
                margin: 3px;
            }
                .contact_style3 .field_items .field_item .field_value .form_error_message {
                    background: #fcd6cf;
                    color: #c54127;
                    padding: 6px 12px;
                    font-size: 0.9em;
                    margin-top: 8px;
                }
                    .contact_style3 .field_items .field_item .field_value .radio_label .option_label {
                        vertical-align: middle;
                    }
    .contact_style3 .contact_btn_area {
        text-align: center;
    }


/* contact_style4
--------------------------------------------------------- */
.contact_style4 {
    padding: 32px;
}
    .contact_style4 .field_items {
    }
        .contact_style4 .field_items .field_item {
            padding: 0 0 10px 0;
            margin-bottom: 20px;
        }
            /* 項目名 */
            .contact_style4 .field_items .field_item .field_label {
                font-size: 1.1em;
                color: #333;
                background: #eee;
                border-left: solid 8px #ddd;
                padding: 10px 12px;
                margin-bottom: 16px;
            }
            /* 選択肢 */
            .contact_style4 .field_items .field_item .field_value {
                padding: 0;
                margin: 0;
            }
                /* 入力エリア */
                .contact_style4 .field_items .field_item .field_value textarea,
                .contact_style4 .field_items .field_item .field_value input {
                    border-radius: 0;
                }
                    .contact_style4 .field_items .field_item .field_value textarea:hover,
                    .contact_style4 .field_items .field_item .field_value input:hover {
                        border: solid 2px #1cd0e0;
                    }
    .contact_style4 .contact_btn_area {
        text-align: center;
    }



/* 編集画面でのブロック表示
--------------------------------------------------------- */
.block_edit_areas .contact_block {
	cursor: grab;
	user-select: none;
}
.block_edit_areas .contact_block .ql-editor {
	cursor: grab;
}



/* 設定
--------------------------------------------------------- */
.contact_block_setting_modal .button_wrap {
	display: inline-block;
	width: auto;
	margin: 0 32px 0 0;
}

.contact_block_setting_modal .field_items .contact_style_field label.radio_label {
	display: block;
	padding: 16px 24px;
	border: 1px solid #ccc;
	border-radius: 8px;
	margin-bottom: 16px;
	cursor: pointer;
}
	.contact_block_setting_modal .field_items .contact_style_field label.radio_label:hover {
		background: #f9f9f9;
	}
	.contact_block_setting_modal .field_items .contact_style_field label.radio_label.selected {
		border: 3px solid #2eb1c7;
	}
	.contact_block_setting_modal .contact_style_field .radio_label .contact_style {
		margin-top: 8px;
	}


/* レスポンシブ bootstrap4 v2
----------------------------------------------- */
/* モバイル（xs） iPhone 6,7,8 縦 */
@media (max-width: 575px) {
}
/* モバイル（sm）iPhone 6,7,8 横 */
@media (min-width: 576px) and (max-width: 767px) {
}
/* タブレット（md） iPad 縦 */
@media (min-width: 768px) and (max-width: 991px) {
}
/* タブレット（lg） iPad 横 iPad Pro 縦 */
@media (min-width: 992px) and (max-width: 1199px) {
}
/* PC（xl）iPad Pro 横 */
@media (min-width: 1200px) {
}