﻿body,form,table,select,textarea{
	font-size:16px;
	font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

/*form*/
/*input[type="text"],input[type="password"],textarea {*/
input[type="text"],input[type="password"] {
	padding: 0.2em;
	outline: none;
	border: 1px solid #808080;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	font-size: 16px;
}

/*
textarea {
	width: 90%;
	height:5em;
}
*/
/*
select{
	font-size: 16px;
	padding: 0.4em;
	width:90%;
}
*/
input[type=submit], input[type=button]{
	display: inline-block;
	padding: 0.3em 0.8em;
	border-radius: 3px;
	box-sizing:border-box;
}
button{
	box-sizing:border-box;
}

input[type=submit]:not(:disabled):active,
input[type=button]:not(:disabled):active {
	-ms-transform: translateY(4px);
	-webkit-transform: translateY(4px);
	transform: translateY(4px);/*下に動く*/
	border-bottom: none;/*線を消す*/
}

.btn_blue {
    background: #33CCFF;
    border-bottom: solid 4px #0686b2;
    width: 8em;
    font-size: 13.3333px;
}

.btn_gray {
    background: #ddd;
    border-bottom: solid 4px #999999;
    width: 8em;
    font-size: 13.3333px;
}

.btn_orange {
    background: #ffb347;
    border-bottom: solid 4px #e08b1d;
    width: 8em;
    font-size: 13.3333px;
}

.btn_underline{
	background: #ffffff;
	text-decoration:underline;
	color:#0000cd;
	font-weight:bold;
	border:none;
}

.btn_main{
	background: #FFF0E4;
	border-top: solid 3px #fbf1e9;
	border-left: solid 3px #fbf1e9;
	border-right: solid 3px #fbf1e9;
	border-bottom: solid 6px #f9dbc2;
}

/* UL */
.btn_main_ul{
	background: #98E67D;
	border-top: solid 3px #baff85;
	border-left: solid 3px #baff85;
	border-right: solid 3px #baff85;
	border-bottom: solid 6px #7dc347;
}

/*DL */
.btn_main_dl{
	background: #69D8FF;
	border-top: solid 3px #6bf3ff;
	border-left: solid 3px #6bf3ff;
	border-right: solid 3px #6bf3ff;
	border-bottom: solid 6px #2cb3c2;
}

/* 変更なし */
.btn_main_no{
	background: #ffb347;
	border-top: solid 3px #ffc36b;
	border-left: solid 3px #ffc36b;
	border-right: solid 3px #ffc36b;
	border-bottom: solid 6px #e08b1d;
}

.btn_main,
.btn_main_dl,
.btn_main_ul,
.btn_main_no,
.btn_gray{
	white-space:normal;
	word-break:break-word;
}

input[type=submit]:disabled, input[type=button]:disabled {	/*ボタンがdisabledのとき*/
	background-color: #ccc;
	border-bottom: solid 4px #999999;
	cursor: not-allowed;   /* カーソル変更 */
}

/* フォーカス時 */
input[type=text]:focus, select:focus, textarea:focus{
	background-color: #dbffff;
}

/* ラジオボタン、チェックボックスのラベル */
/*
label{
	border: 1px solid #c0c0c0;
	border-radius: 3px;
	padding: 2px 6px 2px 2px;
	margin-bottom: 10px;
	cursor: pointer;
	margin-top: -1.5em;
	margin-left: 2em;
	display: block;
}
*/
.bd01{
	background:#ffffff;
}
.bd02{
	background:#dbffff;
}

/*タイトル*/
.top_d1{
	margin:0 auto 10px;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	border-radius: 10px;
	background: #95C116;
	color:#f9ffe6;
	line-height:140%;
	font-weight:bold;
	width:100%;
	font-size:17px;
	text-align:center;
}

.top_d2{
	margin:0 auto 10px;
	width:95%;
	font-weight:bold;
	font-size:17px;
	padding: 0.3em;/*文字周りの余白*/
	color: #000;/*文字色*/
	background: #f9ffe6;/*背景色*/
	border-left: solid 3px #95c116;/*左線（実線 太さ 色）*/
	/*width:900px;*/
	/*margin:10px auto 10px auto;*/
}

.top_d3{
	margin:10px auto;
	width:95%;
	text-decoration:underline;	
}

/*進捗状況*/
#pro_num{
	/*width:850px;*/
	text-align:right;
	margin:0 auto 5px auto;
}

