@charset "utf-8";

/** { -webkit-appearance: none; }*/
/* iPhone 対策*/
input[type="submit"],
input[type="button"] {
	border-radius: 0;
	-webkit-box-sizing: content-box;
	-webkit-appearance: button;
	appearance: button;
	border: none;
	box-sizing: border-box;
	cursor: pointer;
	color:#333;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
	display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
	outline-offset: -2px;
}
input, select, textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
/* select 対策*/
select{
	background:#FFFFFF;
}

/* フェーズ別背景色 対策*/
body {
	font-family: Arial, sans-serif;
	font-size: 16px;
	background-color: #FFFFE0; /* 黄の背景 */
}
body.admins {
	background-color: #FFE5F2; /* 赤の背景 */
}
body.phase01 {
	background-color: #FFEAFF; /* 桃の背景 */
}
body.phase02 {
	background-color: #FFEDDB; /* 橙の背景 */
}
body.phase03{
	background-color: #FFFFE0; /* 黄の背景 */
}
body.phase04 {
	background-color: #F2FFE5; /* 緑の背景 */
}
body.phase05 {
	background-color: #DBEDFF; /* 水色の背景 */
}
body.phase06 {
	background-color: #E0E0FF; /* 青の背景 */
}
body.phase07 {
	background-color: #EDDBFF; /* 紫の背景 */
}


.linkmenu {
	text-align: right;
	padding: 0 20px;
}
.soto {
	max-width: 1050px;
	margin: 5px auto;
	padding: 10px;
}
.waku {
	max-width: 1050px;
	margin: 10px auto;
	padding: 20px;
	border: 1px solid #CCC;
	background-color: #FFF; /* フォームの背景色 */
	border-radius: 8px;
	box-shadow: 4px 4px 1px rgba(0, 0, 0, 0.1); /* 影の効果 */
}


label {
	font-size: 16px;
	display: block;
	font-weight: 600;
	margin: 6px auto 6px;
	text-indent: -2.4em;
	padding-left: 2.4em;
}
label.pass_sp{
	text-indent: -6.0em;
	padding-left: 6.0em;
}
.situmon2 label {
	font-size: 18px;
	line-height:2.0em;
	text-indent: 0em;
	padding: 0 0.5em;
	text-indent: -2.9em;
	padding-left: 2.9em;
}
.situmon2 p {
	font-size: 18px;
	display: block;
	margin: 6px auto 6px;
	line-height:2.0em;
	text-indent: 0em;
	padding: 0 8px;
}
.situmon2 .memo2 {
	font-size: 14px;
	line-height:1.5em;
	text-indent: 0em;
	padding: 0 0.5em;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="date"],
select,
textarea {
	font-family: Arial, sans-serif;
	width: 100%;
	color: #333;
	font-size: 16px;
	padding: 8px 5px;
	margin: 5px 0;
	background-color: #FFF;
	border: 1px solid #CCC;
	border-radius: 4px;
	box-sizing: border-box;
}
input[readonly] {
  background-color: #E3E3E3;
}

.boxtop {
	margin-top: 15px;
}
.boxbottom {
	margin-bottom: 30px;
}
.clearbox {
	padding-top: 10px;
	padding-bottom: 30px;
}
.clearbottom {
	padding-bottom: 10px;
}

