@charset "utf-8";

body{
	width:100%;
	height:100%;
	font-family:"Arial", "メイリオ";
}

p{
	margin:5px 45px 5px;
	font-size:13px;
}

.p_text{
	margin:0 auto;
	font-size:20px;
	font-weight:bold;
	text-align:center;
}

/* .q{
	color:#00A05A;
	font-size:30px;
} */

label{
	display:block;
	margin:5px;
}

.confirm_p{
	margin:10px 60px;
	font-size:18px;
}

table{
	margin:0;
}

table td{
	padding:7px;
}

.input_number{
	padding:10px 10px;
	font-size:18px;
	border-radius:5px;
	border:1px solid #ddd;
	box-sizing:border-box;
	background-color:#FFF;
	text-align:center;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
} 

.input_text{
	padding:5px;
	font-size:18px;
	border-radius:5px;
	border:1px solid #ddd;
	box-sizing:border-box;
	background-color:#FFF;
}

.input_textare{
	padding:5px;
	font-size:18px;
	border-radius:5px;
	border:1px solid #ddd;
	box-sizing:border-box;
	background-color:#FFF;
}

select{
	padding:5px;
	font-size:18px;
	border-radius:5px;
	border:1px solid #ddd;
	box-sizing:border-box;
	background-color:#FFF;
}

.input_date{
	padding:5px 15px;
	font-size:18px;
	border-radius:5px;
	border:1px solid #ddd;
	box-sizing:border-box;
}

::placeholder{
	color:#C6C6C6;
}

.input_checkbox{
	transform:scale(1.5);
	margin:0 7px 0 3px;
}

.input_radio{
	transform:scale(1.5);
	margin:0 7px 0 3px;
}

.selectdiv{
	position:relative;
	width:260px;
	min-width:200px;
}

select::-ms-expand{
	display:none;
}

.selectdiv:after{
	content:'<>';
	font:18px "Consolas", monospace;
	color:#333;
	-webkit-transform:rotate(90deg);
	-moz-transform:rotate(90deg);
	-ms-transform:rotate(90deg);
	transform:rotate(90deg);
	right:11px;
	/*Adjust for position however you want*/
	
	top:10px;
	padding:0 0 2px;
	border-bottom:1px solid #999;
	/*left line */
	position:absolute;
	pointer-events:none;
}

.selectdiv select{
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	display:block;
	width:100%;
	height:45px;
	float:right;
	padding:0px 24px;
	font-size:1.2em;
	line-height:1.75;
	color:#333;
	background-color:#ffffff;
	background-image:none;
	border:1px solid #ddd;
	-ms-word-break:normal;
	word-break:normal;
	border-radius:5px;
}

.category{
	width:1190px;
	margin:0 auto;
}

.category_left{
	width:250px;
	float:left;
}

.category_title{
	height:20px;
	background-color:#E4E4E4;
	border-radius:8px 8px 0 0;
	padding:5px 15px 15px 15px;
	font-size:22px;
	font-weight:bold;
	border-bottom:#C6C6C6 solid 3px;
}

.category_title::before{
	margin-right:5px;
}

.category_right{
	width:930px;
	float:right;
}

.category_body{
	padding:20px 15px 20px 15px;
	background-color:#FFFFFF;
	border-radius:0 0 8px 8px;
	display:block;
}

.category_ul li a{
	text-decoration:none;
	color:#000000;
	font-size:20px;
}

/* .detail_area{
	font-size:1.2em;
	margin:10px 0 20px 40px;
} */

.detail_title{
	height:20px;
	background-color:#E4E4E4;
	border-radius:8px 8px 0 0;
	padding:5px 15px 15px 15px;
	font-size:22px;
	font-weight:bold;
	border-bottom:#C6C6C6 solid 3px;
}

.detail_title::before{
	margin-right:5px;
}

.detail_body{
	padding:20px 15px 20px 15px;
	background-color:#FFFFFF;
	border-radius:0 0 8px 8px;
	display:block;
}

.detail_area .text_center{
	text-align:center;
}

.detail_area .text_right{
	text-align:right;
}