.pro_ok{
	background-color:#66cdaa;
	border:2px #66cdaa solid;
	padding:1px 5px;
	font-size:10pt;
	text-align:center;
	margin-right:4px;
	color:#ffffff;
}

.pro_yet{
	background-color:#ffffff;
	border:2px #66cdaa solid;
	padding:1px 5px;
	font-size:10pt;
	text-align:center;
	margin-right:4px;
	color:#000000;
}

/***** テーブル *****/
.tbl1{
	border-collapse:collapse;
	background-color:rgb(255,255,255);
	border:0;
	width:100%;
	margin:0 auto;
	table-layout:fixed;
}

.tbl1 .tr1{
	background-color:#99CCFF;	/* 水色 */
}

.tbl1 .tr2{
	background-color:rgb(255,255,255);	/* #ffffff(白) */
}

.tbl1 .tr3{
	background-color	:#FFFFCC;	/* うすいイエローボーダー */
}

.tbl1 .tr4{
	background-color:#CCFFFF;	/* 水色 */
}

.tbl1 .tr5{
	background-color:#000080;	/* 濃い青 */
	color:#ffffff;
}

.tbl1 .tr6{
	background-color:#e0ffff;	/* ライトシアン */
}

.tbl1 .td1{
	padding:3px;
	line-height:1.3em;
	box-sizing:border-box;
	overflow:hidden;
}

.tbl1 .td2{
	padding:7px;
	line-height:120%;
	text-align:center;
}

.tbl1 .td3{
	padding:3px;
	line-height:1.3em;
	border: 1px solid #808080;
}

.tbl1 .td4{
	padding:7px;
	line-height:120%;
	border:1px #000000 solid;
	background-color:#CCFFFF;
}

/*設問*/
.q_num{
	border: 1px solid #808080;
	width:15%;
	padding:5px;
	line-height:1.3em;
	text-align:center;
}

.q_str{
	border: 1px solid #808080;
	width:85%;
	padding:5px;
	line-height:1.3em;
}

.text01{
	width:90%;
}

.text02{
	width:60%;
	margin:3px 3px 0 3px;
}

.text03{
	width:90%;
}

.text04{
	width:50%;
}

.text05{
	width:30%;
}

.tx_cen{	/*テキスト中央寄せ*/
	text-align:center;
}

.tx_left{	/*テキスト中央寄せ*/
	text-align:left;
}

.tx_red{
	color:#ff0000;
}

.tx_blue {
    color: #0000cc;
}

.tx_green {
  color: #008000;
}

.tx_b{
	font-weight:bold;
}

.tx_under{	/*アンダーライン*/
	text-decoration:underline;
}

.tx_s{
	font-size:13px;
}

.qa_label {/*文字の周り囲む*/
	display: inline-block;
	padding: 2px 8px;
	border: 1px solid #000000;
	background-color: #fff;
	color: #000000;
	font-size: 11pt;
	font-weight: bold;
}

.uid_input_wrap {
	width: 92%;
    margin: 0 auto;
	padding: 2px;
}
.uid_input_row {
	margin-top: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 2px;
	width: 100%;   /* ← 明示的に親いっぱいに広げる */
}
.uid_select {
    margin-top: 0;
	width: 4.5em;
	font-size: 0.85em;
	padding: 0.2em 1.2em 0.2em 0.3em;
}
.uid_text_1 { width: 2.6em; }
.uid_text_2 { width: 4.6em; }
.uid_text_3 { width: 3.4em; }
.uid_text {
	font-size: 0.85em;
}
.uid_sep {
	font-size: 0.85em;
}

.div01{
	margin:1em auto 0 auto;
	border: 1px dotted #000;
	padding: 0.3em;
}

.div02 {
	padding: 0.5em 0.5em;
	/*margin: 2em 0;*/
	font-weight: bold;
	color: #6091d3;/*文字色*/
	background: #FFF;
	border: solid 3px #6091d3;/*線*/
	border-radius: 10px;/*角の丸み*/
}
.div02 p {
	margin: 0; 
	padding: 0;
}