input[type="radio"], input[type="checkbox"] {
	appearance: revert;
	display: inline-block;
	width:	18px;
	height: 18px;
	border-radius: 50%;
	border: 1.5px solid gray;
	background-color: #FFF;
	color: #333;
	font-size: 16px;
	line-height:1em;
	padding: 0 10px;
	margin: 0px 10px 0px 10px;
	cursor: pointer;
}
textarea {
	resize: vertical;
	width:100%;
	height:200px;
}
button[type="button"] {
	padding: 5px 5px;
	border: 2px solid #CCC;
	border-radius: 4px;
	cursor: pointer;
	box-shadow: 4px 4px 1px rgba(0, 0, 0, 0.1); /* 影の効果 */
}
input[type="submit"] {
	background-color: #942343; /* ボタンの背景色 f39800 */
	color: #FFF; /* ボタンの文字色 */
	padding: 14px 12px;
	border: 2px solid #942343;
	border-radius: 4px;
	cursor: pointer;
	box-shadow: 4px 4px 1px rgba(0, 0, 0, 0.1); /* 影の効果 */
}
input[type="submit"]:hover {
	background-color: #6C2735; /* ホバー時の背景色 dccb18*/
}
input[type="submit"].saveup_submit {
	background-color: #FDEFF2; /* ボタンの背景色 f39800 */
	color: #942343; /* ボタンの文字色 */
	font-weight: bold;
	border: 2px solid #942343;
}
input[type="submit"].last_submit {
	background-color: #FFF; /* ボタンの背景色 f39800 */
	color: #942343; /* ボタンの文字色 */
	font-weight: bold;
	border: 2px solid #942343;
}
input[type="submit"].last_submit:hover, input[type="submit"].saveup_submit:hover {
	background-color: #CCC; /* ボタンの背景色 c2894b */
	color: #942343; /* ボタンの文字色 */
	font-weight: bold;
	border: 2px solid #942343;
}
input[type="submit"].dlbtn {
	background-color: #EEE; /* ボタンの背景色 f39800 */
	color: #333; /* ボタンの文字色 */
}
input.valid,
select.valid,
textarea.valid{
	border: 1px solid red;
	background-color: #FFE6E6;
}
/* スピン非表示 */
input[type="number"] {
	appearance: textfield;
	text-align: right;
}
input[type="number"].no-spin::-webkit-outer-spin-button,
input[type="number"].no-spin::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
input[type="number"].no-spin {
	-moz-appearance: textfield;
}

.youtube {
	width: 100%;
	position:relative;
	aspect-ratio: 16 / 9;
	display:block;
}
.youtube iframe {
	width: 100%;
	height: 100%;
	pointer-events:none;
}
hr {
	border: 1px solid #CCC;
}
p {
	margin: 5px 0 0 0;
	padding: 5px;
}
.proviso {
	font-size: 18px;
	font-weight: bold;
	margin: 12px 0 10px 10px;
	padding: 2px;
}
.proviso .imp, label .imp2 {
	font-size: 16px;
	color: red;
	font-weight: bold;
	background-color: #FFE6E6;
	text-decoration: underline;
	margin:0 5px;
}
.proviso .imp2, label .imp2 {
	font-size: 16px;
	color: #00533F;
	font-weight: bold;
	background-color: #E0EBAF;
	text-decoration: underline;
	margin:0 5px;
}
.proviso .imp3, label .imp3 {
	font-size: 16px;
	color: #6A1917;
	font-weight: bold;
	background-color: #FFF1CF;
	text-decoration: underline;
	margin:0 5px;
}
.mgn_10 {
	margin: 0 0 10px 0;
}
.mgn_27 {
	margin: 0 0 0 2.7em;
}
.mgn_20 {
	margin: 20px 0;
}
.pdg_20 {
	padding: 20px 0;
}
.req {
	color: red;
	font-size: 12px;
	font-weight: bold;
	background-color: #FFE6E6;
	margin: 0 0 0 10px;
	padding: 2px;
}
.req2 {
	color: #00533F;
	font-size: 12px;
	font-weight: bold;
	background-color: #E0EBAF;
	margin: 0 0 0 10px;
	padding: 2px;
}
.req3 {
	color: #6A1917;
	font-size: 12px;
	font-weight: bold;
	background-color: #FFF1CF;
	margin: 0 0 0 10px;
	padding: 2px;
}
.error {
	max-width: 600px;
	font-size: 14px;
	font-weight: bold;
	margin: 10px auto;
	padding: 20px;
	background-color: #FFE6E6; /* フォームの背景色 */
	border-radius: 8px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* 影の効果 */
	border: 1px solid red;
}
.font_s {
	font-size:14px !important;
}
.font_m {
	font-size:16px !important;
}
.font_l {
	font-size:18px !important;
}