.detail_area th{
	padding:5px;
	background-color:#f1f1f1;
	text-align:center;
	font-weight:bold;
	font-size:0.8em;
	border:1px #C6C6C6 solid;
}

.detail_area td{
	padding:5px;
	font-size:0.8em;
	border:none;
}

.detail_th01{
	background-color:#3DCFB9;
	color:#FFF;
	font-weight:bold;
	border-bottom:#28A492 solid 3px;
	border-right:#FFF solid 2px;
	text-align:center;
}

.detail_th02{
	background-color:#c3c3c3;
	color:#FFF;
	font-weight:bold;
	border-bottom:#838383 solid 3px;
	text-align:center;
}

.detail_td01{
	border-bottom:#ccc solid 1px;
}


/* .midashi_title{
	font-weight:bold;
	font-size:20px;
	margin:50px 45px 5px;
	border-bottom: solid 5px #9cedb2;
	position: relative;
	display:inline-block;
	width:91%;
} */

.midashi_title::after{
	position: absolute;
	content: " ";
	display: block;
	border-bottom: solid 5px #00a05a;
	bottom: -5px;
	width: 100px;
}

.midashi_subtitle{
	margin:0 auto;
	width:1150px;
	border-bottom:#00A05A solid 3px;
	font-size:20px;
	font-weight:bold;
	text-align:center;
}

/* .midashi_mtitle {
	position: relative;
	padding:5px 25px;
	font-weight:bold;
	font-size:15px;
	margin-left:45px;
	color:#00A05A;
} */

.midashi_ititle {
	position: relative;
	padding:25px 0 0 40px;
	font-weight:bold;
	font-size:15px;
}

.midashi_mtitle::after {
	position: absolute;
	content:'';
	top:9px;
	left:.4em;
	width:15px;
	height:15px;
	background-repeat: no-repeat;
}

.category_ul li a::before{
	margin-right:5px;
}


.expense_peger{
	margin-top:10px;
	text-align:center;
}

.expense_peger li{
	display:inline-block;
	height:40px;
	line-height:40px;
	width:40px;
	text-align:center;
	border:1px #ccc solid;
	color:#000000;
	border-radius:5px;
}

.expense_peger .pre{
	color:#333333;
}

.expense_peger .this{
	background-color:#3dcfb9;
	color:#FFFFFF;
}

.expense_peger li a{
	display:block;
	text-decoration:none;
	color:#000000;
}


/*****HEADER*****/
header{
	font-size:18px;
}

.adjust_design {
	height: 3vh;
}