.div04{
	max-width:95%;
	padding:0.5em;
	border:2px dotted #696969;
	margin:0 auto;
}

/* Q&A用 */
.div06 {
    width: 100%;
    max-width: 880px;
    margin: 0 auto 10px;
    padding: 10px 12px;
    box-sizing: border-box;
    color: #000;
    background: #d2ed82;
    border-radius: 6px;
}

/* Q部分 */
.div06_q {
	width: 100%;
	margin: auto;
	padding: 8px 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
    box-sizing: border-box;
}

/* Q.と質問文 */
.q_left {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

/* + - ボタン */
.accordion_btn {
	width: 28px;
	height: 28px;
	line-height: 26px;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	color: #4b6600;
	background: #fff;
	border: 2px solid #95c116;
	border-radius: 4px;
	user-select: none;
	flex-shrink: 0;
}

/* A部分 */
.div06_a {
	display: none;           /* 初期は非表示 */
    width: 100%;
	padding: 0.5em 1em;
	margin: 8px 0 0;
	color: #000;
	background: #fff;
	border-radius: 8px;
	width: 95%;
	box-sizing: border-box;
}

/* ページトップへ戻るボタン（よくあるご質問画面のみ使用） */
.btn_pagetop {
	display: none;
	position: fixed;
	right: 20px;
	bottom: 20px;
	width: 50px;
	height: 50px;
	background: #95c116;
	color: #ffffff;
	border-radius: 50%;
	text-align: center;
	line-height: 50px;
	font-size: 20pt;
	cursor: pointer;
	box-shadow: 0 2px 6px rgba(0,0,0,0.3);
	z-index: 999;
}
.btn_pagetop:hover {
	background: #7ba30f;
}

/* よくあるご質問 */
.qa_index {
	width: 100%;
	max-width: 100%;
	padding: 15px;
	box-sizing: border-box;
}

.qa_index_grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 8px;
}

.qa_index_card {
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	white-space: normal;
	word-break: break-word;
	overflow-wrap: break-word;
}

	.qa_index_sub {
		font-size: 9pt;
		margin-top: 2px;
	}

/* よくあるご質問：セクション見出し */
.qa_section_title {
	width: 100%;
	margin: 25px auto 12px auto;
	font-size: 13pt;
	font-weight: bold;
	color: #333333;
	border-bottom: 2px solid #cccccc;
	padding-bottom: 6px;
}
.guide_title {
	max-width: 900px;
	margin: 25px auto 12px auto;
	font-size: 13pt;
	font-weight: bold;
	color: #333333;
	padding-bottom: 6px;
}

.sp01::after{	/*モバイルのみ改行*/
	content: "\A";
	white-space: pre ;
}

.sp03{	/* スペース */
	margin-right:1em;
}

/* confirm編集ボタン */
.btn_cor{
	display: inline-block;
	padding: 0.3em 0.3em;
	text-decoration: none;
	background: #dcdcdc;/*ボタン色*/
	border-bottom: solid 4px #898989;
	border-radius: 6px;
	/*width:10em;*/
	font-size:15px;
}

/* アンケート画面 */
.wrapper {
    width:100%;
}
.wrapper .enq_area{
    /*アンケート領域*/
    width: 90%;
    margin: 1em auto 2em auto;
}
.wrapper .enq_area .login_area{
    /*ログイン領域*/
    width: 90%;
    margin: 1em auto;
}
.tbl_div {
    margin-bottom: 2em;
}
.q_div {
    display: table;
    width: 100%;
    border: 1px solid #95c116;
    border-radius: 4px;
}
.q_div .q_num {
    display: table-cell;
    width: 20%;
    vertical-align: middle;
    text-align: center;
    padding: 0.2em;
    background: #95c116;
    color: #000;
}
.q_div .q_str {
    display: table-cell;
    width: 80%;
    vertical-align: middle;
    padding: 0.2em;
}
.req_text{
    /*必須*/
    font-size: 13px;
    color: #fff;
    background: #d3381c;
    padding: 1px 1px;
}
.ans_div {
	margin-top: 0.3em;
    padding-left:5%;
}
/*ラジオボタンstart*/
.radio-label {
  padding: 6px 4px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.radio-input {
  opacity: 0;
  width: 0;
  margin: 0;
}
.radio-input:focus + .radio-dummy {
  border: solid 2px #333333;
}
.radio-input:checked + .radio-dummy {
  border: solid 2px #007bbb;
}
.radio-input:checked + .radio-dummy::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #007bbb;
}
.radio-dummy {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  border: solid 2px #888;
}
.radio-text {
  margin-left: 12px;
  display: block;
  max-width: 80%;
}
/*ラジオボタンend*/