.indent_s {
	font-size: 14px;
	display: block;
	margin: 10px;
	text-indent: -1.4em;
	padding-left: 1.4em;
}
.indent_m {
	display: block;
	text-indent: -1.4em;
	padding-left: 1.4em;
}
.indent_m2 {
	display: block;
	text-indent: -2.9em;
	padding-left: 2.9em;
}
.indent_l {
	display: block;
	padding-left: 1.4em;
}


.textright {
	text-align: right;
}
.text_emphasis {
	font-size:18px;
	font-weight: bold;
	text-decoration:underline;
	margin:0 5px;
}

.titlewaku {
	margin: 5px 0 10px;
	padding: 5px 0 0 0;
	border-left: 2px solid #999;/* 942343 */
	border-bottom: 2px solid #999;
	background-color: #FFF;
}

.situmon {
	margin: 5px 0 10px;
	padding: 5px 5px 5px 10px;
	border-radius: 8px;
	border-top: 0.5px dotted #999;
	border-left: 1px dotted #999;
	border-right: 1.5px dotted #666;
	border-bottom: 1px dotted #666;
	background-color: #FCE1DE;
	font-size: 16px;
}

.situmon2 {
	padding: 0 5px 0 10px;
	border-radius: 8px;
	border-top: 0.5px solid #CCC;
	border-left: 1px solid #CCC;
	border-right: 1.5px solid #999;
	border-bottom: 1px solid #999;
	background-color: #F2D58A; /* フォームの背景色 ebf6f7 */
}

.kaitou {
	font-size: 16px;
	font-weight: bold;
	color: #001E43;
	display: block;
	margin:10px 0 0;
	padding: 8px 10px;
	border-radius: 8px;
	border-top: 0.5px solid #CCC;
	border-left: 1px solid #CCC;
	border-right: 1.5px solid #999;
	border-bottom: 1px solid #999;
	word-wrap: break-word;
}

.ckvalid {
	margin:10px 0 0;
	font-size:16px;
	color: red;
	font-weight: bold;
}
.bold {
	font-weight: bold;
}
.txt_center {
	text-align: center !important;
}
.txt_right {
	text-align: right;
}
.txt_left_f {
	text-align: left;
	float: left;
	padding-right:10px;
}
.floatl { float: left; padding: 0;}
.floatl { float: left; padding: 0;}
.fclear { clear:both; }

.displaynone { display: none; }

.wid90 {width: 90%; margin: 0;}
.wid80 {width: 80%; margin: 0;}
.wid70 {width: 70%; margin: 0;}
.wid60 {width: 60%; margin: 0;}
.wid50 {width: 50%; margin: 0;}
.wid40 {width: 40%; margin: 0;}
.wid30 {width: 30%; margin: 0;}
.wid20 {width: 20%; margin: 0;}
.wid10 {width: 10%; margin: 0;}
.wid15 {width: 15%; margin: 0;}

.wid12p {max-width: 1250px; margin: 0;}
.wid11p {max-width: 1150px; margin: 0;}
.wid10p {max-width: 1050px; margin: 0;}
.wid09p {max-width: 950px; margin: 0;}
.wid08p {max-width: 850px; margin: 0;}
.wid07p {max-width: 750px; margin: 0;}
.wid06p {max-width: 650px; margin: 0;}
.wid05p {max-width: 550px; margin: 0;}

.widlog {max-width: 450px; margin: auto;}