/* PC用 */
@media screen and (min-width: 600px) {
	header img{
		margin:10px 0 5px 10px;
	}
	header .session_name{
		position:absolute;
		top:13px;
		right:10px;
	}

	.button{
		border:0;
		padding:20px 18px;
		font-size:20px;
		font-weight:bold;
		line-height:normal;
		background-color:#00A05A;
		border-radius:10px;
		color:#FFFFFF;
		width:450px;
		margin:30px auto;
		display:block;
	}
	
	.button:hover{
		background-color:#fd6738;
		transition-duration:1s;
	}

	.nav{
		width:100%;
		height:50px;
		background:#00A05A;
		/*border-bottom:4px solid #fe4110;*/
		overflow:hidden;
		display:block;
		text-decoration:none;
		color:#FFFFFF;
		font-size:20px;
		font-weight:bold;
		line-height:40px;
	}

	nav ul{
		width:100%;
	}
	
	nav li{
		padding:5px 15px;
		text-align:center;
		float:left;
		color:#FFFFFF;
	}
	
	nav ul li a{
		font-size:20px;
		position:relative;
		text-decoration:none;
		color:#FFFFFF;
	}
	
	nav ul li a::after{
		content:"";
		display:inline-block;
		width:3px;
		height:18px;
		background-color:#FFFFFF;
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		right:-18px;
	}
	
	nav a{
		display:block;
		text-decoration:none;
		color:#FFFFFF;
		font-size:20px;
		font-weight:bold;
		line-height:40px;
	}

	section{
		margin:20px auto;
	}
	
	section .title{
		width:1090px;
		margin:0 auto;
		height:30px;
		background-color:#E4E4E4;
		border-radius:8px 8px 0 0;
		padding:10px 15px 15px 25px;
		font-size:25px;
		font-weight:bold;
		border-bottom:#C6C6C6 solid 3px;
		text-align:left;
	}

	.detail_area{
		font-size:1.2em;
		margin:10px 55px 20px 62px;
	}

	.detail_area_adjust {
		width:94%;
		margin:25px 60px 20px 50px;
	}

	.midashi_title{
		font-weight:bold;
		font-size:18px;
		margin:25px 45px 5px;
		border-bottom: solid 5px #9cedb2;
		position: relative;
		display:inline-block;
		width:91%;
	}

	.midashi_mtitle {
		position: relative;
		padding:5px 25px;
		font-weight:bold;
		font-size:15px;
		margin-left:45px;
		color:#00A05A;
	}

	.midashi_p_blacktitle {
		width:94%;
		font-size:20px;
		font-weight:bold;
		margin:0 0 0 5px;
		border-bottom:2px dotted #000;
	}

	.q{
		color:#00A05A;
		font-size:25px;
	}

	/* 必須マークデザイン */
	.title_asterisk {
		color: #fe4110;
	}

	/* 回答を保存するボタン */
	.button1{
		border:0;
		padding:20px 18px;
		font-size:20px;
		font-weight:bold;
		line-height:normal;
		background-color:#fd6738;
		border-radius:10px;
		color:#FFFFFF;
		width:700px;
		margin:30px auto;
		display:block;
	}

	.button1:hover{
		background-color:#f59ea9;
		transition-duration:1s;
	}

	/* 入力完了画面 */
	.input_complete {
		font-size:35px;
		text-align:center;
		margin:10px auto;
		background-color:#FFF;
		width:800px;
		padding:80px;
	}
}