/*チェックボックスstart*/
.chkbox-label {
  padding: 6px 4px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.chkbox-label:hover{
  background: rgba(0,0,0,.05) !important;
}
.chkbox-input {
  opacity: 0;
  width: 0;
  margin: 0;
}
.chkbox-input:focus + .chkbox-dummy{
  border: solid 2px #007bbb;
}
.chkbox-input:checked + .chkbox-dummy::before {
  content: "";
  display: block;
  position: absolute;
  top: 43%;
  left: 50%;
  width: 40%;
  height: 4px;
  border-radius: 2px;
  transform: translate(-6px, 5px) rotateZ(-135deg);
  transform-origin: 2px 2px;
  background: #007bbb;
}
.chkbox-input:checked + .chkbox-dummy::after {
  content: "";
  display: block;
  position: absolute;
  top: 45%;
  left: 55%;
  transform: translate(-6px, 5px) rotateZ(-45deg);
  width: 90%;
  height: 4px;
  border-radius: 2px;
  transform-origin: 2px 2px;
  background: #007bbb;
}
.chkbox-dummy {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  /*background: rgba(0,0,0, .1);*/
  background: #fff;
  /*border: solid 2px transparent;*/
  border: solid 2px #888;
}
.chkbox-text {
  margin-left: 12px;
  display: block;
  max-width: 85%;
}
/*チェックボックスend*/

select{
    font-size: 16px;
    width:90%;
    margin: 0.5em 0 0 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: white;
    border-radius: 4px;
    padding: 0.5em 3.5em 0.5em 1em;
    background-image:
    linear-gradient(45deg, transparent 50%, gray 50%),
    linear-gradient(135deg, gray 50%, transparent 50%),
    linear-gradient(to right, #ccc, #ccc);
    background-position:
    calc(100% - 20px) calc(1em + 2px),
    calc(100% - 15px) calc(1em + 2px),
    calc(100% - 2.5em) 0.5em;
    background-size:
    5px 5px,
    5px 5px,
    1px 1.5em;
    background-repeat: no-repeat;
}

textarea {
    margin-top: 0.5em;
	width: 90%;
	height:5em;
	padding: 0.2em;
	outline: none;
	border: 1px solid #808080;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.sp_fa {
    /*FAテキストボックスの位置*/
    padding-left: 0.8em;
}
.text_num{
    /*テキストボックス数値入力用*/
    margin-top: 0.5em;
    width: 5em;
}
.text_fa{
    /*テキストボックスの幅FA*/
	margin-top: 0.5em;
    width:60%;
}

/*SP用マトリクスstart*/
.q_div_mt {
    display: table;
    width: 100%;
    border: none;
    border-radius: 6px;
    margin-top: 1em;
    border: 1px solid #d6e9ca;
}
.q_div_mt .q_num {
    display: table-cell;
    width: 20%;
    vertical-align: middle;
    text-align: center;
    padding: 0.2em;
    background: #d6e9ca;
    color: #000;
}
.q_div_mt .q_str {
    display: table-cell;
    width: 80%;
    vertical-align: middle;
    padding: 0.2em;
}
.ans_div_mt {
    padding-left:5%;
}
.mttbl1{
    border-collapse:collapse;
    width:100%;
    margin-top: 0.5em;
}
.mttbl1 .tr1{
    background-color:#d6e9ca;
}
.mttbl1 .tr2{
    background-color: #fff;
}
.mttbl1 .td1{
    padding:3px;
    line-height:1.3em;
    border: 1px solid #808080;
    border:1px #c0c0c0 solid;
    position: relative;
}
.mttbl1 .td_h1{
    height: 2em;
}
.bg01{
    background: #ffcc99;
}
.mttbl1 .td1 .lbl1 {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
}
.mttbl1 .td1 .mtradio {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    opacity: 0;
    width: 0;
    margin: 0;
}
.mttbl1 .td1 .mtradio:focus + .mtradio-dummy {
    border: solid 2px #a9a9a9;
}
.mttbl1 .td1 .mtradio:checked + .mtradio-dummy {
    border: solid 2px #007bbb;
}
.mttbl1 .td1 .mtradio:checked + .mtradio-dummy::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #007bbb;
}
.mtradio-dummy {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    border: solid 2px #888;
}
/*SP用マトリクスend*/

.d_toggle {	/* トグルボタン */
    display: flex;
    justify-content: center;
    align-items: center;
    width: 13em;
    margin:0 auto;
    padding: 5px;
    border: 1px solid #627c1a;
    border-radius: 25px;
    background-color: #f9ffe6;
    color: #627c1a;
    font-size: 1em;
}


/*ファイルアップロード用 start*/
.up_div {
  position: relative;
  left: 1%;
}

[id^="preview_field"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 90%;
}

[id^="drop_area"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 98%;
  cursor: pointer;
  color: #696969;
  border: 1px dashed #aaa;
  text-align: center;
}
[id^="drop_area"]:before {
  content: "こちらにファイルをドラッグ＆ドロップ、またはクリックしてファイルを選択";
  font-size: 80%;
}
[id^="drop_area"].dragover {
	background-color: #e6f7ff;
	border: 2px dashed #007bbb;
	color: #007bbb;
}

#icon_clear_button {
  display: none;
  position: absolute;
  top: -4px;
  right: -8px;
  width: 24px;
  height: 24px;
  border: 1px solid #777;
  border-radius: 50%;
  cursor: pointer;
}