.bold { font-weight:bold; }
.white { color:#FFF; font-weight:bold; }
.black { color:#333; font-weight:bold; }
.red { color:red; font-weight:bold; }
.orange { color:#FF4500; font-weight:bold; }
.green { color:green; font-weight:bold; }
.crim { color:#DC143C; font-weight:bold; }
.blue { color:blue; font-weight:bold; }
.gold { color:gold; font-weight:bold; }
.navy { color:navy; font-weight:bold; }
.gray { color:gray; font-weight:bold; }
.maroon { color:maroon; font-weight:bold; }
.violet { color:blueviolet; font-weight:bold; }

.bgyellow {background-color: yellow; font-weight:bold; }
.linehe15 {line-height:1.5em; }
.linehe12 {line-height:1.2em; }

.err_area { 
	border: 1.5px solid red !important;
	background-color: #FFE6E6 !important;
}
hr {
	margin-top: 20px;
}
/* ファンシーボタン */
.fancyBtn {
	background: #DFF7E0;	/* 薄い緑 */
	color: #333;			/* 文字は黒 */
	border: 2px solid #A8D8B9 !important;
}
.fancyBtn2 {
	background: #CFF4F9;	/* 薄い青 */
	color: #333;			/* 文字は黒 */
	border: 2px solid #93E7FF !important;
}
.fancyBtn3 {
	background: #FFE7D1;	/* 薄いオレンジ */
	color: #333;			/* 文字は黒 */
	border: 2px solid #FFB26B !important;
}
.fancyBtn4 {
	background: #FFF; /* 白 */
	color: #942343; /* 文字はえんじ */
	border: 2px solid #942343 !important;
}
.fancyBtn5 {
	background: #942343; /* えんじ */
	color: #FFF; /* 文字は白 */
	border: 2px solid #FFE7D1 !important;
}
.fancyBtn6 {
	background: #FFF; /* 白 */
	color: #228B22; /* 文字は緑 */
	border: 2px solid #228B22 !important;
}
.fancyBtn7 {
	background: #FFF; /* 白 */
	color: #0033FF; /* 文字は青 */
	border: 2px solid #0033FF !important;
}
.fancyBtn8 {
	background: #FFDB4F; /* 黄色 */
	color: #333333; /* 文字は黒 */
	border: 2px solid #333333 !important;
}

.fancyBtn8, .fancyBtn7, .fancyBtn6,
.fancyBtn5, .fancyBtn4, .fancyBtn3,
.fancyBtn2, .fancyBtn {
	padding: 8px 8px !important;
	font-size: 14px;
	font-weight: 600;
	border-radius: 4px;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	transition: background .25s ease, box-shadow .25s ease, transform .1s ease;
	box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.fancyBtn8:hover, .fancyBtn7:hover, .fancyBtn6:hover,
.fancyBtn5:hover, .fancyBtn4:hover, .fancyBtn3:hover,
.fancyBtn2:hover, .fancyBtn:hover {
/*	background: #c9efd1;*/
	box-shadow: 0 6px 16px rgba(0,0,0,0.12);
	transform: translateY(-1px);
}
.fancyBtn8:active, .fancyBtn7:active, .fancyBtn6:active,
.fancyBtn5:active, .fancyBtn4:active, .fancyBtn3:active,
.fancyBtn2:active, .fancyBtn:active {
/*	background: #bde9c8;*/
	box-shadow: 0 3px 8px rgba(0,0,0,0.15);
	transform: translateY(0);
}
.fancyBtn8:focus, .fancyBtn7:focus, .fancyBtn6:focus,
.fancyBtn5:focus, .fancyBtn4:focus, .fancyBtn3:focus,
.fancyBtn2:focus, .fancyBtn:focus {
	outline: none;
	box-shadow: 0 0 0 3px rgba(100, 186, 141, 0.6);
}


/* テーブル */
table {
	width: 100%;
	border-collapse:separate;
	border-spacing:0;
	table-layout: fixed;
}
thead {
	border-bottom: 4px double #999;		/* 下枠線＞二重 */
}
thead th{
	position:sticky; background:#fff; background-clip:padding-box;
}
tfoot {
	background-color: #FFF !important;		/* 合計欄 */
	border-top: 3px solid #999 !important;	/* 上枠線＞太 */
}
/* 長尺テーブル内のスクロール */
.tbl-wrap{          
	max-height: 84vh;/* 62vh */
	overflow: auto;
}
.js-accordion-table thead th,
.js-accordion-table thead td{
	position: sticky;
	top: 0;
	background: #fff;
	z-index: 2;
	box-shadow: 0 1px 0 rgba(0,0,0,.06);
}
.js-accordion-table tfoot th,
.js-accordion-table tfoot td{
	position: sticky;
	bottom: 0;
	background: #fff;
	z-index: 1;
	box-shadow: 0 -1px 0 rgba(0,0,0,.06);
}
/* スクロール対応 セル枠線 */
.js-accordion-table thead th::after, thead td::after {
	content:"";
	position:absolute; left:0; right:0; bottom:-1px; height:0;
	border-bottom:1px solid #CCC;
	pointer-events:none;
}
.js-accordion-table tfoot td::after {
	content:"";
	position:absolute; left:0; right:0; bottom:0px; height:0;
	border-bottom:1px solid #CCC;
	pointer-events:none;
}
.js-accordion-table thead tr:first-child th::before, tfoot tr:last-child td::before{
	content:"";
	position:absolute; left:0; right:0; top:-1px; height:0;
	border-top:1px solid #CCC;
	pointer-events:none;
}
.js-accordion-table thead tr:last-child th::before, thead tr:last-child td::before {
	content:"";
	position:absolute; left:0; right:0; bottom:-4px; height:0;
	border-bottom: 4px double #999;
	pointer-events:none;
}
/* デフォルトレイアウト */
.default-layout {
	table-layout: fixed;
	border-collapse: collapse;
}
.default-layout th {
	text-align: center;		/* 左右＞中 */
	vertical-align: middle;	/* 上下＞中 */
	padding: 4px 3px;
	border: 1px solid #CCC;	/* 枠囲み＞有 */
}
.default-layout td {
	text-align: center;		/* 必要に応じて */
	vertical-align: middle;	/* 全行上下中央 */
	padding: 2px 3px;
	border: 1px solid #CCC;	/* 枠囲み＞有 */
}

.default-layout tbody tr:nth-child(odd) {
	background-color: #F2F2F2;
}
.default-layout tbody tr:nth-child(even) {
	background-color: #FFF;
}
.default-layout td.txtr,
.default-layout th.txtr {
	text-align: right;		/* 左右＞右 */
}
.default-layout td.txtl,
.default-layout th.txtl {
	text-align: left;		/* 左右＞左 */
}
.default-layout td.valt,
.default-layout th.valt {
	vertical-align: top;	/* 上下＞上 */
}
.default-layout td.valb,
.default-layout th.valb {
	vertical-align: bottom;	/* 上下＞下 */
}
.default-layout td.bors,
.default-layout th.bors {
	border: 1px solid #CCC;	/* 枠囲み＞有 */
}
.default-layout td.born,
.default-layout th.born {
	border: none;			/* 枠囲み＞無 */
}
.default-layout td.born_t,
.default-layout th.born_t {
	border-top: none;			/* 上枠線＞無 */
}
.default-layout td.born_b,
.default-layout th.born_b {
	border-bottom: none;		/* 下枠線＞無 */
}
.default-layout td.born_l,
.default-layout th.born_l {
	border-left: none;			/* 左枠線＞無 */
}
.default-layout td.born_r,
.default-layout th.born_r {
	border-right: none;			/* 右枠線＞無 */
}


.default-layout th input,
.default-layout td input {
	font-size: 14px;
}


/* カスタムレイアウト */
.custom-layout {
	table-layout: fixed;
	border-collapse: collapse;
}
.custom-layout thead th {
	text-align: center;
	vertical-align: middle;
	padding: 10px 5px;
	border: none;
}
.custom-layout tbody td {
	background-color: #FFFFFF;
	text-align: center;
	padding: 10px 5px;
	border: none;
	height: 40px;
}

.custom-layout tbody td img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
}

.custom-layout tbody td.maplv1{
	background-color: #F5F5F5; /* 灰の背景 */
	border: 1px solid #999;
}
.custom-layout tbody td.maplv2{
	background-color: #99CCFF; /* 水色の背景 */
	border: 1px solid #999;
}
.custom-layout tbody td.maplv3{
	background-color: #BFFF7F; /* 緑の背景 */
	border: 1px solid #999;
}
.custom-layout tbody td.maplv4{
	background-color: #FF7FFF; /* 桃の背景 */
	border: 1px solid #999;
}





/* クロス型アンケート用テーブルレイアウト */
.cross-layout {
	table-layout: fixed;
	border-collapse: collapse;
}
.cross-layout th,
.cross-layout td {
	border: 1px solid #000;
	text-align: center;
	padding: 8px;
	vertical-align: middle;
}
.cross-layout th.crossmenu {
	vertical-align: top;
	padding: 5px 0;
	height:90px;
	line-height:1em;
}
.cross-rating-label {
	writing-mode: vertical-rl;
	white-space: normal;
	text-align: start;
	display: inline-block;
}
.cross-rating-col {
	width: 10%;
}
.cross-layout td:first-child {
	text-align: left;
	padding: 0 5px;
}
.cross-layout tr td input[type="radio"], .cross-layout tr td input[type="checkbox"] {
	margin: 10px auto;
	cursor: pointer;
}

/* パスワード 対策*/
.password-wrapper {
	position: relative;
	display: inline-block;
	width: 100%;
}
.password-wrapper .field-icon {
	font-size: 1.3em;
	position: absolute;
	right: 10px;
	top: 40%;
	transform: translateY(-50%);
	cursor: pointer;
	color: #666;
}
/* 入力補助 対策*/
.js-ac-list {
	border: 1px solid #CCC; max-height: 160px; overflow-y: auto;
	display: none; position: absolute; background: #FFF;
	margin: 0; padding: 0; list-style: none;
	width: 350px; z-index: 100;
}
.js-ac-list li {
	text-align: left;
	padding: 8px 8px;
	cursor: pointer;
}
.js-ac-list li:hover,
.js-ac-list .selected {
	background: #2563EB;
	color: #fff;
}
.js-ac-list li.active{
	background: #2563EB;
	color: #fff;
}
.js-ac-list .sub {
	display: none !important;
}

.wrapper { position: relative; }


/*** スマホ・ガラケー対策 ***/
@media screen and (max-width:420px){
/* SP用CSS 開始 */
	.only_pc { display:none !important; }
	.only_sp { }
	.cross-layout {font-size:0.85em;}
	.cross-layout th.crossmenu { height:80px; }
	.cross-layout tr td input[type="radio"], .cross-layout tr td input[type="checkbox"] {
		width:	16px;
		height: 16px;
	}
}
@media screen and (min-width:421px) {
/* PC用CSS 開始 */
	.only_pc { }
	.only_sp { display:none !important; }
	.cross-layout tr td input[type="radio"], .cross-layout tr td input[type="checkbox"] {
		width:	20px;
		height: 20px;
	}
}

/*** 画面印刷 ***/

@page {
	size: A4 portrait; 
	margin: 10mm 10mm;
}
@media print {
	.soto, .situmon2 label {
		font-size: 11px !important;
		padding: 0px;
	}
	.kaitou {
		font-size: 10px !important;
		font-weight:normal;
	}
	.buttonBlock {
		display: none;
	}
}
.printBtn {
	background-color: #DDD; /* ボタンの背景色 f39800 */
	color: #942343; /* ボタンの文字色 */
	font-weight: bold;
	border: 2px solid #942343;
	padding: 8px 14px;
	border-radius: 4px;
	cursor: pointer;
	box-shadow: 4px 4px 1px rgba(0, 0, 0, 0.1); /* 影の効果 */
}