/* スマホ用 */
@media screen and (max-width: 600px) {
	header img{
		margin:10px 0 5px 10px;
		width: 50%;
		height: 50%;
	}

	header .session_name{
		position:absolute;
		top:30px;
		right:10px;
	}

	.button{
		border:0;
		padding:20px 18px;
		font-size:20px;
		font-weight:bold;
		line-height:normal;
		background-color:#00A05A;
		border-radius:10px;
		color:#FFFFFF;
		width:80vw;
		margin:30px auto;
		display:block;
	}
	
	.button:hover{
		background-color:#fd6738;
		transition-duration:1s;
	}

	.nav{
		width:100%;
		height:50px;
		background:#00A05A;
		/* border-bottom:4px solid #fe4110; */
		overflow:hidden;
		display:block;
		text-decoration:none;
		color:#FFFFFF;
		font-size:0.72em;
		font-weight:bold;
		line-height:40px;
	}

	nav ul{
		width:100%;
	}
	
	nav li{
		padding:5px 15px;
		text-align:center;
		float:left;
		color:#FFFFFF;
	}
	
	nav ul li a{
		font-size:20px;
		position:relative;
		text-decoration:none;
		color:#FFFFFF;
	}
	
	nav ul li a::after{
		content:"";
		display:inline-block;
		width:3px;
		height:18px;
		background-color:#FFFFFF;
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		right:-18px;
	}
	
	nav a{
		display:block;
		text-decoration:none;
		color:#FFFFFF;
		font-size:20px;
		font-weight:bold;
		line-height:40px;
	}

	section{
		margin:20px auto;
	}
	
	section .title{
		width:82%;
		margin:0 auto;
		height:2vh;
		background-color:#E4E4E4;
		border-radius:8px 8px 0 0;
		padding:10px 15px 15px 25px;
		font-size:1.1em;
		font-weight:bold;
		border-bottom:#C6C6C6 solid 3px;
		text-align:left;
	}

	.detail_area{
		font-size:0.9em;
		margin:1vh 0 20px 1vw;
	}

	.detail_area_adjust {
		width: 75vw;
		margin: 1.5vh 1vw 2vh 5vw;
	}

	.midashi_title{
		font-weight:bold;
		font-size:0.9em;
		margin: 2.5vh 0 1vh 2vw;
		border-bottom: solid 5px #9cedb2;
		position: relative;
		display:inline-block;
		width:91%;
	}

	.midashi_mtitle {
		position: relative;
		padding:5px 25px;
		font-weight:bold;
		font-size: 0.9em;
		margin-left:0vw;
		color:#00A05A;
	}

	.midashi_p_blacktitle {
		width:94%;
		font-size:1em;
		font-weight:bold;
		margin:0 0 0 5px;
		border-bottom:2px dotted #000;
	}

	.q{
		color:#00A05A;
		font-size: 1.3em;
	}

	/* 必須マークデザイン */
	.title_asterisk {
		font-size: 0.9em;
		color: #fe4110;
	}

	.input_text{
		width: 48vw;
		padding:10px 10px;
		font-size:0.8em;
		border-radius:5px;
		border:1px solid #ddd;
		box-sizing:border-box;
		background-color:#FFF;
	}

	/* 回答を保存するボタン */
	.button1{
		border:0;
		margin: 2vh 0 1vh 0;
		padding:10px 9px;
		font-size:20px;
		font-weight:bold;
		line-height:normal;
		background-color:#009aa0;
		border-radius:10px;
		color:#FFFFFF;
		width:80vw;
		margin:30px auto;
		display:block;
	}

	.button1:hover {
		background-color:#006164;
		transition-duration:1s;
	}

	.button2{
		border:0;
		margin: 2vh 0 1vh 0;
		padding:10px 9px;
		font-size:20px;
		font-weight:bold;
		line-height:normal;
		background-color:#009aa0;
		border-radius:10px;
		color:#FFFFFF;
		width:80vw;
		margin:30px auto;
		display:block;
	}

	.button2:hover {
		background-color:#006164;
		transition-duration:1s;
	}
	

	/* 入力完了画面 */
	.input_complete {
		font-size:1.2em;
		text-align:center;
		margin:15vh 0 15vh 0;
		background-color:#FFF;
		width:80vw;
		padding:10vh 10vw 10vh 10vw;
	}
}

.session_btn a{
	margin:0 0 0 10px;
	padding:2px 12px;
	color:#FFF;
	font-size:14px;
	text-decoration:none;
	background-color:#00A05A;
	border-radius:50vh;
}

.session_btn a:hover{
	text-decoration:none;
	background-color:#999;
	transition-duration:1s;
}


/*****DASHBOARD*****/
main{
	background-color:#f3f3f3;
	padding:10px 0;
	display:block;
}

main::after{
	display:block;
	clear:both;
	content:"";
}

/* section{
	margin:20px auto;
}

section .title{
	width:82%;
	margin:0 auto;
	height:30px;
	background-color:#E4E4E4;
	border-radius:8px 8px 0 0;
	padding:10px 15px 15px 25px;
	font-size:25px;
	font-weight:bold;
	border-bottom:#C6C6C6 solid 3px;
	text-align:left;
} */

section .body{
	width:1090px;
	border:solid 5px #FFF;
	padding:20px 15px 20px 15px;
	margin:0 auto;
	background-color:#FFFFFF;
	border-radius:0 0 8px 8px;
}

/* .button{
	border:0;
	padding:20px 18px;
	font-size:20px;
	font-weight:bold;
	line-height:normal;
	background-color:#00A05A;
	border-radius:10px;
	color:#FFFFFF;
	width:450px;
	margin:30px auto;
	display:block;
}

.button:hover{
	background-color:#fd6738;
	transition-duration:1s;
} */


/* .button1{
	border:0;
	padding:10px 9px;
	font-size:20px;
	font-weight:bold;
	line-height:normal;
	background-color:#009aa0;
	border-radius:10px;
	color:#FFFFFF;
	width:300px;
	margin:30px auto;
	display:block;
} */