.input_file {
  width: 90%;
  opacity: 0;
}

.input_file:focus {
  opacity: 1;
}

#btn_fileclear {
    -webkit-appearance: none;
    display: inline-block;
    width: 100px;
    padding: 0.4em;
    text-decoration: none;
    border-radius: 2px;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
    -webkit-tap-highlight-color: transparent;
    transition: .2s ease-out;
    font-weight: bold;
    font-size:12px;
    background-color: #dcdcdc;
    color: #000000;
    border: solid 1px #dcdcdc;
}
#btn_fileclear:hover {
    cursor: pointer;
    text-decoration: none;
    transform: translateY(-4px);
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.12), 0 3px 10px 0 rgba(0,0,0,0.12), 0 4px 7px -2px rgba(0,0,0,0.2);
}
/*ファイルアップロード用 end*/
/* 共通ダイアログ */
dialog {
    width: 400px;
    max-width: 90%;
    padding: 25px;
    border: none;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.3);
    font-size: 13pt;
}
/* ===== jQuery UI ダイアログ ===== */

/* 全体 */
.ui-dialog {
    border: 2px solid #007bbb;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 6px 20px rgba(0,0,0,.3);
}

/* タイトルバー */
.ui-dialog .ui-dialog-titlebar {
    background: #007bbb;
    color: #ffffff;
    border: none;
    padding: .7em 1em;
}

/* タイトル文字 */
.ui-dialog .ui-dialog-title {
    color: #ffffff;
    font-weight: bold;
}

/* 本文 */
.ui-dialog .ui-dialog-content {
    background: #ffffff;
    color: #333333;
    padding: 20px;
}

/* ボタン */
.ui-dialog .ui-dialog-buttonpane button {
    background: #007bbb;
    color: #ffffff;
    border-radius: 4px;
    padding: .5em 1.5em;
    font-weight: bold;
    cursor: pointer;
}

/* OK */
.ui-dialog .ui-dialog-buttonpane button.btn_ok{
    background:#007bbb;
    color:#fff;
}

.ui-dialog .ui-dialog-buttonpane button.btn_ok:hover{
    background:#004887;
    color:#fff;
}

/* キャンセル */
.ui-dialog .ui-dialog-buttonpane button.btn_cancel{
    background:#fff;
    color:#007bbb;
    border:1px solid #007bbb;
}

.ui-dialog .ui-dialog-buttonpane button.btn_cancel:hover{
    background:#e6f4ff;
    color:#007bbb;
}

.ui-dialog {
    width: 90% !important;
    max-width: none;
}

.note {
    display: flex;
    align-items: flex-start;
}

.note-mark {
    flex: 0 0 30px;
}

.note-text {
    flex: 1;
}