@charset "UTF-8";
@import url("https://fonts.googleapis.com/icon?family=Material+Icons+Outlined");
@import url("https://fonts.googleapis.com/icon?family=Material+Symbols+Outlined");

html {
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
	font-size: 20px;
}

body {
	background-color: #EBF1F3;
	line-height: 1.2;
	overflow-x: hidden;
}

.disp_font {
	font-size: 24px;
	font-weight: 800;
}

.container {
	min-height: calc(100vh - 25px);
}

.color-attend {
	color: #F3FFB2;
}

.color-alert {
	color: #FFB2B5;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

a {
	color: inherit;
	text-decoration: none;
	transition: ease .2s;
}

a:hover {
	color: #FFFF00;
}

.box__main-navi .list__main-navi.current a {
	color: #FFFF00;
}

.container {
	min-height: calc(100vh - 25px);
}

h2 {
	color: #037461;
	font-size: 1.3rem;
	font-weight: bold;
	margin-bottom: 10px;
}

h3 {
	color: #037461;
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 10px;
}

.no_disp {
	display: none;
}

.underline {
	text-decoration: underline;
}

.itemdata {
	font-size: 18px;
}

section {
	margin: 20px 100px 20px;
}

.table {
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
}

.table th,
.table td {
	padding: 10px 12px;
	border-bottom: 1px dashed rgba(0, 0, 0, .1);
	text-align: left;
	word-break: break-word;
	vertical-align: middle;
}

.table th {
	color: #6b7280;
	font-weight: 600;
	font-size: 16px;
	line-height: 0.3;
	overflow-wrap: anywhere;
}

.table td {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.table tr {
	line-height: 1;
}

.table tbody tr:hover {
	background-color: #fffcb8 !important;
}

.table tbody tr:nth-child(2n+1) {
	background-color: #FFF;
}

.table tbody tr:nth-child(even) {
	background-color: #e6ffea;
}

.table_answer {
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
	border: 1px solid;
}

.table_answer th,
.table_answer td {
	padding: 10px 12px;
	border-bottom: 1px dashed rgba(0, 0, 0, .1);
	text-align: left;
	word-break: break-word;
	vertical-align: middle;
	border: 1px solid;
}

.table_answer th {
	color: #6b7280;
	font-weight: 600;
	font-size: 20px;
	line-height: 0.3;
	overflow-wrap: anywhere;
	text-align: center;
}

.table_answer td {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.table_answer tr {
	line-height: 1;
}

input[type="text"],
input[type="number"],
input[type="date"],
input[type="datetime-local"],
input[type="password"],
input[type="email"],
textarea {
	padding: 8px 16px;
	padding-right: 1em;
	border: solid 1px #999;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	background-color: #FFF;
	resize: vertical;
}


textarea {
	width: 100%;
}

/* login
--------------------------------------- */
body#login {
	position: relative;
}

.login {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: #EEE;
	border: solid 10px #FFF;
	padding: 85px 100px;
	box-shadow: 0 0 10px rgba(0, 0, 0, .15);
}

.login h1 {
	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 30px;
}

.login h1::before {
	font-size: 2rem;
	content: "\e897";
	font-family: "Material Icons Outlined";
	font-weight: 400;
	margin-right: 10px;
	vertical-align: middle;
}

.title-id-login {
	font-weight: normal;
}

input.form-login {
	width: 400px;
	margin-bottom: 20px;
	padding: 5px;
	border-top: none;
	border-left: none;
	border-bottom: solid 1px #999;
	border-right: none;
	background: #FFF;
	border-radius: 0;
}

input.form-login:focus {
	border-bottom-color: #39C;
	outline: none;
}

button.button-login {
	font-weight: bold;
	color: #FFF;
	line-height: 50px;
	width: 180px;
	background-color: #39C;
	border: solid 1px #39C;
	text-align: center;
	transition: ease .3s;
	margin: 0 auto;
}

button.button-login:hover {
	color: #39C;
	background-color: #FFF;
}

::-webkit-input-placeholder {
	/* WebKit, Blink, Edge */
	color: #ccc;
}

:-ms-input-placeholder {
	/* Internet Explorer 10-11 */
	color: #ccc;
}

::placeholder {
	/* Others */
	color: #ccc
}

.error-text {
	color: #F00;
	margin: 10px 0;
}

/* header
--------------------------------------- */
header {
	color: #FFF;
	background-color: #037461;
	padding: 0 50px;
	z-index: 999;
	position: relative;
	box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
}

.main-navi {
	font-size: 0.75rem;
	font-weight: bold;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.box__main-navi,
.box_admin-navi {
	padding: 15px 0;
	display: flex;
	align-items: center;
}

.main-navi ul li {
	margin-right: 40px;
	position: relative;
}

.main-navi ul li:last-child {
	margin-right: 0;
}

.main-navi ul li a {
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1.2;
}

.icn_home a::before {
	content: "\e88a";
	font-family: "Material Icons Outlined";
	font-size: 1.875rem;
	font-weight: normal;
}

.icn_enquete a::before {
	content: "\e0ee";
	font-family: "Material Icons Outlined";
	font-size: 1.875rem;
	font-weight: normal;
}

.icn_question a::before {
	content: "\e241";
	font-family: "Material Icons Outlined";
	font-size: 1.875rem;
	font-weight: normal;
}

.icn_reminder a::before {
	content: "\e7f7";
	font-family: "Material Icons Outlined";
	font-size: 1.875rem;
	font-weight: normal;
}

.icn_company a::before {
	content: "\ea40";
	font-family: "Material Icons Outlined";
	font-size: 1.875rem;
	font-weight: normal;
}

.icn_admin a::before {
	content: "\f02e";
	font-family: "Material Icons Outlined";
	font-size: 1.875rem;
	font-weight: normal;
}

.icn_operation a::before {
	content: "\e30a";
	font-family: "Material Icons Outlined";
	font-size: 1.875rem;
	font-weight: normal;
}

.icn_notice a::before {
	content: "\e554";
	font-family: "Material Icons Outlined";
	font-size: 1.875rem;
	font-weight: normal;
}

.icn_login a::before {
	content: "\e853";
	font-family: "Material Icons Outlined";
	font-size: 1.875rem;
	font-weight: normal;
}

.icn_logout a::before {
	content: "\e9ba";
	font-family: "Material Icons Outlined";
	font-size: 1.875rem;
	font-weight: normal;
}

/* search
--------------------------------------- */
.box-search {
	padding: 30px;
	background-color: #FFF;
	border-radius: 20px;
	position: relative;
}

.search-div-full {
	width: 100%;
}

.area-search {
	background-color: #EEE;
	padding: 20px;
	border-radius: 10px;
}

.area-search h3 {
	font-size: 20px;
	font-weight: bold;
	color: #666;
	margin-bottom: 15px;
}

.block-search {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}

.search-items-vtcl {
	width: 100%;
}

.form-items-vtcl {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	gap: 20px;
}

.form-items-vtcl div {
	width: calc((100% - 80px) / 5);
}

.form-items-vtcl .box-date {
	width: 100%;
}

.form-items-vtcl .date-range {
	display: flex;
	align-items: center;
	width: 150%;
	gap: 8px;
}

.form-label {
	font-weight: bold;
	color: #037461;
	margin-bottom: 5px;
	line-height: 1;
}

.form-text {
	width: 100%;
	padding: 10px 16px !important;
}

.form-text-answer-right {
	text-align: right;
}

.form-text-answer-max {
	width: 100%;
}

.form-text-answer-mid {
	width: 70%;
}

.form-text-answer-half {
	width: 50%;
}

.form-text-answer-short {
	width: 15%;
}

.form-data {
	margin-bottom: 10px;
}

.form-data-search {
	margin-top: 15px;
	margin-bottom: 10px;
}

.date_search {
	width: 100%;
}

/* entry
--------------------------------------- */
.entry-item {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.entry-item2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.entry-item2-long {
	display: grid;
	grid-template-columns: 1fr 3fr;
	gap: 20px;
	margin-bottom: 20px;
}

.entry-item2-1-1 {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.entry-item2-2 {
	display: grid;
	grid-template-columns: 2fr 2fr;
	gap: 20px;
	margin-bottom: 20px;
}

.entry-item3 {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.entry-item3-long {
	display: grid;
	grid-template-columns: 1fr 1fr 3fr;
	gap: 20px;
	margin-bottom: 20px;
}

.entry-item3-1-2-1 {
	display: grid;
	grid-template-columns: 1fr 2fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.entry-item4 {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.entry-item5 {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.entry-list {
	grid-template-columns: 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.fullwidth {
	grid-column: 1 / -1;
}

.box-text input {
	width: 100%;
	line-height: 1.3;
}

.required {
	color: red;
}

/* reference
--------------------------------------- */
.reference-item {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin-bottom: 20px;
	overflow-wrap: anywhere;
}

.reference-item2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.reference-item3 {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.reference-item4 {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.reference-item5 {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

/* enquete
--------------------------------------- */
h3.enquete {
	margin-top: 15px !important;
	margin-bottom: 0px !important;
}

.enquete-sub {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
}

.enquete-item {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 20px;
}

.enquete-item-add {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin-left: 50px;
}

.enquete-radio {
	padding: 8px 16px;
	padding-right: 1em;
	border: solid 1px #999;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	background-color: #FFF;
	resize: vertical;
	appearance: auto;
	/* 標準見た目を使用 */
	-webkit-appearance: auto;
	-moz-appearance: auto;
}

.answer-item-sales {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 20px;
}

.answer-item-second {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}

.answer-item-second-mid {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 20px;
}

.answer-item-second-wide {
	display: grid;
	grid-template-columns: 1fr 3fr;
	gap: 20px;
}

.answer-item-second-radio {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	gap: 20px;
}

.answer-item-third {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 20px;
}

.answer-wrapper {
	display: grid;
	gap: 20px;
}

/* 1行個 */
.answer-wrapper.per-1 {
	grid-template-columns: repeat(1, 1fr);
}

/* 1行2個 */
.answer-wrapper.per-2 {
	grid-template-columns: repeat(2, 1fr);
}

/* 1行3個 */
.answer-wrapper.per-3 {
	grid-template-columns: repeat(3, 1fr);
}

/* 1行4個 */
.answer-wrapper.per-4 {
	grid-template-columns: repeat(4, 1fr);
}

/* 1行4個 */
.answer-wrapper.per-5 {
	grid-template-columns: repeat(5, 1fr);
}

.row {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
	margin: 20px 0;
}

.col {
	flex: 1 1 280px;
	min-width: 240px;
}

.col2 {
	flex: 1 1 280px;
	min-width: 160px;
	display: flex;
}

.card {
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, .06);
	border-radius: 16px;
	padding: 16px 18px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, .08);
}

.card2 {
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, .06);
	border-radius: 16px;
	padding: 16px 18px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, .08);
	margin: 0;
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
}

.muted {
	color: #6b7280;
}

.title {
	font-size: 20px;
	color: #037461;
	font-weight: bold;
}

.title_item {
	font-size: 22px;
	font-weight: bold;
	margin-left: 20px;
}

.title_question {
	font-size: 20px;
	font-weight: bold;
	margin-left: 40px;
}

.row.card-row .card>div[style*="overflow:auto"] {
	flex: 1;
}

.spacer {
	flex: 1
}

.divider {
	border-top: 3px solid #037461;
	margin: 16px 0;
}

.toolbar {
	display: flex;
	gap: 12px;
	align-items: center;
}

.toolbar_inner {
	display: flex;
	gap: 12px;
	align-items: center;
	margin-bottom: 10px;
}

.inner_btn_area {
	display: flex;
	gap: 12px;
	align-items: center;
	margin-top: 35px;
}

/* footer
--------------------------------------- */
footer {
	font-size: 0.75rem;
	color: #FFF;
	text-align: center;
	background-color: #037461;
	padding: 5px 0;
	z-index: 900;
	position: relative;
}

/* parts
--------------------------------------- */
/* パンくずリスト */
.breadcrumbs {
	padding: 0 50px;
}

.list__breadcrumbs {
	padding: 15px 0;
	margin-right: 15px;
	display: inline-block;
}

.list__breadcrumbs:nth-child(n+2)::before {
	content: "\e315";
	font-family: "Material Icons Outlined";
	font-weight: normal;
	line-height: 0.8;
	margin-right: 15px;
}

/* 進捗バー（回答率） */
/* 既存 */
.progress {
	height: 10px;
	background: rgba(0, 0, 0, .08);
	border-radius: 999px;
	overflow: hidden;
}

.progress>span {
	display: block;
	background: linear-gradient(90deg, #22d3ee, #3b82f6);
	width: 0%;
}

/* 行の中で縦方向を中央揃え */
td.progress-cell {
	vertical-align: middle;
}

/* ボタン */
.btn {
	font-weight: 600;
	cursor: pointer;
	line-height: 1;

	border: 1px solid rgba(0, 0, 0, .12);
	color: var(--ink);
	background: linear-gradient(180deg, #f9fafb, #f3f4f6);
	padding: 10px 14px;
	border-radius: 12px;
	align-items: center;
}

.btn_center {
	text-align: center;
	margin-top: 30px;
}

/* 新規登録ボタン */
.new_regist_btn_area {
	display: flex;
	justify-content: flex-end;
}

.new_regist_btn {
	background: linear-gradient(180deg, #037461, #037461);
	color: #fff;
	margin-top: -15px;
}

.new_regist_btn:hover {
	color: #037461;
	line-height: 1;
	background: #FFF;
	border: solid 1px #037461;
}

/* 登録・更新・検索ボタン */
.regist_btn,
.update_btn,
.proxy_btn,
.save_btn,
.search_btn {
	width: 8em;
	background: #037461;
	color: #fff;
}

.regist_btn:hover,
.update_btn:hover,
.proxy_btn:hover,
.save_btn:hover,
.search_btn:hover {
	color: #037461;
	background: #FFF;
	border: solid 1px #037461;
}

.cancel_btn,
.clear_btn {
	width: 8em;
	color: #037461;
	background: #FFF;
	border: solid 1px #037461;
}

.cancel_btn:hover,
.clear_btn:hover {
	color: #FFF;
	background: #037461;
}

/* 編集・複写・終了・復元ボタン */
.edit_btn,
.copy_btn,
.end_btn,
.revival_btn {
	background: linear-gradient(180deg, #037461, #037461);
	color: #fff;
}

.edit_btn:hover,
.copy_btn:hover,
.end_btn:hover,
.revival_btn:hover {
	color: #037461;
	background: #FFF;
	border: solid 1px #037461;
}

.back_btn {
	color: #037461;
	background-color: #FFF;
	border: solid 1px #037461;
}

.back_btn:hover {
	color: #FFF;
	background: #037461;
}

.mail_btn {
	background: linear-gradient(180deg, #0F6CBD, #0F6CBD);
	color: #fff;
}

.mail_btn:hover {
	color: #0F6CBD;
	background: #FFF;
	border: solid 1px #0F6CBD;
}

.delete_btn {
	background: linear-gradient(180deg, #dc2626, #dc2626);
	color: #fff;
}

.delete_btn:hover {
	color: #dc2626;
	background: #FFF;
	border: solid 1px #dc2626;
}

.postal_csv_btn,
.result_csv_btn {
	background: linear-gradient(180deg, #32cd32, #32cd32);
	color: #fff;
	margin-top: -15px;
	text-align: center;
}

.postal_csv_btn:hover,
.result_csv_btn:hover {
	color: #32cd32;
	background: #FFF;
	border: solid 1px #32cd32;
}

.test_btn {
	background: linear-gradient(180deg, #ff8c00, #ff8c00);
	color: #fff;
}

.test_btn:hover {
	color: #ff8c00;
	line-height: 1;
	background: #FFF;
	border: solid 1px #ff8c00;
}

.clear_btn_inner {
	color: #037461;
	background-color: #FFF;
	border: solid 1px #037461;
}

.clear_btn_inner:hover {
	color: #FFF;
	background: #037461;
}

.delete_test_btn {
	background: linear-gradient(180deg, #fee2e2, #fecaca);
	color: #991b1b;
	margin-top: -15px;
}

.delete_test_btn:hover {
	color: #991b1b;
	background: #FFF;
	border: solid 1px #991b1b;
}

.preview_btn {
	background: linear-gradient(180deg, #037461, #037461);
	color: #fff;
	margin-top: -15px;
}

.preview_btn:hover {
	color: #037461;
	line-height: 1;
	background: #FFF;
	border: solid 1px #037461;
}

.select_btn {
	background: linear-gradient(180deg, #dcdcdc, #dcdcdc);
	color: #000000;
	margin-top: -15px;
}

.select_btn:hover {
	color: #dcdcdc;
	line-height: 1;
	background: #FFF;
	border: solid 1px #000000;
}

.add_btn {
	background: linear-gradient(180deg, #1e90ff, #1e90ff);
	color: #fff;
	margin-top: -15px;
}

.add_btn:hover {
	color: #1e90ff;
	line-height: 1;
	background: #FFF;
	border: solid 1px #1e90ff;
}

.compile_btn {
	background: linear-gradient(180deg, #037461, #037461);
	color: #fff;
	margin-top: -15px;
}

.compile_btn:hover {
	color: #037461;
	line-height: 1;
	background: #FFF;
	border: solid 1px #037461;
}

.remove_btn {
	background: linear-gradient(180deg, #ff6060, #ff6060);
	color: #fff;
	margin-top: -15px;
}

.remove_btn:hover {
	color: #ff6060;
	line-height: 1;
	background: #FFF;
	border: solid 1px #ff6060;
}

.request_btn,
.apply_btn,
.agent_btn {
	background: linear-gradient(180deg, #1e90ff, #1e90ff);
	color: #fff;
}

.request_btn:hover,
.apply_btn:hover,
.agent_btn:hover {
	color: #1e90ff;
	line-height: 1;
	background: #FFF;
	border: solid 1px #1e90ff;
}

.denail_btn {
	background: linear-gradient(180deg, #ff6060, #ff6060);
	color: #fff;
}

.denail_btn:hover {
	color: #ff6060;
	line-height: 1;
	background: #FFF;
	border: solid 1px #ff6060;
}

.delete_destination_btn {
	background: linear-gradient(180deg, #dc2626, #dc2626);
	color: #fff;
	margin-top: 20px;
}

.delete_destination_btn:hover {
	color: #dc2626;
	background: #FFF;
	border: solid 1px #dc2626;
}

/* セレクト */
.selectmenu {
	width: 100%;
	position: relative;
}

.selectmenu select {
	width: 100%;
	padding: 10px 16px;
	padding-right: 1em;
	border: solid 1px #999;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	outline: 0;
	background-color: #fff;
	text-overflow: ellipsis;
	cursor: pointer;
}

.selectmenu::before {
	position: absolute;
	content: "";
	top: 15px;
	right: 1em;
	width: 8px;
	height: 8px;
	border-right: 2px solid #333;
	border-bottom: 2px solid #333;
	transform: rotate(45deg);
	z-index: 10;
}

.selectmenu-short {
	width: 50%;
	position: relative;
}

.selectmenu-short select {
	width: 100%;
	padding: 10px 16px;
	padding-right: 1em;
	border: solid 1px #999;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	outline: 0;
	background-color: #fff;
	text-overflow: ellipsis;
	cursor: pointer;
}

.selectmenu-short::before {
	position: absolute;
	content: "";
	top: 15px;
	right: 1em;
	width: 8px;
	height: 8px;
	border-right: 2px solid #333;
	border-bottom: 2px solid #333;
	transform: rotate(45deg);
	z-index: 10;
}

.selectmenu_inner {
	position: relative;
}

.selectmenu_inner select {
	padding: 10px 16px;
	padding-right: 1em;
	border: solid 1px #999;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	outline: 0;
	background-color: #fff;
	text-overflow: ellipsis;
	cursor: pointer;
}

.selectmenu_inner::before {
	position: absolute;
	content: "";
	top: 15px;
	right: 1em;
	width: 8px;
	height: 8px;
	border-right: 2px solid #333;
	border-bottom: 2px solid #333;
	transform: rotate(45deg);
	z-index: 10;
}

/* form radio-group */
.radioGroup {
	display: flex;
}

.radioGroup-item input[type="radio"]+label {
	background-color: #FFF;
	padding: 10px 16px;
	min-width: 4em;
	border-top: solid 1px #999;
	border-right: solid 1px #999;
	border-bottom: solid 1px #999;
	white-space: nowrap;
}

.radioGroup-item {
	display: contents;
}

.radioGroup .radioGroup-item:first-child input[type="radio"]+label {
	-webkit-border-radius: 50px 0 0 50px;
	border-radius: 50px 0 0 50px;
	border-left: solid 1px #999;
	padding-left: 24px;
	white-space: nowrap;
}

.radioGroup .radioGroup-item:last-child input[type="radio"]+label {
	-webkit-border-radius: 0 50px 50px 0;
	border-radius: 0 50px 50px 0;
	padding-right: 24px;
	white-space: nowrap;
}

.radioGroup-item input[type="radio"]:checked+label {
	color: #FFF;
	background-color: #037461;
}

.radioGroup-item input[type="checkbox"] {
	display: none;
}

.radioGroup-item input[type="checkbox"]+label {
	background-color: #FFF;
	padding: 10px 16px;
	min-width: 4em;
	border-top: solid 1px #999;
	border-right: solid 1px #999;
	border-bottom: solid 1px #999;
	white-space: nowrap
}

.radioGroup .radioGroup-item:first-child input[type="checkbox"]+label {
	-webkit-border-radius: 50px 0 0 50px;
	border-radius: 50px 0 0 50px;
	border-left: solid 1px #999;
	padding-left: 24px;
}

.radioGroup .radioGroup-item:last-child input[type="checkbox"]+label {
	-webkit-border-radius: 0 50px 50px 0;
	border-radius: 0 50px 50px 0;
	padding-right: 24px;
}

.radioGroup-item input[type="checkbox"]:checked+label {
	color: #FFF;
	background-color: #0075A1;
}

/* list
--------------------------------------- */
.list_title {
	background-color: #037461;
}

.list_title th {
	color: #FFF;
}

.top_enquete_list thead tr th:nth-child(1) {
	width: 30%;
}

.top_enquete_list thead tr th:nth-child(2) {
	width: 15%;
}

.top_enquete_list thead tr th:nth-child(3) {
	width: 15%;
}

.top_enquete_list thead tr th:nth-child(4) {
	width: 15%;
}

.top_enquete_list_simple thead tr th:nth-child(1) {
	width: 65%;
}

.enquete_list thead tr th:nth-child(1) {
	width: 30%;
}

.enquete_list thead tr th:nth-child(2) {
	width: 10%;
}

.enquete_list thead tr th:nth-child(3) {
	width: 10%;
}

.enquete_list thead tr th:nth-child(4) {
	width: 10%;
}

.enquete_list thead tr th:nth-child(5) {
	width: 10%;
}

.enquete_list thead tr th:nth-child(6) {
	width: 15%;
}

.question_list thead tr th:nth-child(1) {
	width: 46%;
}

.question_list thead tr th:nth-child(2) {
	width: 10%;
}

.question_list thead tr th:nth-child(3) {
	width: 10%;
}

.question_list thead tr th:nth-child(4) {
	width: 10%;
}

.question_list thead tr th:nth-child(5) {
	width: 12%;
}

.question_list thead tr th:nth-child(6) {
	width: 12%;
}

.problem_list thead tr th:nth-child(1) {
	width: 4%;
}

.problem_list thead tr th:nth-child(2) {
	width: 40%;
}

.problem_list thead tr th:nth-child(3) {
	width: 10%;
}

.problem_list thead tr th:nth-child(4) {
	width: 15%;
}

.problem_list thead tr th:nth-child(5) {
	width: 15%;
}

.problem_list thead tr th:nth-child(6) {
	width: 6%;
}

.problem_list thead tr th:nth-child(7) {
	width: 5%;
}

.notice_list thead tr th:nth-child(1) {
	width: 25%;
}

.approval_list thead tr th:nth-child(1) {
	width: 25%;
}

/* 回答履歴情報テーブル
--------------------------------------- */
.answer_history_list tr.selected {
	background-color: #a7d28d !important;
}

/* 送付先情報テーブル
--------------------------------------- */
.destination_list tr.selected {
	background-color: #a7d28d !important;
}

.destination_list thead,
.destination_list tbody tr {
	display: table;
	width: 100%;
	table-layout: fixed;
}

.destination_list tbody {
	display: block;
	height: calc(11 * 36px);
	overflow-y: auto;
}

.destination_list tbody::-webkit-scrollbar {
	width: 6px;
}

.destination_list tbody::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 0.2);
	border-radius: 3px;
}

.dest_list tr.selected {
	background-color: #a7d28d !important;
}

.dest_list thead,
.dest_list tbody tr {
	display: table;
	width: 100%;
	table-layout: fixed;
}

.dest_list tbody {
	display: block;
	overflow-y: auto;
}

.dest_list tbody::-webkit-scrollbar {
	width: 6px;
}

.dest_list tbody::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 0.2);
	border-radius: 3px;
}

/* 訪問履歴情報
--------------------------------------- */
.modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 9999;
}

.modal_content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: #fff;
	padding: 20px;
	width: 400px;
	border-radius: 8px;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
}

.modal_controls {
	text-align: right;
	margin-top: 10px;
}

.reception_history_list tr.selected,
.comment_list tr.selected,
.reminder_history_list tr.selected {
	background-color: #a7d28d !important;

}

.complete_link {
	background-color: #ccffcc !important;
}

.delete_link {
	background-color: #cccccc !important;
}

/* ===== 親タイトル（問題番号＋削除） ===== */
.problem-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-weight: bold;
	margin-bottom: 12px;
}

/* 親同士の区切り線 */
.problem-separator {
	border-top: 1px solid #ddd;
	margin: 24px 0;
}

/* ===== 子問題の見た目 ===== */

/* 子はインデント表示 */
.problem-indent {
	padding-left: 32px;
	border-left: 3px solid #ccc;
}

/* 子をまとめるコンテナ */
.problem-children {
	margin-top: 16px;
}

/* 子タイトル（子1、子2…） */
.child-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-weight: bold;
	margin-bottom: 8px;
}

/* 子同士の区切り線 */
.child-separator {
	border-top: 1px dashed #ccc;
	margin: 16px 0;
}

/* 子追加ボタン */
.child-add-area {
	margin-top: 12px;
}

.child-add-btn {
	font-size: 12px;
	color: #0073aa;
	cursor: pointer;
}

.child-add-btn:hover {
	text-decoration: underline;
}



/* =====================================================
 * プレビュー：モーダル全体
 * 画面最前面に表示するため body 直下で使用
 * ===================================================== */
#previewModal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	/* 管理画面のどの要素よりも前 */
	display: none;
	/* 初期は非表示 */
}

/* JS で開くときに付与 */
#previewModal.is-open {
	display: block;
}

/* =====================================================
 * 背景オーバーレイ（画面を暗くする）
 * ===================================================== */
#previewModal .preview-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.55);
}

/* =====================================================
 * モーダル本体
 * ===================================================== */
#previewModal .preview-modal {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);

	width: 90%;
	max-width: 1920px;
	max-height: 85vh;

	background: #ffffff;
	border-radius: 6px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);

	display: flex;
	flex-direction: column;
	overflow: hidden;

	z-index: 100000;
}

/* =====================================================
 * モーダルヘッダー
 * ===================================================== */
#previewModal .preview-header {
	padding: 12px 16px;
	border-bottom: 1px solid #ddd;
	background: #f7f7f7;

	display: flex;
	justify-content: space-between;
	align-items: center;

	font-weight: bold;
}

/* 閉じるボタン */
#previewModal .preview-header button {
	background: none;
	border: none;
	font-size: 20px;
	cursor: pointer;
}

/* =====================================================
 * モーダル本文（スクロール領域）
 * ===================================================== */
#previewModal .preview-body {
	padding: 16px;
	overflow-y: auto;
}

/* =====================================================
 * モーダルフッター
 * ===================================================== */
#previewModal .preview-footer {
	padding: 12px 16px;
	border-top: 1px solid #ddd;
	text-align: right;
}

/* =====================================================
 * 問題ブロック
 * ===================================================== */
.preview-question {
	margin-bottom: 28px;
	/* 問題同士の間隔 */
}

.preview-question h4 {
	margin-bottom: 6px;
}

/* 補足文 */
.preview-supplement {
	font-size: 13px;
	color: #666;
	margin-bottom: 8px;
}

/* =====================================================
 * 子問題
 * ===================================================== */
.preview-child {
	margin-top: 12px;
	padding-left: 16px;
	border-left: 3px solid #ddd;
}

/* =====================================================
 * 回答エリア共通
 * ===================================================== */
.preview-answers {
	margin-top: 8px;
}

/* 回答ラベル */
.preview-answers label {
	display: block;
	margin-bottom: 6px;
	cursor: pointer;
}

/* =====================================================
 * 行内表示個数（グリッド）
 * ===================================================== */
.preview-answers.grid-1 {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
}

.preview-answers.grid-2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

.preview-answers.grid-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}

.preview-answers.grid-4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
}

.preview-answers.grid-5 {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
}

/* =====================================================
 * 最大選択数表示（チェックボックス）
 * ===================================================== */
.preview-limit {
	font-size: 13px;
	color: #444;
	margin-bottom: 6px;
}

/* =====================================================
 * その他選択肢
 * ===================================================== */
.preview-other {
	display: flex;
	align-items: center;
	gap: 8px;
}

.preview-other-input {
	flex: 1;
	padding: 4px 6px;
}

/* =====================================================
 * テキスト入力
 * ===================================================== */
.preview-text {
	width: 300px;
	padding: 6px;
}

/* 単位付きテキスト */
.preview-text-unit {
	display: flex;
	align-items: center;
	gap: 8px;
}

.preview-unit {
	font-size: 14px;
}

/* =====================================================
 * テキストエリア
 * ===================================================== */
.preview-textarea {
	width: 100%;
	padding: 6px;
}

/* =====================================================
 * 表形式（テキスト入力）
 * ===================================================== */
.preview-table {
	width: 100%;
	/* ★ 指示通り100% */
	border-collapse: collapse;
	margin-top: 8px;
}

.preview-table th,
.preview-table td {
	border: 1px solid #ccc;
	padding: 6px;
	text-align: center;
}

.preview-table-input {
	width: 100%;
	box-sizing: border-box;
}

/* =====================================================
 * 共通：ラジオ・チェックの label 見た目
 * ===================================================== */
.preview-answers label {
	display: flex;
	align-items: center;
	gap: 8px;

	padding: 6px 8px;
	border-radius: 4px;

	cursor: pointer;
	user-select: none;
}

/* hover 時 */
.preview-answers label:hover {
	background: #f2f6f4;
}

/* =====================================================
 * input 自体は非表示（見た目はカスタム）
 * ===================================================== */
.preview-answers input[type="radio"],
.preview-answers input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;

	width: 18px;
	height: 18px;
	margin: 0;

	border: 2px solid #4f8f7b;
	background: #fff;
	cursor: pointer;
	position: relative;
}

/* =====================================================
 * ラジオボタン
 * ===================================================== */
.preview-answers input[type="radio"] {
	border-radius: 50%;
}

/* ラジオ checked */
.preview-answers input[type="radio"]:checked::after {
	content: "";
	position: absolute;
	inset: 3px;
	background: #4f8f7b;
	border-radius: 50%;
}

/* =====================================================
 * チェックボックス
 * ===================================================== */
.preview-answers input[type="checkbox"] {
	border-radius: 3px;
}

/* チェックボックス checked */
.preview-answers input[type="checkbox"]:checked::after {
	content: "";
	position: absolute;
	inset: 2px;
	background: #4f8f7b;
}

/* =====================================================
 * disabled 表示
 * ===================================================== */
.preview-answers input:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* =====================================================
 * その他入力（横いっぱい）
 * ===================================================== */
.preview-other {
	grid-column: 1 / -1;
	/* 行内表示数に関係なく横一杯 */
}

.preview-other-input {
	width: 100%;
	padding: 6px;
	border: 1px solid #ccc;
	border-radius: 4px;
}

/* =====================================================
 * プレビュー内の全ラジオ・チェックに共通デザインを適用
 * （回答する/しない も含む）
 * ===================================================== */

/* 1) 対象を .previewModal（プレビュー領域）配下に広げる */
#previewModal input[type="radio"],
#previewModal input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;

	width: 18px;
	height: 18px;
	margin: 0;

	border: 2px solid #4f8f7b;
	background: #fff;
	cursor: pointer;
	position: relative;
}

/* ラジオ */
#previewModal input[type="radio"] {
	border-radius: 50%;
}

#previewModal input[type="radio"]:checked::after {
	content: "";
	position: absolute;
	inset: 3px;
	background: #4f8f7b;
	border-radius: 50%;
}

/* チェック */
#previewModal input[type="checkbox"] {
	border-radius: 3px;
}

#previewModal input[type="checkbox"]:checked::after {
	content: "";
	position: absolute;
	inset: 2px;
	background: #4f8f7b;
}

/* disabled */
#previewModal input[type="radio"]:disabled,
#previewModal input[type="checkbox"]:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* 2) 「回答する/しない」のようなラベル配置がバラでも整える */
#previewModal .preview-branch,
#previewModal .preview-branch label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

/* 並びに余白 */
#previewModal .preview-branch {
	margin-top: 8px;
	margin-bottom: 8px;
	gap: 16px;
}

/* アンケート金額 */
table.amount-table {
	border-collapse: collapse;
	width: 100%;
	table-layout: fixed;
}

.amount-table th,
.amount-table td {
	border: 1px solid #000;
	padding: 4px;
	text-align: center;
}