.button:hover{
	background-color:#fd6738;
	transition-duration:1s;
}

	.button2{
		border:0;
		margin: 2vh 0 1vh 0;
		padding:10px 9px;
		font-size:20px;
		font-weight:bold;
		line-height:normal;
		background-color:#ababab;
		border-radius:10px;
		color:#FFFFFF;
		width:400px;
		margin:30px auto;
		display:block;
	}

	.button2:hover {
		background-color:#cbcbcb;
	transition-duration:1s;
	}

/* 問い合わせボタン */
.button_3{
	padding:2px;
	font-size:13px;
	font-weight:bold;
	line-height:normal;
	background-color:#FFF;
	border:2px solid #fd6738;
	border-radius:10px;
	color:#fd6738;
	width:180px;
	margin:10px auto;
	opacity:0.85;
}

.button_3:hover{
	background-color:#ffd3d8;
	transition-duration:1s;
}



.hover{
	display:block;
	background-color:#FFFFFF;
	color:#333333;
	opacity:0.30;
	filter:alpha(opacity=30);
	-ms-filter:"alpha(opacity=30)";
}

.btn_group{
	text-align:center;
	padding:10px 0 0 0;
}

.btn_group img{
	margin:7px;
}


/*****FOOTER*****/
footer{
	width:100%;
	height:23px;
	background:#00A05A;
	box-sizing:border-box;
	text-align:center;
	font-weight:bold;
	color:#FFFFFF;
}

.footer{
	box-sizing:border-box;
	text-align:center;
	font-weight:bold;
}

/*	以下　中村追加	*/
#overlay { 
  position: fixed;
  top: 0;
  z-index: 100;
  width: 100%;
  height:100%;
  display: none;
  background: rgba(0,0,0,0.6);
}
.cv-spinner {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;  
}
.spinner {
  width: 40px;
  height: 40px;
  border: 4px #ddd solid;
  border-top: 4px #2e93e6 solid;
  border-radius: 50%;
  animation: sp-anime 0.8s infinite linear;
}
@keyframes sp-anime {
  100% { 
    transform: rotate(360deg); 
  }
}
.is-hide {
  display:none;
}

dialog::backdrop {
  background: rgba(94, 94, 94, 0.5);
  backdrop-filter: blur(4px);
}

.dialog {
  border: none;
  border-radius: 0.5rem;
  box-shadow: 0 4px 16px rgba(0 0 0 / 16%);
  padding: 2rem;
}

.is-error {
  color: red;
}

/*
 * simple notification css
 */
.sn-notifications-container {
	/* colors */
	--sn-success-color: rgb(111, 207, 151);
	--sn-success-progress-color: rgb(84, 170, 120);
	--sn-error-color: rgb(235, 87, 87);
	--sn-error-progress-color: rgb(192, 69, 69);
	--sn-warning-color: rgb(242, 201, 76);
	--sn-warning-progress-color: rgb(196, 166, 79);
	--sn-info-color: rgb(81, 205, 243);
	--sn-info-progress-color: rgb(84, 169, 196);
  
	/* container */
	--sn-notifications-gap: 20px; /* controlled by js */
	--sn-notifications-padding: 20px; /* controlled by js */
  
	/* notify */
	--sn-notify-width: 320px;
	--sn-notify-radius: 6px;
	--sn-notify-transition-timing-function: ease;
	--sn-notify-transition-duration: 500ms; /* controlled by js */
	--sn-notify-autoclose-timeout: 30000ms; /* controlled by js */
	--sn-notify-padding: 0.75em;
	--sn-notify-icon-size: 2em;
	--sn-notify-close-icon-size: 1em;
	--sn-notify-border-size: 1px;
	--sn-notify-border-color: transparent;
	--sn-notify-border-style: solid;
	--sn-notify-progress-color: rgb(51, 51, 51);
	--sn-notify-close-icon-color: rgb(51, 51, 51);
	--sn-notify-title-color: rgb(51, 51, 51);
	--sn-notify-text-color: rgb(77, 77, 77);
	--sn-notify-shadow-color: transparent;
	--sn-notify-progress-height: 20px;

	/* 右上の位置ずれ対応 */
	width: unset !important;
}
