/*
@import url(//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css);
@import url(https://fonts.googleapis.com/css?family=Titillium+Web:300);
*/

/*### BASIC aab*/ 
* {
	margin:0;
	padding:0;
	box-sizing: border-box;

}

body {
	margin: 0px;
	padding: 0px;
	color: #082028;
	font-size: 10pt;
	line-height: 1.4;
	font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック", "MS P Gothic","Osaka",Verdana,Arial, Helvetica, sans-serif;
	text-align: center; /* 古いIE対策 */
	box-sizing: border-box;
	animation: fadeIn 1s ease 0s 1 normal;
	-webkit-animation: fadeIn 1s ease 0s 1 normal;

background: #fff;

/*
background: rgb(241,241,241);
background: #eef2f6;

background: linear-gradient(160deg, rgba(241,241,241,0.8) 0%, rgba(221,223,224,1) 80%) ;
*/
/*
	background-color: #e9e6e5;
*/

}

/*
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
*/

.header {
	font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック", "MS P Gothic","Osaka",Verdana,Arial, Helvetica, sans-serif;
	clear:both;
	background-color:#fff;
	font-size:12pt;
	font-weight:bold;

}

/*
footer { background-color:#f0f0f0; border-top:1px solid #ddd; box-shadow:inset 5px 0px 30px #eee; clear:both;  padding:100px 10px 30px 10px; color:#999; }
*/
footer {  clear:both;  padding:30px ; color:#aaa; }

.container_ {
	margin:30px auto;
	text-align:center;	
	display:block;
	clear:both;
}

.body_admin {
	min-height:500px;
	background-color:rgba(255,20,40,0.05);
	border-left:5px solid red;
	
}
.body_manage {
	min-height:500px;
	/*background-color:#ddeeff;*/

}

/* main + side */

.side_menu_main {
	position:absolute; left:220px;top:60px;padding:8px;
}

.side_menu {

	position:fixed;
	top:60px;
	bottom:0;left:0;height:100%;
	width:220px;
	-webkit-transition:width .05s linear;
	transition:all .3s linear;
	-webkit-transform:translateZ(0) scale(1,1);
	z-index:1;
	text-align:left;
	overflow-y:scroll;
	padding:8px 4px 8px 8px;
	/*box-shadow:0px 0px 10px #ccc;*/
}
.side_menu::-webkit-scrollbar  { width:  8px;; background-color:#e9e6e5;   }
.side_menu::-webkit-scrollbar-track { border-radius: 15px; background-color:#e9e6e5;  }
.side_menu::-webkit-scrollbar-thumb { background-color:#e9e6e5; }
.side_menu:hover { box-shadow:0px 10px 10px #ccc;}
.side_menu:hover::-webkit-scrollbar { width: 8px; background-color: rgba(50, 50, 50, .1);   }
.side_menu:hover::-webkit-scrollbar-thumb { background-color: rgba(50, 50, 50, .1); border-radius: 15px;box-shadow:0 0 0 1px rgba(50, 50, 50, .3); }

/*
.scroll2::-webkit-scrollbar  { width:  8px;; background-color:#e9e6e5;   }
.scroll2::-webkit-scrollbar-track { border-radius: 15px; background-color:#e9e6e5;  }
.scroll2::-webkit-scrollbar-thumb { background-color:#e9e6e5; }
.scroll2:hover { box-shadow:0px 10px 10px #ccc;}
.scroll2:hover::-webkit-scrollbar { width: 8px; background-color: rgba(50, 50, 50, .1);   }
.scroll2:hover::-webkit-scrollbar-thumb { background-color: rgba(50, 50, 50, .1); border-radius: 15px;box-shadow:0 0 0 1px rgba(50, 50, 50, .3); }
*/


.scroll::-webkit-scrollbar { width: 8px; background-color: rgba(120, 50, 250, .0); }
.scroll::-webkit-scrollbar-track { border-radius: 4px; }
.scroll::-webkit-scrollbar-thumb { background-color: rgba(0, 150, 250, .3); border-radius: 4px; box-shadow:0 0 0 1px rgba(15, 125, 255, .3); }



.scroll2::-webkit-scrollbar  { width:12px; height:12px; background-color:rgba(255,255,255,0.3);   }
.scroll2::-webkit-scrollbar-track { background-color:transparent}
.scroll2::-webkit-scrollbar-thumb { background-color:rgba(155,155,155,0.2);  border-radius:4px;  }
.scroll2:hover::-webkit-scrollbar {  }
.scroll2:hover::-webkit-scrollbar-thumb { background-color: rgba(25, 45, 195, .2); }


.scroll3::-webkit-scrollbar  { width:0px; height:0px; background-color:transparent }
.scroll3::-webkit-scrollbar-track { background-color:transparent}
.scroll3::-webkit-scrollbar-thumb { background-color:rgba(155,155,155,0.1);  border-radius:4px;  }
.scroll3:hover::-webkit-scrollbar {  width:8px; height:8px; }
.scroll3:hover::-webkit-scrollbar-thumb { background-color: rgba(55, 105, 125, .2); }



.ul_side_menu  {
	
}
.ul_side_menu li {
	padding:0.4em;
	border-bottom:1px solid #e5e5e5;
}
.ul_side_menu li:last-child {
	border-bottom:1px solid transparent;
}
.ul_side_menu li:hover {
	background-color:rgba(0,0,0,0.05);
}



.nav_open{
	position: relative;
	cursor:pointer; ;
}

.nav_open:hover {  }

.nav_open::before{
	content: "";
	position: absolute;
	right: 5px;
	color:#555;
  background-image: url("/icon/svg/dash.svg");



  background-repeat: no-repeat;
  display: inline-block;
  height: 16px;
  width: 16px;
  vertical-align: middle;
	color:#ccc;
	font-size:small;

}
.nav_open.active::before{
	content: "";
  background-image: url("/icon/svg/chevron-down.svg");
  background-repeat: no-repeat;
  display: inline-block;
  height: 16px;
  width: 16px;
  vertical-align: middle;
	color:#ccc;
	font-size:small;
}


/*
._side_menu_w { width:90vw; box-shadow:0px 0px 10px #ccc; border-right:1px solid #ccc;}
._side_menu_s { width:210px ; height:100px;}
*/


@media screen and (min-width:1201px) { .pc_hidden { display:none; }  }
@media screen and (max-width:1200px) { .sp_hidden { display:none;visibility:hidden; width:0px;}  }
	
	
@media screen and ( min-width: 771px )
{
	.big_sp { font-size:12pt; }
	.big2_sp { font-size:14pt; }
	.big3_sp { font-size:16pt; }
	.big4_sp { font-size:18pt; }
	.big5_sp { font-size:24pt; }
	.sp_d_ib { display:block ; }
	.pc_d_ib { display:inline-block ; }

	.flex_row { display:flex;justify-content:center;flex-direction: row; }
	.flex_row_1 { flex-grow:1;flex:0.1; }
	.flex_row_5 { flex-grow:1;flex:0.5; }
	.flex_row_10 { flex-grow:1;flex:1; }
	.flex_row_12 { flex-grow:1;flex:1.2; }
	.flex_row_15 { flex-grow:1;flex:1.5; }
	.flex_row_20 { flex-grow:1;flex:2.0; }
	.flex_row_25 { flex-grow:1;flex:2.5; }
	.flex_row_30 { flex-grow:1;flex:3.0; }
	.flex_row_40 { flex-grow:1;flex:4.0; }
	.flex_row_50 { flex-grow:1;flex:5.0; }

}
/*#### SP */
@media screen and (max-width:770px)
{
	.big_sp { font-size:9pt; }
	.big2_sp { font-size:10pt; }
	.big3_sp { font-size:12pt; }
	.big4_sp { font-size:14pt; }
	.big5_sp { font-size:18pt; }
	.sp_d_ib { display:inline-block ; }
	.pc_d_ib { display:block ; }

	.flex_row {
		display:block;
	}
	.flex_row_10 { }
	.flex_row_12 { }
	.flex_row_15 { }
	.flex_row_20 { }
	.flex_row_25 { }
	.flex_row_30 { }
	.flex_row_40 { }
	.flex_row_50 { }
}



/*### PC */
@media screen and ( min-width: 641px )
{
	
	.container {
		margin:auto;
		text-align:center;	
		display:block;
		clear:both;
		padding-bottom:3em;
	}

	.container2 {
		display:inline-block;
		clear:both;
		width:90vw;
		max-width:1200px;
		text-align:left;
		padding:5px 5px 5px 5px;
		/*min-height:600px;*/
	}
	
	.container_map{
		display:inline-block;
		clear:both;
		width:100vw;
		max-width:1600px;
		padding:5px 5px;
		
		/*min-height:600px;*/
	}
	
	
/*#### block */
		
	.left_side {
		width:370px;
		float:left;
		text-align:left;
		clear:left;
	}
	.right_side {
		width:660px;
		float:right;
		text-align:center;
		margin-left:5px;
		z-index:1;
		clear:right;
	}
	.left_side2 {

		width:280px;
		padding-bottom:1em;
		float:left;
		text-align:left;
		clear:left;
	}
	.right_side2 {
		width:750px;
		float:right;
		text-align:center;
		margin-left:5px;
		z-index:1;
		clear:right;
	}

	.container3 {
		display:table;
		clear:both;
		text-align:center;
		vertical-align:top;
		width:90vw;
		overflow:hidden;
		margin: 0 auto;
	}
	
	
	.left_side3 {
		display:table-cell;
		overflow:hidden;
		width:20vw;
		padding:0 1em;
		text-align:left;
	}
	.right_side3 {
		display:table-cell;
		overflow:hidden;
		width:60vw;
		text-align:left;
	}	
/*#### harf */

	.harf1 { width:40%; float:left;  }
	.harf3 { width:60%; float:left;  }
	.harf2 { width:50%; float:left;  }
	.harf4_2 { width:49%; }
	.harf3_1 { width:32%; }
	.harf4_1 { width:23%; float:left;  }
	.harf4_3 { width:75%; float:left;  }

	.test { font-size:24pt; color:blue; }
	.test::before { content: "PC"; }
	.pcfl_spfr { float:left ; }
		
	.pos_ar {position:absolute;}
	
	.img_navi { width:72px;height:72px; }
}

/*### スマホ */
@media screen and (max-width:770px)
{
	h1 { font-size:18pt;letter-spacing:0.2em;color:#aaa;margin:0.5em; }

	.container {
		margin:auto;
		text-align:center;	
		display:block;
		clear:both;
		margin-top:70px;
		padding-bottom:3em;

	}
	
	.container2 {
		display:block;
		clear:both;
		margin:auto 8px;
		padding:5px 0px 5px 0px;
		text-align:left;
		background-color: rgba(255,255,255,0.3);

	}
	
	.container_map{
		display:block;
		clear:both;
		max-width:100vw;
		padding:5px 0px;
		/*min-height:600px;*/
	}
	

	.character {
		margin-left:-50px;
		width:180px;
		height:180px;
		object-fit: cover;


	}

/*#### block */
	.center_side {
		clear:both;
		width:100%;
		text-align:left;
		overflow:hidden;
	}
	.left_side {
		clear:both;
		width:100%;
		text-align:left;
		overflow:hidden;
	}
	.right_side {
		clear:both;
		width:100%;
		min-height:50px;
		text-align:left;
		overflow:hidden;
	}
	.left_side2 {
		clear:both;
		width:100%;
		text-align:left;
		overflow:hidden;
	}
	.right_side2 {
		clear:both;
		width:100%;
		text-align:left;
		overflow:hidden;
	}

	.left_side3 {
		clear:both;
		width:100%;
		text-align:left;
		overflow:hidden;
	}
	.right_side3 {
		clear:both;
		width:100%;
		text-align:left;
		overflow:hidden;
	}	
		


/*#### harf */




	.harf1 { width:40%; float:left;  }
	.harf3 { width:60%; float:left;  }
	.harf2 { width:100%;  }
	.harf4_2 { width:100%; }
	.harf3_1 { width:32%; }
	.harf4_1 { width:100%;  }
	.harf4_3 { width:100%;  }
	
	
	.pcfl_spfr { float:right ; }

	.pos_ar {position:relative;}
	.img_navi { width:48px;height:48px; }

}








/*### BASIC */
/* maroon */
a { color: #111; text-decoration:none; }
a:hover{ color:#476282; text-shadow:0px 0px 8px rgba(100,100,100,0.1); text-decoration:underline; }
a:active{ color:#476282 ; text-decoration:underline; }
img { margin:1px; padding:0; background:transparent; border-style: none; }
ul { list-style-type:none;}
li { list-style-type:none;}


:placeholder-shown { font-style:italic; color: rgba(0,0,0,0.3) ;font-weight:normal;; }
::-webkit-input-placeholder { font-style:italic; color: rgba(0,0,0,0.3) ;font-weight:normal; }
:-moz-placeholder { font-style:italic; color: rgba(0,0,0,0.3) ;font-weight:normal; }
::-moz-placeholder { font-style:italic; color: rgba(0,0,0,0.3) ;font-weight:normal; }
:-ms-input-placeholder { font-style:italic; color: rgba(0,0,0,0.3) ;font-weight:normal;  }



.hover:hover { cursor:pointer; }
.hover2 { cursor:pointer; opacity:0.5;  transition: all 500ms 0s ease;}
.hover2:hover { opacity:1.0; }
.hover3 { cursor:pointer; opacity:0.25;  transition: all 500ms 0s ease;}
.hover3:hover { opacity:1.0; }
.hover4 { cursor:pointer; opacity:1;  transition: all 500ms 0s ease;}
.hover4:hover { filter:invert(3%) drop-shadow(0px 0px 10px #fff);}

.hover5 { cursor:pointer; opacity:1.0; transition: all 500ms 0s ease;}
.hover5:hover { opacity:0.5;  }


.h_toggle:before {
	content: "▼" ;
	cursor:pointer 
}
.h_toggle {
	cursor:pointer ;
	text-shadow:0px 0px 5px #ccc;
}

.pointer { cursor:pointer }


.ime_off { ime-mode: inactive; }
.ime_on { ime-mode: active; }

.fletter::first-letter{ font-size:xx-large; margin:-0.2em 0.1em 0 0; padding:0; float:left;}
.fletter{ margin: 0 }


.w100 { width:100%; }
.w100p { width:100%; }
.w98p { width:98%; }
.w95p { width:95%; }
.w90p { width:90%; }
.w85p { width:850%; }
.w80p { width:80%; }
.w2em { width:2em }
.w3em { width:3em }
.w5em { width:5em }
.w8em { width:8em }
.w10em { width:10em }
.w15em { width:15em }
.w20em { width:20em }
.w30em { width:30em }
.w40em { width:40em }
.w50em { width:50em }

.w10em_sp { width:10em }
.w15em_sp { width:15em }
.w20em_sp { width:20em }
.w30em_sp { width:30em }
.w40em_sp { width:40em }
.w50em_sp { width:50em }

@media screen and (max-width:767px){
	.w10em_sp { width:100%; }
	.w15em_sp { width:100%; }
	.w20em_sp { width:100%; }
	.w30em_sp { width:100%; }
	.w40em_sp { width:100%; }
	.w50em_sp { width:100%; }
}



.mw90p { max-width:90%; }
.mw80p { max-width:80%; }
.mw20em { max-width:20em }
.mw30em { max-width:30em }
.mw50em { max-width:50em }
.mw60em { max-width:60em }


.h5em { height:5em }
.h8em { height:8em }
.h10em { height:10em }
.h15em { height:15em }
.h20em { height:20em }



.img {	object-fit: cover;}
.img_badge { border-radius:50%;border:3px solid white;box-shadow:0px 0px 5px #bbb; background-color:#fff; transform: skew(0deg); }


/*### HR */
.hr_none { height:0px;  color: white; background-color:transparent; border:none; clear:both;visibility:hidden;}
.hr_none1 { height:5px;  color: white; background-color:transparent; border:none; clear:both;visibility:hidden;}
.hr_none2 { height:10px;  color: white; background-color:transparent; border:none; clear:both;visibility:hidden;}
.hr_none3 { height:15px;  color: white; background-color:transparent; border:none; clear:both;visibility:hidden;}
.hr_none4 { height:20px;  color: white; background-color:transparent; border:none; clear:both;visibility:hidden;}.clearfix {
	float: none;
	clear: both;
}

/*### DISPLAY */

.display_none {display:none;}
.d_i { display:inline ; }
.d_ib { display:inline-block ; }
.flex {display:flex;}
.flex_tc {justify-content:center;}
.flex_tm {align-items:center;}



.flex_1 {flex: 1;}
.flex_2 {flex: 2;}
.flex_3 {flex: 3;}
.flex_4 {flex: 4;}
.flex_5 {flex: 5;}
.flex_gap5 {gap: 5px;}
.flex_gap10 {gap: 10px;}
.flex_gap15 {gap: 15px;}
.flex_gap20 {gap: 20px;}
.flex_gap30 {gap: 30px;}


.d_b {display:block ;}
.d_n {display:none ;}
.v_h{ visibility: hidden;}

/*### POSITION */

.fl { float:left ; }
.fr { float:right ; }

.pos_a {position:absolute;}
.pos_r {position:relative;}
.pos_f {position:fixed;}
.pos_rb { position:fixed;right:0;bottom:0; }
.pos_rt { position:fixed;right:0;top:0; }
.top0 { top:0px; }
.top5 { top:5px; }
.top10 { top:10px; }
.bottom0 { bottom:0px; }
.bottom5 { bottom:5px; }
.bottom10 { bottom:10px; }
.z999 { z-index:999; }
.z99 { z-index:99; }
.z9 { z-index:9; }
.z1 { z-index:1; }
.z0 { z-index:0; }
.left0 { left:0px; }
.left5 { left:5px; }
.left10 { left:10px; }
.right0 { right:0px; }
.right5 { right:5px; }
.right10 { right:10px; }



.o_hidden { overflow:hidden; }
.oh { overflow:hidden; }
.wb_all { word-break:break-all; }

/*### FONT */
/*#### COLOR */

.blue { color:blue; }
.navy { color:navy; }
.orange { color:darkorange;}
.gold { color:gold;}
.green { color:darkgreen;}
.green2 { color:green;}
.gray { color:#777;}
.silver { color:darkgray;}
.silver2 { color:#8898a8;}
.silver3 { color:#8898a8}
.silver3:hover { color:rgba(0,0,0,0.8)}
.dark { color:#333;}
.white { color:white;}
.white a { color:white; }
.red { color:red;}

.purple {color:purple;}
.yellow {color:orange;}
.cyan {color:cyan;}

.brown { color:brown;}
.black { color:black; }
.mini { font-size:8pt; line-height:120%;}
.normal { font-size:10pt; line-height:120%;}
.normal2 { font-weight:normal ; }

/*#### size */
.big { font-size:12pt; }
.big2 { font-size:14pt; }
.big3 { font-size:16pt; }
.big4 { font-size:18pt; }
.big5 { font-size:24pt; }
.big24 { font-size:24pt; }
.big36 { font-size:36pt; }


.strong { font-weight:bold ; }
.strong_none { font-weight:normal ; }
.italic { font-style:italic; }
.underline { text-decoration:underline; }
.dec_through { text-decoration:line-through; }
.a_none { text-decoration: none; }
.dec_none { text-decoration:none; }
.dec_none a { text-decoration:none; }

.dec_hover  { text-decoration:none; }
.dec_hover:hover { text-decoration:underline;cursor:pointer; }

.dec_hover2  { text-decoration:none; padding:0.2em; border-radius:3px; }
.dec_hover2:hover { text-decoration:underline;background-color:rgba(0,0,0,0.05); cursor:pointer;}
a.dec_hover2:after  { content:" >>"; font-size:small; color:#888; letter-spacing:1px;}


.tm { vertical-align:middle; }
.tm2 { display:grid; align-items:center; justify-items: start; justify-content: start; grid-auto-flow:column; }
.tc { text-align:center; }
.tr { text-align:right; }
.tl { text-align:left; }

.clear_both { clear:both; float:none;}
.clear_left { clear:left; }
.clear_right { clear:right; }


/*### RADIUS */
.rad5p { border-radius:5%;}
.rad10p { border-radius:10%;}
.rad50p { border-radius:50%; }
.rad5 { border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px; }
.rad10 { border-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10px;}

.fraction:after{display:inline-block;content:"";width:1px;height:26px;margin:0 14px;-webkit-transform:rotate(30deg) translate(3px,2px);transform:rotate(30deg) translate(3px,2px);background-color:rgb(139,152,168)}



/* PADDING MARGIN */
.pad0 {		padding:0;}
.pad2 {		padding:2px;}
.pad2_4 {	padding:2px 4px;}
.pad5 {		padding:5px;}
.pad5t { padding-top:5px; }
.pad5b { padding-bottom:5px; }
.pad5r { padding-right:5px; }
.pad5l { padding-left:5px; }
.pad_link { padding:4px 8px; }
.pad10 {	padding:10px;}
.pad10l {	padding-left:10px;}
.pad15l {	padding-left:15px;}
.pad10t {	padding-top:10px;}
.pad10b {	padding-bottom:10px;}
.pad10r {	padding-right:10px;}
.pad5bt { padding-top:5px; padding-bottom:5px;}
.pad10bt { padding-top:10px; padding-bottom:10px;}
.pad20bt { padding-top:20px; padding-bottom:20px;}
.pad20 { padding:20px;}


.mad0 { margin:0; }
.mad1 { margin:1px; }
.mad2 { margin:2px; }
.mad5 { margin:5px; }
.mad10 { margin:10px; }
.mad10bt { margin-top:10px; margin-bottom:10px;}

.mad1em { margin:1em; }
.mad2em { margin:2em; }
.mad5bt { margin-top:5px; margin-bottom:5px;}
.mad10bt { margin-top:10px; margin-bottom:10px;}
.mad20bt { margin-top:20px; margin-bottom:20px;}
.mad20 { margin:20px;}
.mad10t { margin-top:10px; }
.mad10b { margin-bottom:10px; }
.mad10rl  { margin-left:10px; margin-right:10px;}
.mad10l  { margin-left:10px; }
.mad15l  { margin-left:15px; }
.mad5r {  margin-right:5px;}
.mad5t {  margin-top:5px;}
.mad5b {  margin-bottom:5px;}


.mpad5 { padding:5px; margin:5px; }
.mpad10 { padding:10px; margin:10px; }


/* HOVER OPACITY */
.hover_75 {  filter: alpha(opacity=75);   -moz-opacity:0.75;   opacity:0.75 }
.hover_75:hover {  filter: alpha(opacity=100);   -moz-opacity:1.0;   opacity:1.0; }
.hover_75b {  filter: alpha(opacity=100);   -moz-opacity:1.0;   opacity:1.0; }
.hover_75b:hover { filter: alpha(opacity=85);   -moz-opacity:0.85;   opacity:0.85  }
.opa_75 { filter: alpha(opacity=75);   -moz-opacity:0.75;   opacity:0.75 }
.opa_50 { filter: alpha(opacity=50);   -moz-opacity:0.5;   opacity:0.5 }




/*### IMG */

img.gray{filter: gray; -webkit-filter: grayscale(80%);}
img.gray:hover{filter: none;-webkit-filter: grayscale(0%);}
img.gray2{filter: none; -webkit-filter: grayscale(0%);}
img.gray2:hover{filter: gray;-webkit-filter: grayscale(100%);}

/* ----- */


/* BOX BORDER */

.box_border {
	box-shadow: 5px 5px 15px 3px #ddd;
	border:3px solid white;
}
.box_border2 {
	border: 2px solid deepskyblue;
	box-shadow: 0px 0px 10px skyblue;
}
.box_border3 {
	border:1px solid #aaa;
	box-shadow: 2px 2px 5px #ddd;
	margin:0.3em;
	border-radius:3px;
}

/* BOX */

.box_shadow { box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.box_shadow1 { box-shadow:1px 1px 3px #aaa ; }
.box_shadow2 { box-shadow: 2px 2px 1px rgba(0,0,0,0.1) }
.box_shadow3 { box-shadow:0px 0px 5px #aaa ; }




.box {
	background-color: rgba(255,255,255,0.8);
	padding:0.5rem;
	border-radius:8px;
	border:1px solid #ccc;
	overflow:hidden;
	margin:auto;
}

.box2 {
	background-color: #f9f9f9;
	padding:0.5rem;
	border-radius:8px;
	overflow:hidden;
	margin:auto;
	 align-items: flex-start; 
}


.box3 {
	background-color: rgba(125,125,125,0.1);
	padding:0.5rem;
	border-radius:8px;
	overflow:hidden;
	margin:auto;
	 align-items: flex-start; 

}


.box4 {
	background-color:rgba(255,255,255,0.5);
	box-shadow: rgba(255,255,255,0.4) 20px 20px 50px 10px inset, rgba(0, 0, 0, 0.2) 0px 4px 6px -1px, rgba(0, 0, 0, 0.07) 0px 2px 4px -1px;
	border-radius:8px;
	padding:16px;
	overflow:hidden;
	border:1px solid #fff;

	backdrop-filter: blur(2px);
}

.box5 {
	background-color:rgba(255,255,255,0.2);
	box-shadow: rgba(255,255,255,0.3) 20px 20px 50px 10px inset, rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.03) 0px 2px 4px -1px;
	border-radius:8px;
	padding:16px 0;
	overflow:hidden;
	border:1px solid #fff;
}


.box6 {
	background-color:#161f35;
	color:rgba(255,255,255,0.9);
	padding:16px;
/* https://uigradients.com/#MoonlitAsteroid */


background: #0F2027;  
background: -webkit-linear-gradient(to right, #2C5364, #203A43, #0F2027); 
background: linear-gradient(to right, #2C5364, #203A43, #0F2027);
/*
background: #0f0c29; 
background: -webkit-linear-gradient(to right, #24243e, #302b63, #0f0c29);
background: linear-gradient(to right, #24243e, #302b63, #0f0c29); 
*/

 }
 
 
.box7 {
	background-color:rgba(255,255,255,0.8);
	border-radius:10px;
	box-shadow: 0px 0px 20px #eee; 
}


.box8 {
	background:linear-gradient(155deg, #fff , #f5f5f5); padding:10px 0px;margin:10px 0px;
 font-family:'Tahoma','Arial'
}

.box8_border {
	box-shadow:2px 2px 5px #eee;
}


/***********************************************/

.az_title{margin-bottom:5px;font-weight:700;}
@media screen and (max-width:767px){ .az_title{margin-bottom:10px;} }

.az_h1{margin:20px auto;font-weight:700;}






.az_box {
	padding:10px;box-shadow:0px 0px 15px rgba(26,32,38,0.1);border-radius:10px
}

.az_box_border {
	border:1px solid #f5f5f5;
}


.box9_harf{ width:calc((100% - 20px) / 2);
padding:10px;box-shadow:0px 0px 15px rgba(26,32,38,0.1);border-radius:10px;gap:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row

}

.media screen and (max-width:767px){
	.box9_harf{width:100%}
}


.menu-main{
	display:block;aspect-ratio:1/1;width:calc((100% - 80px) / 5);
	border-radius:10px;background-color:rgb(26,32,38);color:rgb(255,255,255);display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;
	-webkit-box-align:center;-ms-flex-align:center;align-items:center
}

@media screen and (max-width:767px){
	.menu-main{width:calc((100% - 30px) / 4)}
	.menu-main:nth-child(5n){display:none}}.menu-main img{width:25px;margin-bottom:5px
}
@media screen and (max-width:767px){.menu-main img{margin-bottom:11px}}


.main-menu-wrapper{
	gap:20px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;
	-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-ddirection:row;flex-direction:row}
@media screen and (max-width:767px){ .main-menu-wrapper{gap:10px} }




.box_section { }


.az_ul {gap:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}

.az_ul li { width:100%;padding:21px 20px 18px;  }






@media screen and (min-width:480px){ 
/*.az_ul2 li { width:calc((100% - 20px) / 2);  }*/
}





.az_ul2 {gap:15px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}

@media screen and (max-width:767px){ .az_ul2 {gap:10px} }

.az_ul2 li { width:calc((100% - 20px) / 2);  }
@media screen and (max-width:767px){.az_ul2 li{width:100%;padding:21px 20px 18px} }





.az_ul4 { gap:4px 10px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row; }

.az_ul4 li{width:calc((100% - 30px) / 4)}
@media screen and (max-width:767px){ .az_ul4 li{width:calc((100% - 10px) / 2)} }


.az_ul4 a{position:relative;display:block;width:100%;margin-top:10px;padding:15px;font-weight:700;text-align:center;border-radius:5px;color:rgb(26,32,38);background-color:rgb(249,249,249);border:1px solid rgb(232,232,234);text-decoration:none;}

.az_ul4 a:after{position:absolute;top:50%;right:10px;content:"";display:inline-block;width:5px;height:5px;content:"";border-top:2px solid;border-right:2px solid;border-color:rgb(139,152,168);border-color:rgb(26,32,38);-webkit-transform:translateY(-50%) rotate(45deg);transform:translateY(-50%) rotate(45deg)}



.az_box_next a{position:relative;display:block;width:100%;padding:10px;text-align:center;border-radius:5px;color:rgb(26,32,38);background-color:rgb(249,249,249);border:1px solid rgb(232,232,234);text-decoration:none;}

.az_box_next a:after{position:absolute;top:50%;right:10px;content:"";display:inline-block;width:5px;height:5px;content:"";border-top:2px solid;border-right:2px solid;border-color:rgb(139,152,168);border-color:rgb(26,32,38);-webkit-transform:translateY(-50%) rotate(45deg);transform:translateY(-50%) rotate(45deg)}

.az_box_next a:hover{background-color:rgb(230,230,230);}


.az_hover { cursor:pointer; opacity:1;  transition: all 100ms 0s ease;}
.az_hover:hover { filter:invert(30%) drop-shadow(0px 0px 10px #ccc); background-color:rgba(0,0,0,0.05);}

.az_mb40 { margin-bottom:40px } 
.az_mb30 { margin-bottom:30px } 
.az_mb20 { margin-bottom:20px } 
.az_mb10 { margin-bottom:10px } 


.az_check  {

	margin:2px;
	
}

label.az_check  span{
	border:1px solid transparent;
	user-select: none;
	background-color:rgba(100,100,100,0.1);
	border-radius:20px;
	padding:4px 8px;
	min-width:5em;
	display:inline-block;
	background-repeat:no-repeat;
	background-position: 0 0;
	vertical-align:middle;
	cursor:pointer;
	color:#777;
}

.az_check span:hover{ filter:grayscale(0%) ; }
.az_check input[type="checkbox"] { border:none;display:none; }
.az_check input[type="checkbox"]:checked + span {
	color:#333; border:1px solid rgb(0,66,246)
}



.az_btn, .btn_insert{
	 cursor:pointer;
	margin:4px;
	border:none;
	background-color:rgb(112,112,112);color:rgb(255,255,255);
	font-weight:700;
		min-width:90px;
	margin:20px auto 0;
	position:relative;
border-radius:50px;
	
	padding:6px;
}

.az_btn:hover, .btn_insert:hover{
	background-color:rgb(140,140,140);color:rgb(255,255,255);
}


.az_btn2{
	cursor:pointer;
	padding:10px;
	border:1px solid rgb(125,125,125);
	color:rgb(125,125,125);
	background-color:transparent;;
	border-radius:50px;
	min-width:90px;
	margin:4px;
	
}

.az_btn2:hover{
	background-color:rgb(140,140,140, 0.1);
}


.az_btn_search, .btn_search{
	border:none; cursor:pointer;
	padding:5px;background-color:rgb(112,112,112);color:rgb(255,255,255);font-weight:700;border-radius:50px;margin:20px auto 0;
	position:relative;min-width:90px;padding:6px;
}

.az_btn_search:hover, .btn_search:hover {
	background-color:rgb(140,140,140);color:rgb(255,255,255);
}

.az_btn_search:before, .btn_search:before{
	position:absolute;top:50%;left:12px;-webkit-transform:translateY(-50%);transform:translateY(-50%);display:block;content:"";
	background-image:url("/icon/asset2/search.svg");background-size:cover;background-repeat:no-repeat;background-position:center center;width:19px;height:19px;
}


.az_imglabel_search{
	position:relative;
}


.az_imglabel_search:before{
	position:absolute; top:50%;left:12px;-webkit-transform:translateY(-50%);transform:translateY(-50%);display:block;content:"";
	background-image:url("/icon/asset2/search.svg");background-size:cover;background-repeat:no-repeat;background-position:center center;width:19px;height:19px;
}


@media screen and (max-width:767px){ 
	.az_sp100p{width:100%}
}


.az_tab_box { 
	border-left:1px solid blue;
	border-right:1px solid blue;
	border-bottom:1px solid blue;

	border-radius:0px 0px 10px 10px; 
}

.az_tab { }
.az_tab label {  }
.az_tab label span{
	padding: 15px 5px;
	margin:auto;;
	display: inline-block;
	width:100%;
	cursor: pointer;
	text-shadow: 0px 1px 0px #eee;
	user-select: none;
	text-align:center;
	border-top:1px solid #ccc;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	border-bottom:1px solid blue;
	border-radius:10px 10px 0px 0px;
}
.az_tab span:hover{
	filter:grayscale(0%) ;
}
.az_tab input[type="radio"], .az_tab input[type="checkbox"] {  border:none;display:none; }
.az_tab input[type="radio"]:checked + span, .az_tab  input[type="checkbox"]:checked + span   {
	filter:grayscale(0%) ;

	border-top:1px solid blue;
	border-left:1px solid blue;
	border-right:1px solid blue;
	border-bottom:1px solid transparent;
	border-radius:10px 10px 0px 0px;

}



.btn-daily-input {margin:31px auto 27px;gap:11px 10px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row }

@media screen and (max-width:767px){ .btn-daily-input{margin:35px auto 20px;gap:8px 10px} }
.btn-daily-input a{position:relative;display:block;width:calc((100% - 20px) / 3);padding:11px 20px;text-align:left;font-weight:700;border:1px solid rgb(232,232,234);border-radius:50px;text-decoration:none;}

@media screen and (max-width:767px){ .btn-daily-input a{width:calc((100% - 10px) / 2);padding:10px 20px} }
.btn-daily-input a:after{ position:absolute;top:50%;right:15px;-webkit-transform:translateY(-50%);transform:translateY(-50%);content:"";display:block;width:10px;height:10px;background-image:url("/icon/asset2/plus.svg");background-position:center center;background-repeat:no-repeat;background-size:contain }




@media screen and (max-width:767px){
	.sp-order-1{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}
	.sp-order-2{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}
	.sp-order-3{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}
	.sp-order-4{-webkit-box-ordinal-group:5;-ms-flex-order:4;order:4}
	.sp-order-5{-webkit-box-ordinal-group:6;-ms-flex-order:5;order:5}
	.sp-order-6{-webkit-box-ordinal-group:7;-ms-flex-order:6;order:6}
	.sp-order-7{-webkit-box-ordinal-group:8;-ms-flex-order:7;order:7}
	.sp-order-8{-webkit-box-ordinal-group:9;-ms-flex-order:8;order:8}
	.sp-order-9{-webkit-box-ordinal-group:10;-ms-flex-order:9;order:9}
	.sp-order-10{-webkit-box-ordinal-group:11;-ms-flex-order:10;order:10}
}

.goto-button{display:block;width:100%;margin:28px 0 30px;padding:11px;border:1px solid rgb(0,60,255);color:rgb(0,60,255);border-radius:50px;background-color:transparent;text-decoration:none; text-align:center;}
.goto-button:hover{text-decoration:none; text-align:center;}
@media screen and (max-width:767px){.goto-button{margin:25px 0 20px}}

.nav-name{margin-bottom:5px;font-size:15px}
.nav-member-id{color:rgb(118,133,152);font-size:10px}
.inner-menu{margin-bottom:18px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}
.inner-menu a{display:block;width:33.3333333333%;padding:5px;font-size:10px;color:rgb(139,152,168);border-right:1px solid rgb(139,152,168)}
.sub-menu{margin-bottom:18px;gap:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}
.sub-menu a{position:relative;display:block;width:calc((100% - 10px) / 2);background-color:rgb(255,255,255);color:rgb(26,32,38);padding:17px;border-radius:10px}
.sub-menu img{position:absolute;top:50%;left:15px;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:23px}
.inner-menu a:last-child{border-right:none}
.inner-menu a:last-child span{text-decoration:underline}
.navi-main-menu{margin-bottom:20px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}
.navi-main-menu li{width:50%}
.navi-main-menu li a{position:relative;display:block;padding:16px;color:rgb(26,32,38);border-top:1px solid rgb(203,210,216)}
.navi-main-menu li:nth-child(2n){border-left:1px solid rgb(203,210,216)}
.navi-main-menu li:nth-last-child(-n+2){width:100%}
.navi-main-menu li:last-child{border-bottom:1px solid rgb(203,210,216);border-left:none}
.navi-main-menu img{position:absolute;top:50%;left:15px;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:26px}
.log-out-box{text-align:right}
.log-out{color:rgb(139,152,168);font-size:10px;letter-spacing:-1px;margin-right:30px}
.log-out img{display:inline-block;width:14px;margin-right:9px;vertical-align:middle}
.log-out span{vertical-align:middle}

#menu-btn-check:checked~.menu-content{left:0;-webkit-transition:0.4s;transition:0.4s}

.menu-main{display:block;aspect-ratio:1/1;width:calc((100% - 80px) / 5);border-radius:10px;background-color:rgb(26,32,38);color:rgb(255,255,255);display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}


@media screen and (max-width:767px){
	.menu-main{width:calc((100% - 30px) / 4)}
	.menu-main:nth-child(5n){display:none}}
.menu-main img{width:25px;margin-bottom:5px
}


@media screen and (max-width:767px){.menu-main img{margin-bottom:11px}}


.menu-btn{position:absolute;top:5px;right:10px;display:-webkit-box;display:-ms-flexbox;display:flex;height:56px;width:56px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;z-index:999;cursor:pointer;}

@media screen and (max-width:767px){.menu-btn{right:3px;top:5px;font-size:10px;height:50px;width:54px}}

.menu-btn:after{content:"MENU";position:absolute;bottom:0;-webkit-transition:0.3s;transition:0.3s}
.menu-btn:before{content:"close";position:absolute;bottom:0;opacity:0;-webkit-transition:0.3s;transition:0.3s}
.menu-btn .border,.menu-btn .border:after,.menu-btn .border:before{-webkit-transition:0.3s;transition:0.3s;content:"";display:block;height:3px;width:25px;border-radius:3px;background-color:rgb(26,32,38);position:absolute}
.menu-btn .border:before{bottom:8px}
.menu-btn .border:after{top:8px}
#menu-btn-check{display:none}
#menu-btn-check:checked~.menu-btn:after{opacity:0;-webkit-transition:0.3s;transition:0.3s}
#menu-btn-check:checked~.menu-btn:before{opacity:1;-webkit-transition:0.3s;transition:0.3s}
#menu-btn-check:checked~.menu-btn span{background-color:transparent}
#menu-btn-check:checked~.menu-btn span:before{bottom:0;-webkit-transform:rotate(45deg);transform:rotate(45deg)}
#menu-btn-check:checked~.menu-btn span:after{top:0;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
.btn-other{text-align:right}
.btn-other a{color:rgb(139,152,168);font-size:10px}
.btn-other a:after{content:"";display:inline-block;margin:0 10px;-webkit-transform:rotate(45deg);transform:rotate(45deg);display:inline-block;width:5px;height:5px;content:"";border-top:2px solid;border-right:2px solid;border-color:rgb(139,152,168)}




.menu-content{width:100%;height:100%;overflow-y:scroll;position:fixed;top:0;left:100%;padding:65px 0 50px;z-index:80;-webkit-transition:0.4s;transition:0.4s;background-color:rgb(240,241,245)}
.nav-info{margin-bottom:9px}
.nav-thumbnail{width:100px;aspect-ratio:1/1;border-radius:50%;margin:0 auto 15px;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16);box-shadow:0 3px 6px rgba(0,0,0,0.16)}
.nav-thumbnail img{-o-object-fit:cover;object-fit:cover;height:100%}
.nav-service-box{width:70px;padding:2px;margin:0 auto 6px;border-radius:10px;background-color:rgb(52,58,65);color:rgb(255,255,255);font-size:10px;font-family:700}


.nav-name{margin-bottom:5px;font-size:15px}
.nav-member-id{color:rgb(118,133,152);font-size:10px}
.inner-menu{margin-bottom:18px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}
.inner-menu a{display:block;width:33.3333333333%;padding:5px;font-size:10px;color:rgb(139,152,168);border-right:1px solid rgb(139,152,168)}
.sub-menu{margin-bottom:18px;gap:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}
.sub-menu a{position:relative;display:block;width:calc((100% - 10px) / 2);background-color:rgb(255,255,255);color:rgb(26,32,38);padding:17px;border-radius:10px}
.sub-menu img{position:absolute;top:50%;left:15px;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:23px}
.inner-menu a:last-child{border-right:none}
.inner-menu a:last-child span{text-decoration:underline}
.navi-main-menu{margin-bottom:20px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}
.navi-main-menu li{width:50%}
.navi-main-menu li a{position:relative;display:block;padding:16px;color:rgb(26,32,38);border-top:1px solid rgb(203,210,216)}
.navi-main-menu li:nth-child(2n){border-left:1px solid rgb(203,210,216)}
.navi-main-menu li:nth-last-child(-n+2){width:100%}
.navi-main-menu li:last-child{border-bottom:1px solid rgb(203,210,216);border-left:none}
.navi-main-menu img{position:absolute;top:50%;left:15px;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:26px}
.log-out-box{text-align:right}
.log-out{color:rgb(139,152,168);font-size:10px;letter-spacing:-1px;margin-right:30px}
.log-out img{display:inline-block;width:14px;margin-right:9px;vertical-align:middle}
.log-out span{vertical-align:middle}
#menu-btn-check:checked~.menu-content{left:0;-webkit-transition:0.4s;transition:0.4s}

.menu-main{display:block;aspect-ratio:1/1;width:calc((100% - 80px) / 5);border-radius:10px;background-color:rgb(26,32,38);color:rgb(255,255,255);display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}



@media screen and (max-width:767px){
	.menu-main{width:calc((100% - 30px) / 4)}
	.menu-main:nth-child(5n){display:none}}
.menu-main img{width:25px;margin-bottom:5px
}


@media screen and (max-width:767px){.menu-main img{margin-bottom:11px}}


header{height:64px;padding:0px;-webkit-box-shadow:0 0 5px rgba(0,0,0,0.15);box-shadow:0 0 5px rgba(0,0,0,0.15); margin-bottom:25px;}
@media screen and (max-width:767px){ header{height:64px;padding:0px;} }

.header-logo{width:200px;margin:auto}
@media screen and (max-width:767px){.header-logo{width:160px}}div.error-message{font-size:150%}



.calender-button{position:absolute;padding:0;width:15px;height:15px;border-top:2px solid rgb(26,32,38);border-right:2px solid rgb(26,32,38)}
@media screen and (max-width:767px){.calender-button{width:9px;height:9px}}
.calender-button.prev{top:30%;left:70px;-webkit-transform:rotate(225deg) translateY(-50%);transform:rotate(225deg) translateY(-50%)}
@media screen and (max-width:767px){.calender-button.prev{left:30px;top:20%}}
.calender-button.next{top:44%;right:70px;-webkit-transform:rotate(45deg) translateY(-50%);transform:rotate(45deg) translateY(-50%)}
@media screen and (max-width:767px){.calender-button.next{right:30px}}
.register-button{position:absolute;top:0;left:0;display:block;width:80px;line-height:40px;color:rgb(0,60,255);border:1px solid rgb(0,60,255);border-radius:10px}
@media screen and (max-width:767px){.register-button{top:-5px}}
.button-gray-add{position:relative;display:block;width:100%;margin-top:10px;padding:15px;font-weight:700;text-align:center;border-radius:5px;color:rgb(26,32,38);background-color:rgb(249,249,249);border:1px solid rgb(232,232,234)}


@media screen and (max-width:767px){.aggregation-graph-section{padding-top:29px}
.aggregation-graph-section .title-page{margin-bottom:23px}
.aggregation-graph-section .day-select select{padding:18px}}
.aggregation-graph-section .graph-select{width:calc(80% - 90px)}
@media screen and (max-width:767px){.aggregation-graph-section .graph-select{width:calc(100% - 90px)}}
@media screen and (max-width:767px){.aggregation-graph-type{padding-top:28px}}
.aggregation-graph-main-wrapper{gap:20px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}



.chk_explode { display: flex;align-items: center;justify-content:flex-start; position:relative;padding:4px;text-align:left;font-size:15px;font-weight:700; }
.chk_explode_content{-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition:all 0.3s;transition:all 0.3s ;}
.chk_explode_content{max-height:0;overflow:hidden;-webkit-transition:max-height 0.5s ease-out;transition:max-height 0.5s ease-out;padding:0 15px;text-align:right;}


.explode{ position:absolute;top:50%;right:25px;-webkit-transform:translateY(-50%);transform:translateY(-50%);display:block;width:15px;height:15px;cursor:pointer; 	user-select: none; }
.explode:after, .explode:before{position:absolute;top:50%;left:0;content:"";width:100%;height:2px;border-radius:50px;background-color:rgb(26,32,38)}
.explode:before{-webkit-transform:rotate(90deg);transform:rotate(90deg);-webkit-transition:0.5s;transition:0.5s}

.toggle{display:none}
.toggle:checked+.chk_explode .explode:before{-webkit-transform:rotate(0);transform:rotate(0);-webkit-transition:0.5s;transition:0.5s}
.toggle:checked~.chk_explode_content{max-height:9999px;padding-bottom:18px;-webkit-transition:max-height 1s ease-in;transition:max-height 1s ease-in}
.toggle:checked~.chk_explode_content{padding-top:4px}


/*
.chk_explode {  align-content :center; position:relative;display:block;padding:10px;text-align:left;font-size:15px; }

.chk_explode_body {-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition:all 0.3s;transition:all 0.3s ;}
.chk_explode_body {max-height:0;overflow:hidden;-webkit-transition:max-height 0.5s ease-out;transition:max-height 0.5s ease-out;padding:0 15px;text-align:right;color:rgb(139,152,168)}


.chk_explode_mark { position:absolute;top:15px;right:15px;-webkit-transform:translateY(-50%);transform:translateY(-50%);display:block;width:15px;height:15px;cursor:pointer; 	user-select: none; }
.chk_explode_mark:after, .chk_explode_mark:before {position:absolute;top:50%;left:0;content:"";width:100%;height:2px;border-radius:50px;background-color:rgb(26,32,38)}
.chk_explode_mark:before {-webkit-transform:rotate(90deg);transform:rotate(90deg);-webkit-transition:0.5s;transition:0.5s}

.chk_explode input[type="checkbox"] {display:none;}
.chk_explode input[type="checkbox"]:checked~ .chk_explode_mark:before{ -webkit-transform:rotate(0);transform:rotate(0);-webkit-transition:0.5s;transition:0.5s }
.chk_explode input[type="checkbox"]:checked~ .chk_explode_body{ max-height:9999px;padding-bottom:18px;-webkit-transition:max-height 1s ease-in;transition:max-height 1s ease-in}
*/








@media screen and (max-width:767px){.aggregation-graph-staff{padding-top:27px}}
.aggregation-graph-staff .option{-webkit-box-shadow:0px 0px 15px rgba(26,32,38,0.1);box-shadow:0px 0px 15px rgba(26,32,38,0.1);background-color:rgb(255,255,255)}
.aggregation-graph-staff .option:not(:last-child){margin-bottom:13px}
@media screen and (max-width:767px){.aggregation-graph-staff .option:not(:last-child){margin-bottom:10px}}
.aggregation-graph-staff .title{padding:8.5px 9px}
.aggregation-graph-staff .title .todo-info .image-box{width:64px}



/***********************************************/

.box_msg {
	background-color:#f5f5f5;padding:0.6em;
	box-shadow: 2px 2px 18px rgba(128,128,128,0.3) inset;
	border:1px solid #aaa;border-radius:3px;
}
.box_msg2 {
	border:1px solid red;background-color:#FEEEED;margin:1em;padding:1em;color:red;
}



/* SEARCH */

.box_search {
	height:50px;
	margin:0px;
	padding:0px;
}


.btn_link {
	display: inline-block;
	border-radius:30px;
}
.btn_link:hover {
	background-color:rgba(0,0,0,0.05); /*rgba(55,155,255,0.2);*/
	text-decoration:none;
}

/*
.btn_search {
	display: inline-block;
	padding: 0.4em 1.6em;
	text-decoration: none;
	color: #476282;
	border: solid 2px #476282;
	border-radius:  50px;
	transition: .4s;
	cursor:pointer;
	background: rgba(255,255,255,0.1);
	letter-spacing:0.2em;
	font-weight:bold;
}
.btn_search:hover {
	background-color:#fff; 
	text-shadow:0px 0px 5px #fff;
	box-shadow:0px 0px 0px 4px #aaccee;
}


.btn_search2 {
	display: inline-block;
	padding: 0.4em 1.6em;
	text-decoration: none;
	color: #666;
	border-radius:  50px;
	transition: .4s;
	cursor:pointer;
	letter-spacing:0.2em;
	background-color:rgba(100,100,100,0.05); 
	border:1px solid rgba(0,150,250,0.1); 
}
.btn_search2:hover {
	background-color:rgba(0,150,250,0.2); 
	text-shadow:0px 0px 5px #fff;
	box-shadow:0px 0px 10px rgba(0,150,250,0.1);
}
*/

.btn_sankaku {
	display: inline-block;
	vertical-align: top;
	clip-path: polygon(0 0, 50% 100%, 100% 0);
	background-color:rgba(0,0,0,0.05);
	border:none;
	cursor:pointer;
	color:#555;
/*	background: radial-gradient(circle, rgba(221,223,224,0.5) 46%, rgba(241,241,241,0.5) 100%);*/
	background: radial-gradient(circle, rgba(121,150,200,0.2) 56%, rgba(151,241,255,0.1) 100%);
	padding:5px;
	width:15em;
	height:3em;
	border-raidus:10px;

}
.btn_sankaku:hover {
	background-color:rgba(0,0,0,0.1);
	background: radial-gradient(circle, rgba(121,223,255,0.7) 56%, rgba(151,241,255,0.8) 100%);
	
}


/*### SEARCH */

.txt_search {
	padding:0px 5px;
	margin:auto;
	height: 100%;
	box-sizing: border-box;
	vertical-align: top;
	border:2px solid darkorange;
	background-color:#faffbd ; /* #f5f5f5; */
	box-shadow:inset 0px 0px 5px #ccc;
}
.txt_search:hover {
	background-color:#fff;
}

.txt_tab4{
	-o-tab-size: 4 ;	/* Opera Mini */
	-moz-tab-size: 4 ;	/* Firefox */
	tab-size: 4 ;
}

/* BOX IMG */
.box_photo {
	
	border:10px solid #fff;
	border-radius:5px;
	background-color:#fff;
	display:inline-block;
	position:relative;

}
.box_photo_select {
	
	border:10px solid yellowgreen;
	border-radius:5px;
	background-color:#fff;
	box-shadow:0px 0px 10px yellowgreen;
	z-index:500;
	display:inline-block;
	position:relative;

}


.box_photo_select:before {
	content: url("/icon/check.png") ;
	top: -50px;
	right: -50px;
	position: absolute;
	z-index:1000;

}






/* TITLE */

.h1 { letter-spacing:0.3em;  color:#111 /*#1898b7*/ ; }
.h2 { letter-spacing:0.3em; margin:0.5em ; color:#111 }
.h3 { letter-spacing:0.3em ; margin:0.5em ; color:#111 }
.h4 { letter-spacing:0.3em ; margin:0.5em ; color:#222 }


.title7 { display: flex; align-items: center;   color:rgba(0,0,0,0.7);}
.title7::before, .title7::after {
  content: '';
  height: 1px;
  background-color: rgba(0,0,0,0.7);
  flex-grow: 1;

}
.title7::before { margin-right: 1rem; }
.title7::after { margin-left: 2rem; }


.title7_2 { display: flex; align-items: center;   color:#222;}
.title7_2::before, .title7_2::after {
  content: '';
  border-top: 1px dotted #ccc;
  flex-grow: 1;

}
.title7_2::before { margin-right: 0.3rem; }
.title7_2::after { margin-left: 0.3rem; }






.title8 {
	padding:5px 5px 5px 0;
	margin:0.5em 0.5em 0.5em 0;
	letter-spacing: 0.5em;

	border-bottom:2px solid #666;
	font-weight:bold;
	min-width:200px;
	clear:both;
}

.title8_2 {
	padding:10px 3px;
	margin-left:-20px;
	margin-top:0.3em;
	margin-bottom:0.3em;
	overflow:hidden;
	letter-spacing: 0.3em;
    font-size: 18pt;
	border-bottom:1px solid black;
	font-weight:bold;
	min-width:200px;
	clear:both;
}
.title8_2:first-letter{
    font-size: 24pt;
	font-weight:bold;
}


.title8_3 {

	border-radius:5px;	
	padding:5px; 
	background-color:#ccddff;
}

.title8_3_off {

	border-radius:5px;	
	padding:5px; letter-spacing:0.2em; margin:0.5em 0.5em 0.5em 0;
	transform: skew(-5deg);
	background-image: linear-gradient(140deg, rgba(0,0,0,0.01) 0%, rgba(0,0,0,0.02) 40%, rgba(0,0,0,0.01) 60%, transparent 100%);
}

.title8_4{
	letter-spacing:0.5em;text-shadow:0px 0px 3px #eee;
}


.title9 {
	border-bottom:5px solid #335577;
	border-image: linear-gradient(to right, #335577 0%, #335577 20%, transparent 70%);
	border-image-slice: 0 0 1 0;
}


.title9_2 {
	border-bottom:3px solid #335577;
	border-image: linear-gradient(to right, #335577 0%, #335577 10%, transparent 30%);
	border-image-slice: 0 0 1 0;
	letter-spacing:0.1em;
	color:rgba(0,0,0,0.5);
}







/*#### MARK */
.navy_mark {	background-color:#476282;color:white;padding:2px 5px;display:inline-block; margin:2px;}
.blue_mark {background-color:#3363ff; color:#fff;padding:2px 5px;display:inline-block;  margin:2px;}
.blue_mark2 {	background-color:#99ccff;color:white;padding:2px 5px;display:inline-block;  margin:2px;}
.blue_mark3 {	background-color:#3178c6;color:white;padding:2px 5px;display:inline-block;  margin:2px;}
.blue_flag_mark {background-color:rgba(0,50,255,0.03); color:rgba(0,30,150,1); padding:5px; display:inline-block;  margin:2px;}

/*
.blue_flag_mark {background-color:#3399ee; color:#fff;padding:2px 5px;display:inline-block;}
.blue_mark {background-color:#3399ee;  background: linear-gradient(110deg, #3399ee 0%, transparent 50%);  color:white;padding:2px 5px;display:inline-block;}
*/

.red_mark {background-color:#f65354;color:white;padding:2px 5px;display:inline-block;  margin:2px;}
.red_flag_mark {background-color:rgba(255,0,0,0.05); color:rgba(255,0,0,1);;padding:5px;display:inline-block;  margin:2px;}

/*
.red_flag_mark {background-color:#cc3333;color:white;padding:2px 5px;display:inline-block;}


*/


.pink_mark {background-color:#ff7588;color:white;padding:2px 5px;display:inline-block; margin:2px;}
.pink_flag_mark {background-color:rgba(255,90,100,0.1); color:rgba(255,0,0,1);;padding:5px;display:inline-block; margin:2px;}

/*
.pink_flag_mark {background-color:#ff7588;color:white;padding:2px 5px;display:inline-block;}

*/


.green_mark {	background-color:#1bd2a4;color:white;padding:2px 5px;display:inline-block; margin:2px;}
/*
.green_flag_mark {background-color:#339933;color:white;padding:2px 5px;display:inline-block;}

*/

.green_flag_mark {background-color:rgba(0,255,50,0.03); color:rgba(0,150,50,1);;padding:5px;display:inline-block; margin:2px;}

/*
.green_flag_mark {background-color:rgba(0,255,50,0.03); color:rgba(0,150,50,1);;padding:5px;display:inline-block;}

*/
.select_mark {background-color:#e5eaf0;color:#375292;padding:2px 5px;display:inline-block; margin:2px;}

.silver_mark {background-color:#8b98a8;color:white;padding:2px 5px;display:inline-block; margin:2px;}
.silver_mark2 {background-color:#f5f5f5;color:#ccc;padding:2px 5px;display:inline-block; margin:2px;}
.silver_mark3 {background-color:#f5f5f5;color:#777;padding:2px 5px;display:inline-block; margin:2px;}
.silver_mark4 {background-color:rgba(0,0,0,0.3);color:#fff;padding:2px 5px;display:inline-block; margin:2px;}
.silver_flag_mark {background-color:rgba(100,100,100,0.03);color:rgba(100,100,100,1);padding:5px;display:inline-block; margin:2px;}

/*
.silver_flag_mark {background-color:rgba(100,100,100,0.03);color:rgba(100,100,100,1);padding:5px;display:inline-block;}
.silver_flag_mark {background-color:#777777;color:white;padding:2px 5px;display:inline-block;}

*/

.brown_mark {background-color:brown;color:white;padding:2px 5px;display:inline-block; margin:2px;}
.brown_flag_mark {background-color:brown;color:white;padding:2px 5px;display:inline-block; margin:2px;}
.orange_mark {background-color:#ff8b34;color:white;padding:2px 5px;display:inline-block; margin:2px;}
.orange_flag_mark {background-color:rgba(255,150,0,0.03);color:rgba(255,150,0,1);padding:5px;display:inline-block margin:2px;;}

/*
.orange_flag_mark {background-color:#ffa500;color:white;padding:2px 5px;display:inline-block;}

*/



.purple_mark {background-color:#800080;color:white;padding:2px 5px;display:inline-block; margin:2px;}
.purple_flag_mark {background-color:#800080;color:white;padding:2px 5px;display:inline-block; margin:2px;}


.yellow_mark {background-color:#ffff00;color:darkorange;padding:2px 5px;display:inline-block; margin:2px;}
.yellow_flag_mark {background-color:#ffff00;color:darkorange;padding:2px 5px;display:inline-block; margin:2px;}
/*
.yellow_flag_mark {background-color:rgba(255,255,0,0.3);color:darkorange;padding:5px;display:inline-block;}
*/

.cyan_mark {background-color:#00ddff;color:blue;padding:2px 5px;display:inline-block; margin:2px;}
.cyan_flag_mark {background-color:#00ddff;color:blue;padding:2px 5px;display:inline-block; margin:2px;}

.gold_mark {background-color:#ffd700;color:#fff;padding:2px 5px;display:inline-block; margin:2px;}
.gold_flag_mark {background-color:#ffd700;color:#fff;padding:2px 5px;display:inline-block; margin:2px;}
.lime_mark {background-color:#00ff00;color:#fff;padding:2px 5px;display:inline-block; margin:2px;}
.lime_flag_mark {background-color:#00ff00;color:#fff;padding:2px 5px;display:inline-block; margin:2px;}
.chocolate_mark {background-color:#d2691e;color:#fff;padding:2px 5px;display:inline-block; margin:2px;}
.chocolate_flag_mark {background-color:#d2691e;color:#fff;padding:2px 5px;display:inline-block; margin:2px;}

.snow_mark {background-color:ghostwhite;color:skyblue;padding:2px 5px;display:inline-block; margin:2px;}
.snow_flag_mark {background-color:ghostwhite;color:skyblue;padding:2px 5px;display:inline-block; margin:2px;}
.white_mark {background-color:rgba(255,255,255,0.7);color:darksilver;padding:5px;display:inline-block; margin:2px;}
.white_flag_mark {background-color:rgba(255,255,255,0.7);color:darksilver;padding:5px;display:inline-block; margin:2px;}



.enable_mark {background-color:rgba(30,120,220,0.9);;color:#fff;padding:2px 5px;display:inline-block; margin:2px;}
.enable_mark2 {background-color:rgba(10,20,120,0.9);;color:#fff;padding:2px 5px;display:inline-block; margin:2px;}
.disable_mark {	background-color:rgba(100,100,100,0.05);color:rgba(100,100,100,0.6);;padding:2px 5px;display:inline-block; margin:2px;}

.title_mark {
	background-color:rgba(50,50,50,0.1);color:rgba(0,0,0,0.3); padding:3px 5px;
	display:inline-block; margin:2px;
}


.insta_mark {
	padding:2px 5px;display:inline-block;
  color: #fff;
  background-image: -webkit-gradient(linear, left top, right top, from(#f83600), to(#f9d423));
  background-image: -webkit-linear-gradient(left, #f83600 0%, #f9d423 80%);
  background-image: linear-gradient(to right, #f83600 0%, #f9d423 80%);
   margin:2px;

}
.insta_mark2 {
	padding:2px 5px;display:inline-block;
  color: #fff;
  background-image: -webkit-gradient(linear, right top, left top, from(#9be15d), to(#00e3ae));
  background-image: -webkit-linear-gradient(right, #9be15d 0%, #00e3ae 100%);
  background-image: linear-gradient(to left, #9be15d 0%, #00e3ae 100%);
 margin:2px;
}
.insta_mark3 {
	padding:2px 5px;display:inline-block;
	color: #fff;
	background-image: -webkit-gradient(linear, left top, right top, from(#209cff), to(#68e0cf));
	background-image: -webkit-linear-gradient(left, #209cff 0%, #68e0cf 100%);
	background-image: linear-gradient(to right, #209cff 0%, #68e0cf 100%);
	 margin:2px;
}



.label {color:#777;padding:2px 5px; display:inline-block;}

/*### LABEL */
.label2
{
	color:#888;
	padding:2px;
	text-decoration:none;
	display:inline-block;
	font-size:small;
}
.label2:hover
{
	color:#555;
	background-color:rgba(100,100,100,0.05);

}

.label3 {
display:inline-block;
border-radius:50px;background-color:rgba(0,0,0,0.05);color:#555;
padding:4px;
}

.label4 {
display:inline-block;
padding:2px 16px;
margin:4px;
border-bottom:1px solid rgba(0,0,0,0.5);
color:rgba(0,0,0,0.7);
}
/*#### STAMP */
.stamp {
	display:inline-block;
	background-color:rgba(255,0,0,0.3);color:white;border-radius:50%;padding:5px;
}

.stamp2 {
	display:inline-block;
	color:red;
	border:1px solid red;
	border-radius:50%;padding:5px;
}



/*### INPUT */

.input {
	background-color:rgba(255,255,255,0.8);
	border: 1px solid #ddd;
	padding:1em;
	margin:4px;
	border-radius:5px;
}



.input:read-only {
	background-color:transparent;border:none;
	box-shadow:none;
}
.input:required {
	border-left: 5px solid rgba(5,200,100,0.5);
}

.input_select {
	background-color:rgba(255,255,255,0.8);
	border: 1px solid #ddd;
	padding:1em;
	margin:4px;
	border-radius:5px;
}



.input_select::selection {
	border: 1px solid blue;
}





.input2 {
	transition: all 500ms 100ms ease; 
	background-color:rgba(220,220,220,0.25);
	border: 1px solid #aaa;
	padding:0.5em;
	text-shadow:0px 0px 5px rgba(0,0,0,0.1);
	box-shadow: 1px 2px 4px rgba(100,100,100,0.1) inset;

}

.input2:hover {
	background-color:rgba(128,128,128,0.1);
	border: 1px solid #bbb;
	box-shadow: 2px 2px 8px rgba(128,128,128,0.15) inset;

}
.input2:focus {
	background-color:rgba(128,128,128,0.1);
	border: 1px solid orange;

}
.input2:placeholder-shown { color:black; }

.input3 { 
	padding:10px; 
	background-color:#fff;
	color:black; font-weight:bold;
	text-shadow:0px 0px 6px #eee;
	margin:3px 2px;
	border:1px solid #ddd;
	border-radius:3px;
}
.input3:focus {
	background-color:rgba(128,128,128,0.1);
	box-shadow: 2px 2px 8px rgba(128,128,128,0.2) inset;
	text-shadow:0px 0px 5px rgba(0,0,0,0.1);
	border:1px solid transparent;
}

.input3:placeholder-shown { color:#fafafa; font-style:italic; }


.input3_2 { 
	padding:8px; 
	background-color:rgba(128,128,128,0.1);
	box-shadow: 2px 2px 8px rgba(128,128,128,0.4) inset;
	text-shadow:0px 0px 5px rgba(0,0,0,0.1);
	color:black; font-weight:bold;
	text-shadow:0px 0px 6px #eee;
	margin:4px;
	border:1.5px solid #555;
	border-radius:4px;
 letter-spacing:0.1em; 
}
.input3_2:focus {
	background-color:rgba(255,255,255,0.2);
	border:1.5px solid #aaa;
}

.input3_2:placeholder-shown { color:#fafafa; font-style:italic; }



.input4 {
	background-color:rgba(0,0,0,0.02) ;
	border: 1px dashed rgba(0,0,0,0.1) ;
	padding:8px;
	margin:3px;
	border-radius:3px;
}
.input4:hover {
	background-color:rgba(0,0,0,0.05) ;
	box-shadow:0px 0px 5px rgba(0,0,0,0.1) inset ;
	border: 1px solid orange;
}
.input4:read-only {
	background-color:transparent;border:none;
	box-shadow:none;
}

.input4_2 {
	background-color:rgba(0,0,0,0.03) ;
	border: 1px solid rgba(0,0,0,0.02) ;
	padding:8px;
	margin:3px;
	border-radius:3px;
    transition: .4s;
}


.input4_2:hover {
	background-color:rgba(0,0,0,0.1) ;
	box-shadow:0px 0px 5px rgba(0,0,0,0.2) inset ;
	border: 1px solid orange;
}

.input5 {
	background-color:#e5eaf0;
	color:#476282;
	border:none;
	padding:0.5em 1em ;
	margin:3px;
	transition: .4s;
}

.input5:hover {
	box-shadow: 0px 0px 5px  rgba(0,150,250,0.3) ,0px 0px 5px rgba(0,0,250,0.3) inset;
	filter:contrast(105%);
}



.input8{
	padding: 0.5em 1em;
	color:#555;
	text-decoration: none;



	text-shadow: 0px 1px 0px #eee;
	background: #fbfaf4;
	background: -webkit-gradient(linear, left top, left bottom, from(#fbfaf4), to(#ece8e6));
	background: -moz-linear-gradient(top,  #fbfaf4,  #ece8e6);
	background: -o-linear-gradient(top,  #fbfaf4,  #ece8e6);
	background: linear-gradient(top,  #fbfaf4,  #ece8e6);
	border: 1px solid #dcd9d8;
	border-bottom: 1px solid #c1c1bd;
	-webkit-box-shadow:  0 0 5px #c7c5c1;
	-moz-box-shadow:  0 0 5px #c7c5c1;
	box-shadow:  0 0 5px #c7c5c1;

	border-radius: 5px;
	cursor:pointer;
}
.input8:hover {
	color:black;
	text-shadow:0px 0px 5px skyblue;
	background: #eee;
}
.input8:active{  /* クリック時 */

	-webkit-box-shadow:  0 1px 1px #cccbc9, inset 0 1px 1px rgba(0, 0, 0, 0.3);
	-moz-box-shadow:  0 1px 1px #cccbc9, inset 0 1px 1px rgba(0, 0, 0, 0.3);
	box-shadow:  0 1px 1px #cccbc9, inset 0 1px 1px rgba(0, 0, 0, 0.3);
}


.input_success{ background-color:skyblue;box-shadow:0px 0px 30px skyblue; }
.input_error{ background-color:pink; }



/* UL */



.ul_rad li{
	padding:10px;border-radius:50%;min-width:3em;
	background-color:#111;text-align:center;
	display:inline-block;color:white;z-index:5;opacity:0.9;text-decoration:none;
	margin:5px;
	 vertical-align: middle;

}
.ul_rad li:hover{
	padding:10px;border-radius:50%;min-width:3em;

	text-align:center;
	display:inline-block;color:white;
	z-index:5;opacity:0.5;text-decoration:none;
	background-color:#ccc; color:#000;
	margin:5px;
	vertical-align: middle;

}
.ul_rad li:first-letter{
    font-size: large;
    padding-right:0.1em;

}


.ul_rad li a { text-decoration:none ; color:white; }


.lh110 { line-height:110%; }
.lh120 { line-height:120%; }
.lh150 { line-height:150%; }
.lh180 { line-height:180%; }
.lh200 { line-height:200%; }
.ls110 { letter-spacing:0.1em; }
.ls120 { letter-spacing:0.2em; }
.ls150 { letter-spacing:0.5em; }


.title_black {
	padding:3px 10px 3px 0px;
	margin-left:-10px;
	margin-top:10px;
	color:white;
	overflow:hidden;
		
	letter-spacing: 0.3em;
	color:black;
	border-bottom:3px solid #999 ;
	font-weight:bold;
	min-width:200px;
	clear:both;
/*	
	margin:0px -20px ;
	background-color:#243c54;

	box-shadow:-5px 0px 5px #aaa;
*/
}





/*### TABLE */

tbl thead { background-color:unset; }


table.tbl {
	border-collapse:collapse;
	margin:0 auto;
	border-radius:3px;
	overflow:hidden;
	border:1px solid #ccc;
	background-color:rgba(255,255,255,0.3);
}
table.tbl th {
	margin:4px;
	padding:8px 12pt;
	vertical-align:middle;
	border-bottom:1px solid #eee;
	border-right:none;
	font-weight:normal;
}
table.tbl td {
	padding:0.4em;
	vertical-align:top;
	border-right:1px solid #eee ;
	border-bottom:1px solid #eee ;
}


table.tbl2 {
	border-collapse:collapse;
	border-spacing: 2px;
	margin:auto;

}

.tbl_zig tr:nth-child(2n) td {
	
}
.tbl_zig tr:nth-child(2n+1) td, .tbl_zig tr:nth-child(2n+1) th{
	background-color:rgba(0,0,0,0.03);
}
.tbl_zig tr:nth-child(2n+1) th{
	background-color:rgba(0,0,0,0.04);
}

table.tbl2 th {
	font-weight:normal;
	padding:10px 3px;
	vertical-align:middle;
}
table.tbl2 td {
	padding:10px 3px;
	vertical-align:middle;
	white-space:normal;

}
table.tbl2 tr {
	border-bottom : 1px solid #ccc;
}
table.tbl2 tr:last-child {
	border-bottom : none;
}


table.tbl2_2 {
	border-collapse:collapse;
	border-spacing: 1px;
	margin:auto;

}

table.tbl2_2 tr{
	border-top : 1px dashed #ccc;
}
table.tbl2_2 tr:last-child{
	border-bottom : 1px dashed #ccc;
}
table.tbl2_2 th {
	font-weight:normal;
	font-size:small;
	padding:10px 5px;

	vertical-align:top;
	color:rgba(0,0,0,0.5);

}
table.tbl2_2 td {
	padding:10px 5px;
	vertical-align:top;
	white-space:normal;

}


.tbl3 {
	border-collapse:separate;
	border-spacing: 0px;
	margin:auto;
}

.tbl3 thead { background-color:transparent;  }

.tbl3 th {
	font-weight:normal;
	padding:5px;
	vertical-align:top;
}

.tbl3 td {
	padding:5px;
	vertical-align:top;
}



table.tbl4 {
	border-collapse:collapse;
	border-spacing: 2px;
	border:1px solid #ddd;
	box-shadow:0px 0px 6px #;
	margin:auto;
}
table.tbl4 th {
	font-weight:normal;
	background-color:#f0f0f0;
	border-top : 1px solid #ddd;
	border-right : 1px solid #eee;
	padding:10px 5px;
	vertical-align:middle;
}
table.tbl4 td {
	background-color:rgba(255,255,255,0.7);
	padding:10px 5px;
	vertical-align:middle;
	border-top : 1px solid #ddd;
	border-right : 1px solid #eee;
}



table.tbl4_2 {
	border-collapse:collapse;
	margin:auto;
	background-color:rgba(255,255,255,0.1);

}
table.tbl4_2 tr {
	border-top : 1px solid #ddd;
}
table.tbl4_2 tr:first-child {
	border-bottom : none
}
table.tbl4_2 th {
	background-color:rgba(100,100,100,0.05);
	font-weight:normal;
	padding:8px 8px;
	color:#777;
	font-size:small;
}
table.tbl4_2 td {
	padding:8px 8px;
	border-left:1px solid #ddd;
}



table.tbl5 {
	border-collapse:collapse;
	border-spacing: 1px;
	margin:auto;
	background-color :  rgba(100,100,100,0.01);
	border-radius:5px;
	border:none;
}
table.tbl5 tr {
	border-top : 2px solid rgba(255,255,255,0.5);
	border-right:none;
}

table.tbl5 th {
	padding:10px 10px;
	vertical-align:middle;
	font-weight:normal;
}
table.tbl5 td {
	border-right :2px solid rgba(255,255,255,0.5);
	padding:8px;
	vertical-align:middle;

}




.tbl6 {
	border-collapse:collapse;
	border-spacing: 2px;
	box-shadow:0px 0px 6px #eee;
	margin:auto;
}
.tbl6 tr {

}
.tbl6 th {
	font-weight:normal;
	border-top : 1px solid #ddd;
	border-right : 1px solid #eee;
	padding:10px 5px;
	vertical-align:top;
}
.tbl6 td {
	background-color:rgba(255,255,255,0.4);
	padding:10px 5px;
	vertical-align:top;
	border-top : 1px solid #ddd;
	border-right : 1px solid #eee;
}


.tbl7 {
	border-collapse:collapse;
	border-spacing: 2px;
	margin:auto;
		border: 1px solid #2e6eac;
}
.tbl7 tr {
}
.tbl7 th {
	font-weight:normal;
	padding:10px 5px;
	vertical-align:middle;
	background-color:#4e8ecc;
	color:white;
}
.tbl7 td {
	padding:10px 5px;
	vertical-align:middle;
	color:#2e6eac;
}




.tbl_list {
	border-collapse:collapse;
	background-color:rgba(255,255,255,0.3);
}
.tbl_list tr { border-bottom:1px solid #eee;}
.tbl_list tr:last-child { border-bottom:none;}
.tbl_list th { padding:0.5em; vertical-align:top;   }
.tbl_list td { padding:0.5em;  vertical-align:top; }

.tbl_list2 {
	border-collapse:collapse;
	border-spacing: 15px;

}
.tbl_list2 tr { border-bottom:1px solid #ddd;}
.tbl_list2 tr:last-child { border-bottom:none;}
.tbl_list2 th { padding:1em; vertical-align:top; font-weight:normal; color:#7f7f7f;  }
.tbl_list2 td { padding:1em;  vertical-align:top; }




.tbl_stat {
	border-collapse:collapse;
	border-spacing: 2px;
	margin:auto;
	background-color:#eee;
}
.tbl_stat th {
	font-weight:normal;
	border-right : 1px dotted #eee;
	padding:8px 8px;
	vertical-align:middle;
}
.tbl_stat td {
	background-color:rgba(255,255,255,0.5);
	padding:10px 5px;
	vertical-align:middle;
	border-top : 1px dashed #ddd;
	border-right : 1px dashed #eee;
}



.tbl_stat2 {
	border-collapse:collapse;
	border-spacing: 1px;
	margin:auto;
}
.tbl_stat2 th {
	font-weight:normal;
	border-right : 1px dotted #eee;
	padding:4px;
}
.tbl_stat2 td {
	padding:4px;
	border-top : 1px dashed #ddd;
	border-right : 1px dashed #ddd;
}



.tbl_excel { border-collapse:collapse;  text-align: center; margin:auto; empty-cells:show;}
.tbl_excel th { background-color:#207245; color:white; text-align:center;font-weight:bold ; border: 1px solid #106225; padding:0.3em 0.5em;   }
.tbl_excel td {  border: 1px solid #aaa; padding:0.3em  0.8em; empty-cells:show;}



.tbl_scroll {
	clear:both;
	overflow: auto;
}
.tbl_scroll::-webkit-scrollbar {
  height: 5px;
}
.tbl_scroll::-webkit-scrollbar-track {
  border-radius: 5px;
  background: #eee;
}
.tbl_scroll::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background: #666;
}








/*### ANIME */
.anime {
    -moz-transition: all 0.5s ease 0s ;
    -webkit-transition: all 0.5s ease 0s ;
    -o-transition: all 0.5s ease 0s ;
    -ms-transition: all 0.5s ease 0s ;
}


.anime li {
    -moz-transition: all 0.5s ease 0s ;
    -webkit-transition: all 0.5s ease 0s ;
    -o-transition: all 0.5s ease 0s ;
    -ms-transition: all 0.5s ease 0s ;
}

.anime2 {
    -moz-transition: all 0.2s ease 0s ;
    -webkit-transition: all 0.2s ease 0s ;
    -o-transition: all 0.2s ease 0s ;
    -ms-transition: all 0.2s ease 0s ;
}

.anime3{
  background:#ff6a69;
  color:#FFF;
  animation: anime3 1.5s ease infinite alternate;
}
@keyframes anime3 {
	20% { transform: scale3d(1.3, 0.7, 1); }
	40% { transform: scale3d(0.7, 1.3, 1); }
	60% { transform: scale3d(1.1, 0.8, 1); }
	80% { transform: scale3d(0.8, 1.1, 1); }
	100%{ transform: scale3d(1, 1, 1); }
}

.anime4{
	color:#aaa;
	animation:5s ease-in 1s infinite alternate forwards running anime4;
}

@keyframes anime4{
	0%{  background:transparent;  color:#aaa;}
	20%{ background:pink; color:#fff; }
	40%{ background:gold; color:#fff; }
	60%{ background:tomato; color:pink; }
	80%{ background:gold; color:#fff; }
	100%{ background:tomato; color:#fff; }
}

/*

.hover_big:hover { font-size:x-large;; }


/*### VIDEO */
.play_movie:hover { filter:alpha(opacity=70);opacity:0.70;-moz-opacity:0.70; color:black;}

*/
/*### GRA */
.gra1  {
	/*グラデーションの設定*/
	background: -webkit-linear-gradient(top, #cccccc 0%, #f9f9f9 30%);
	background: -moz-linear-gradient(top, #cccccc 0%, #f9f9f9 30%);
	background: -o-linear-gradient(top, #cccccc 0%, #f9f9f9 30%);
	background: -ms-linear-gradient(top, #cccccc 0%, #f9f9f9 30%);
	background: linear-gradient(top, #cccccc 0%, #f9f9f9 30%);
	border:1px solid #f9f9f9;
}
.gra2 {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.94, #f5f5f5), color-stop(0.00, #e6e6e6));
	background: -webkit-linear-gradient(top, #e6e6e6 0%, #f5f5f5 94%);
	background: -moz-linear-gradient(top, #e6e6e6 0%, #f5f5f5 94%);
	background: -o-linear-gradient(top, #e6e6e6 0%, #f5f5f5 94%);
	background: -ms-linear-gradient(top, #e6e6e6 0%, #f5f5f5 94%);
	background: linear-gradient(to bottom, #e6e6e6 0%, #f5f5f5 94%);

}
.gra3 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,131313+40,595959+80,666666+100,474747+100 */
	background: #000000; /* Old browsers */
	background: -moz-linear-gradient(top,  #000000 0%, #131313 40%, #595959 80%, #666666 100%, #474747 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #000000 0%,#131313 40%,#595959 80%,#666666 100%,#474747 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #000000 0%,#131313 40%,#595959 80%,#666666 100%,#474747 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#474747',GradientType=0 ); /* IE6-9 */

}

/*### UL PAGER */


.ul_pager {
	margin:8px 4px;
	text-align:center;
	clear:both;
}

.ul_pager li {
	display:inline-block;
	cursor:pointer;
	font-size:14pt;
	margin:1px;
	border-radius:4px;
}
.ul_pager li:hover{
}

.ul_pager a {
	padding:2px 8px;
	color:#bbb;
	text-decoration:none;
}

.ul_pager .select{
	padding:2px 8px;
	color:#333;
	background-color:rgba(0,0,0,0.03);
}

.ul_pager a:hover{
	color:black;
}




/*### UL LI */



.ul_tag li {
	display:inline-block;
	border:1px solid #eee;
	padding:4px 4px;
	margin:3px 3px;
	border-radius:3px;
	color:black;
	background-repeat: no-repeat;
	background-image:url('/icon/tag_16.png') ;
	background-position-x:5px;
	background-position-y:5px;
	text-indent:20px;
}

.ul_tag li:hover {
	background-color:skyblue;
	color:black;
	
}

.ul_tag li a {
	text-decoration:none;
	color:black;
}

.li_none {
	background-image:none;	
}


/*
.lbl_no {
	border-radius:5px;letter-spacing:0.3em; padding:3px 10px;min-width:8em;;
	background-color:rgba(200,100,100,0.5);color:brown;

}
*/



.zoom120:hover {
	transform: scale(1.2);	/*画像の拡大率*/
	transition-duration: 0.5s;	/*変化に掛かる時間*/
}




.ul_tag5 li {
	display:inline-block;
	padding:4px;
	margin:2px;
	border-radius:5px;
}


.ul_tag2 li {
	display:inline-block;
	padding:4px;
	margin:2px;
	border-radius:5px;
}

.ul_tag2 li:hover {
	background-color:rgba(255,255,255,0.3);
	color:black;
	
}
.ul_tag2 li a {
	text-decoration:none;
	display:block;
}
.ul_tag2 li a:hover {
	text-decoration:underline;
}
.ul_tag2 li a::after {

}


.ul_tag2_2 li {
	display:inline-block;
	border:1px solid #eee;
	padding:4px 4px;
	margin:1px 2px;
	border-radius:3px;
	color:black;
	background-color:#f7f3ef;
}

.ul_tag2_2 li:hover {
	background-color:skyblue;
	color:black;
	
}
.ul_tag2_2 li a {
	text-decoration:none;
	display:block;
	color:black;
}


.ul_tag2_3 li {
	display:inline-block;
	padding:4px;
	margin:2px;
	border-radius:5px;
}


.ul_tag2_3 li a {
	text-decoration:none;
	display:block;
}



ul.ul_tag3  {
	display:inline-block;
	margin:0.5em 0.5em;
}

.ul_tag3 li {
	display:inline-block;
	padding:3px 6px;
	margin:5px 0 0 0;
	border-radius:5px;

}
.ul_tag3 li:first-child {}
.ul_tag3 li a { text-decoration:none; display:block; }
/*
.ul_tag3 li a::before  { content:"▶ "; color:#eee; font-size:x-small;}
*/
.ul_tag3 li:hover {
	background-color:#eee; color:black; 
	text-decoration:underline;
}
.ul_tag3 li.select a {
	border-radius:5px;
	padding:3px 6px;
	margin:3px 0;
	color:#fff;
	background-color:#001871;
}


.ul_tag6 { padding:2px; }
.ul_tag6 li {
	display:inline-block;
	padding:0.3em 0.3em ;
	margin:3px 0px;
}
.ul_tag6 li:first-child {border-left:none;}
.ul_tag6 li:hover {
	background-color:#ddeeff;
	color:black;
}
.ul_tag6 li a {
	text-decoration:none;
	color:black;
}
.ul_tag6 li.li_select2{
	text-decoration:none;
	color:blue;
	background-color:#ddeeff;
	box-shadow:none;
}
.ul_tag6 li::before  {
	content:"▶"; color:#aaa;font-size:small;
}




.first_letter:first-letter {
	font-size:large;;
	
}


.ul_hash li {
	display:inline-block;
	padding:2px 5px;
	margin:1px;
	border-bottom:1px solid transparent;
}
.ul_hash li:before {
	  content:"#"; color:#ccc;
}
.ul_hash li:hover {
	border-bottom:1px solid #aaa;
}
.ul_hash li a {
	text-decoration:none;
}
.ul_hash li.select { background-color:rgba(180,100,100,0.2); border-radius:5px; }


.ul_hash2  { }

.ul_hash2 li {
	display:inline-block;
	padding:4px 8px;
	border-radius:8px;
}

.ul_hash2 li:before {
	content:"# "; color:rgba(0,0,0,0.1);
}
.ul_hash2 li a:hover {
	background-color:rgba(0,0,0,0.05);
}
.ul_hash2 li a {
	text-decoration:none;
}
.ul_hash2 li a:hover {
	color:#333;
}




.ul_hash3 { margin:0.5em; auto; }

.ul_hash3 li {
	background: rgba(255,255,255,0.1);
	border:1px solid #ddd; 
	display:inline-block;
	border-radius:20px;
	margin:0.2em; padding:0.2em 1em;
	min-width:4em;
	text-align:center;
}
.ul_hash3 li.select {  }
.ul_hash3 li:hover { border:1px solid #476282;}
.ul_hash3 li a {text-decoration:none;display:block;}
.ul_hash3 li a:hover { cursor:pointer;box-shadow:0px 0px 10px rgba(0,0,0,0.1);}
.ul_hash3 li.select { border:1px solid #476282; }



.ul_flag {
	all:initial;
}
.ul_flag li{ display:inline-block; margin:2px;padding:2px 4px; }


.ul_square li { display:inline-block; 
padding: 2px; margin:0;
}
.ul_square li a { text-decoration:none;display:block;color:white; background-color:#FF9100; 
border-radius:40%;padding:10px;
	box-shadow:3px 3px 5px #ddd;
}
.ul_square li a:after { content:"~"; color:rgba(0,0,0,0.5); font-size:10pt; color:white;}
.ul_square a:hover { text-decoration:none; background-color:rgba(150,20,10,0.4);}
.ul_square li.select{ background-color:rgba(150,20,10,0.4);}


/*
.ul_pankuzu  { margin:0 0 1em 0;}
.ul_pankuzu li {
	display:inline-block;
	color:#999;
	font-size:10pt;
	margin:0.1em 0.1em;
}
.ul_pankuzu li a {
	border-radius: 5px 10px 5px 5px ;
	border-bottom:1px solid #eee;
	padding:0.3em 0.6em 0.3em 0.6em; 
	background-color:#eee; text-decoration:none; display:block; color:#666;
	background: -moz-linear-gradient(right, rgba(253,252,250,1) 0%, rgba(240,240,240,1) 100%);
	background: -webkit-linear-gradient(right, rgba(253,252,250,1) 0%,rgba(240,240,240,1) 100%);
	background: linear-gradient(to left, rgba(253,252,250,1) 0%,rgba(240,240,240,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdfcfa', endColorstr='#fff',GradientType=1 );	
	
	 }
.ul_pankuzu li:hover a{  }
.ul_pankuzu li a:hover { color:black; background-color:rgba(0,0,0,0.1); text-decoration:underline; }
*/


.ul_pankuzu  { margin:0 0 1em 0;}
.ul_pankuzu li {
	font-size:12pt;
	display:inline-block;
	margin:0.3em 0.3em;
}
.ul_pankuzu li a {
	border-radius: 5px 10px 5px 5px ;
	border-bottom:1px solid #eee;
	
}

.ul_pankuzu li:first-child:before {
	content:'';
}
.ul_pankuzu li:before {
	content:' / '; color:silver;
}
.ul_pankuzu li:hover a{  }
.ul_pankuzu li a:hover { color:black; background-color:rgba(0,0,0,0.1); text-decoration:underline; }





.ul_navi { margin:0 5px; }
.ul_navi li {
	background-color:rgba(255, 255, 255, 0.5);
	display:inline-block;
	padding:4px 4px;
	border-radius:3px;
	color:#666;
	text-align:center;
}
.ul_navi li:hover {
	background-color:rgba(0,0,0,0.1);
}
.ul_navi li a {
	text-decoration:none;
}


li.li_select{
	background-color:rgba(0,0,0,0.1);
	opacity:0.8;

}
.hover_select:hover{
	background-color:skyblue;
	background-repeat: no-repeat;
	box-shadow:0px 0px 15px skyblue;
	border:none;
	border-radius:5px;
	opacity:1;

}


.ul_menu { 
	box-shadow:0px 0px 5px #ddd;
	border-bottom:1px solid #ddd;
	
	color:black;
	margin-bottom:1em;
	white-space:nowrap;	
	background-color:rgba(255,255,255,0.5);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter:blur(5px);
}

.ul_menu::-webkit-scrollbar  { height:8px; background-color:#e9e6e5;   }
.ul_menu::-webkit-scrollbar-track { border-radius: 15px; background-color:transparent  }
.ul_menu::-webkit-scrollbar-thumb { background-color:#d9d6d5; }
.ul_menu:hover::-webkit-scrollbar { height: 8px; background-color: rgba(50, 50, 50, .1);   }
.ul_menu:hover::-webkit-scrollbar-thumb { background-color: rgba(50, 50, 50, .1); border-radius: 15px;box-shadow:0 0 0 1px rgba(50, 50, 50, .3); }


.ul_menu:hover { 
	/* color:#777; 	background-color:#e9e6e5;*/
}


.ul_menu li {
	display:inline-block;
	text-shadow:0px 0px 2px #aaa;
	padding:4px 12px;
	margin:0px;
	border-right:1px solid #eee;
	border-bottom:5px solid transparent;
}
.ul_menu li:last-child { border-right:none; }
.ul_menu li.li_select {
	font-weight:normal;
	border-bottom:5px solid #476282 ;
}
.ul_menu li.li_select a{
}

.ul_menu:hover li{ 
	/* background-color:#e9e6e5; */
}
.ul_menu li:hover {
	background-color:rgba(0,0,0,0.03);
	border-bottom:5px solid #476282 ;

}

.ul_menu li a {
	text-decoration:none;
	display:block;
}


.ul_menu .ul_menu_sub { display: none; }

.ul_menu_sub {
	position: fixed;
	top:40px;
	left:15%;
	right:15%;
	padding:1em;
	z-index:9999;
	border-radius:10px;
	box-shadow:0px 0px 10px #ccc;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter:blur(4px);
	
	background-color:rgba(255,255,255,0.95);

}
.ul_menu_sub li {
	border-bottom:3px solid transparent;
	display: block;
	background-color:unset;
	border-right:none;
	text-align:left;
	z-index:999;
}

.ul_menu_sub li:hover {
	border-bottom:3px solid transparent;
	background-color:transparent;
}


.ul_menu2 { 
	display:flex;
	white-space:nowrap;	
	justify-content:center;
	align-items:stretch;
	background-color:rgba(255,255,255,0.7);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter:blur(5px);

	white-space:nowrap;	
	box-shadow:0px 0px 5px #ddd;
	border-bottom:1px solid #ddd;
	color:#333;
}

/*
@media screen and (max-width:800px)
{
	.ul_menu2 { 
		justify-content:start;
		overflow-x:scroll;
		-webkit-overflow-scrolling:touch;
		overflow-scrolling:touch;
		white-space:nowrap;
	}
}
*/

.ul_menu2 > li {
	border-bottom:5px solid transparent ;
	padding:1px 10px;
	margin:0px;
	cursor:pointer;
	font-size:8pt;
}

.ul_menu2 > li a {
	color:#333;
}


.ul_menu2 > li:hover {
		background-color:rgba(0,50,100,0.1);
}

.ul_menu2 > li > a{
	text-decoration:none;
	display:block;
}
.ul_menu2 > li > a:hover{
}
.ul_menu2 li.li_select {
	border-bottom:5px solid #476282 ;
}

.ul_menu2_sub > ul{
	margin:auto;
	padding:20px 10px;
	max-height:60vh;
	background-color:rgba(250,250,250,0.95);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter:blur(5px);

	box-shadow:0px 8px 5px rgba(100,100,100,0.2);

}



@media screen and (max-width:1024px)
{
	.ul_sp {
		overflow-x:scroll;
		-webkit-overflow-scrolling:touch;
		overflow-scrolling:touch;
		white-space:nowrap;		
	}
}



.ul_list { transition: .4s;}

.ul_list li {
	overflow:hidden;
	padding:10px;
	border-bottom:1px solid #ddd;
}

.ul_list li:hover {
	background-color:#eee;
}

.ul_list li.select {
	background-color:rgba(0,0,0,0.02);
}
.ul_list li:hover {
	background-color:#eee;
}



.ul_list2 li {
	padding:8px;
	border-top:1px solid #ddd;
}
.ul_list2 li:hover {	background-color:rgba(0,0,0,0.03); }
.ul_list2 li.select { background-color:#f0f0f0;}
.ul_list2 li a { }
.ul_list2 li:last-child{ border-bottom:none ; }



.ul_list3 li { padding:8px 8px ; }
.ul_list3 li a{ color:#555; text-decoration:none; display:block;}
.ul_list3 li:hover {	background-color:rgba(0,150,250,0.1);  }
.ul_list3 li:hover a{	color:midnightblue; }
.ul_list3 li.select { background-color:#f0f0f0;}
.ul_list3 li a { }
.ul_list3 li:last-child{ border-bottom:none ; }


/*### PC */
@media screen and ( min-width: 771px )
{

	.ul_list3_sp li { padding:8px 8px ; }
	.ul_list3_sp li a{ color:#555; text-decoration:none; display:block;}
	.ul_list3_sp li:hover {	background-color:rgba(0,150,250,0.1);  }
	.ul_list3_sp li:hover a{	color:midnightblue; }
	.ul_list3_sp li.select { background-color:#f0f0f0;}
	.ul_list3_sp li a { }
	.ul_list3_sp li:last-child{ border-bottom:none ; }


}

@media screen and (max-width:770px)
{

	.ul_list3_sp  { text-align:center; display:flex;}
	.ul_list3_sp li { padding:8px 8px ; display:inline-block; }
	.ul_list3_sp li a{ color:#555; text-decoration:none; display:block;}
	.ul_list3_sp li:hover {	background-color:rgba(0,150,250,0.1);  }
	.ul_list3_sp li:hover a{	color:midnightblue; }
	.ul_list3_sp li.select { background-color:#f0f0f0;}
	.ul_list3_sp li a { }
	.ul_list3_sp li:last-child{ border-bottom:none ; }


}



.ul_zig li:nth-child(2n+1) {
	background-color:rgba(0,0,0,0.02);
}
.ul_zig li:nth-child(2n+1) th{
	background-color:rgba(0,0,0,0.05);
}


.ul_info {
	margin:0.5rem 0.5rem 1rem 0.5rem;
	

}
.ul_info li {
	overflow:hidden;
	padding:0.4rem

}




.ul_hover li:hover { background-color:rgba(100,100,100,0.5); }

.ul_flex {
	display: flex;
	flex-wrap: wrap;
	align-items: top;
	justify-content: center;
	box-sizing: border-box;
	flex-direction:row;
	flex-wrap: wrap;
	margin:0.5em ;
}
@media screen and ( min-width: 641px )
{
	.ul_flex li { width: 180px; border-bottom:1px solid #ccc;border-right:1px solid #ccc;  margin: 0.5em; padding:0.4em; min-height:4em; }
/*	.ul_flex li { width: calc(24% - 10px); 	border-bottom:1px solid #ccc;border-right:1px solid #ccc;  margin: 0.5em; min-height:16em; } */
}
@media screen and (max-width:640px)
{
	.ul_flex li { width:100%; border-bottom:1px solid #ccc;border-right:1px solid #ccc; margin: 0.5em;  padding:0.4em; min-height:4em; }
}
.ul_flex li:hover { box-shadow: 0px 0px 15px rgba(3,3,3,0.3);}


.ul_flex2 {
	display: flex;
	flex-wrap: wrap;
	align-items: top;
	justify-content: center;
	box-sizing: border-box;
	flex-direction:row;
	flex-wrap: wrap;


}
.ul_flex2 li {
	min-width:100px;
	max-width:100%;
	display:inline-block;
	padding:0.3em 1em;
	vertical-align:middle;
	margin:0.1em;
}

.ul_flex2 li:hover {
	background-color:rgba(0,0,0,0.04);
}
.ul_flex2 li:first-child {
}


.ul_flex3 {
	display: flex;
	box-sizing: border-box;
	flex-wrap: wrap;
	align-items: top;
	justify-content: center;
	box-sizing: border-box;
	flex-direction:row;
	flex-wrap: wrap;
	margin:0.2em ;
}
.ul_flex3 li {
	
	margin: 0.2em; 
	padding:0.2em; min-height:2em;
}
.ul_flex3 li:first-child {
}




/*### DL DT DD */
dl.dl_tbl {

}
dl.dl_tbl dt {
  min-width : 100%;
	border-bottom:1px solid #ccc;
  font-weight : bold;
  text-indent : 5px;
	padding:5px;
	font-weight:bold;
	display:inline-block;
}
dl.dl_tbl dd {
  background-color : #fff;
  padding : 5px 5px 5px 25px;
}

.dl2 { text-align:left; }
.dl2 dt{ width:6em;clear: left;float:left; padding:5px; color:#ccc; font-size:small;}
.dl2 dt:before{ content:'・' }
.dl2 dd{ margin-left:7em;  padding:5px;}



.dl3  { margin: auto;; padding:0; display:inline-block; background-color:rgba(0,0,0,0.005); vertical-align:top; }
.dl3 dt { display:inline-block; padding:0.2em; margin-top:0.2em; letter-spacing:0.2em; vertical-align:top;font-weight:normal; }
.dl3 dd { display:inline-block; padding:0.2em; ;margin-top:0.2em;vertical-align:top;  }


.dl_list { overflow:hidden;clear:both;border-bottom:1px solid #eee;text-align:left;}
.dl_list dt{ padding:10px; display:inline-block;  color:#777; text-align:left; }
.dl_list dd{ padding:10px; float:right; text-align:right;font-weight:bold; }

/*### TAB */

.tab {overflow:hidden;}
/*
.tab li {background:#ccc; padding:5px 25px; float:left; margin-right:1px;cursor:pointer;}
.tab li.tab_select {background:#eee;}
*/
.tab_body {overflow:hidden; padding:3px;}
.tab_hide {display:none;}





	

.btn_long {
	display:inline-block;
	padding:10px ;
	margin:5px;
	cursor:pointer;
	min-width:300px;
	text-decoration:none;
	border:none;
}

.btn_long:hover {
	text-decoration:none;

}



.btn_order {
	display:inline-block;
	cursor:pointer;
	border:1px solid #aaa;
	border-radius:3px;

	margin:10px;
	color:#222;
	font-weight:bold;
	padding:0.5em 2em;
	text-align:center;
	min-width:120px;

	background: #ffaf4b;
	background: -moz-linear-gradient(top, #ffaf4b 0%, #ff920a 100%);
	background: -webkit-linear-gradient(top, #ffaf4b 0%,#ff920a 100%);
	background: linear-gradient(to bottom, #ffaf4b 0%,#ff920a 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffaf4b', endColorstr='#ff920a',GradientType=0 );
	
    box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
    transition: .4s;
}
.btn_order:hover {
	color:#000;
	
	background: #ffc57f;
	background: -moz-linear-gradient(top, #ffc57f 0%, #ff8c00 100%);
	background: -webkit-linear-gradient(top, #ffc57f 0%,#ff8c00 100%);
	background: linear-gradient(to bottom, #ffc57f 0%,#ff8c00 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc57f', endColorstr='#ff8c00',GradientType=0 );

}


.btn_order2 {
	display:inline-block;
	cursor:pointer;
	padding:0.5em 2em;
	color:#111;
	text-align:center;

    transition: .4s;
    border-radius:5px;
    
	background-color: #f3981d; 
	background-image: -webkit-linear-gradient(25deg,transparent 20%,rgba(255,255,255,.3) 40%,rgba(255,255,255,.3) 60%,transparent 60%);
	background-image:         linear-gradient(25deg,transparent 20%,rgba(255,255,255,.3) 40%,rgba(255,255,255,.3) 60%,transparent 60%);
	background-repeat: no-repeat;
	border:2px solid orange;
    box-shadow:  0 2px 3px rgba(0, 0, 0, 0.11);
    font-weight:bold;

}
.btn_order2:hover {
	filter:contrast(130%);
	border:2px solid orange;
	color:#222;
    box-shadow:none;
	
}


.btn_next2 {
	display: inline-block;
	padding: 0.5em 0.5em;
	text-decoration: none;
	color: #fa812b;
	border: solid 2px #fa812b;
	border-radius:  50px;
	transition: .4s;
	cursor:pointer;
	background: #fff;
	letter-spacing:0.2em;
}

.btn_next2:hover {

	background: #fff;
	border: solid 2px #f97212;
	text-decoration:none;
}


.btn_next3 {
	display: inline-block;
	padding: 0.5em 0.5em;
	text-decoration: none;
	color: #000;
	border: solid 2px #ffb300;
	border-radius:  50px;
	transition: .4s;
	cursor:pointer;
	background: #ffb300;
	letter-spacing:0.2em;
	box-shadow:0px 0px 10px #ccc;
}

.btn_next3:hover {
	box-shadow:none;
	color: #000;
	background: #ffc630;
	border: solid 2px #ffc630;
	text-decoration:none;
}

/*
.btn_insert {
	display: inline-block;
	padding: 0.2em 1.5em;
	text-decoration: none;
	color: rgba(255,255,255,0.8);
	border: solid 2px #375282;
	border-radius:  50px;
	transition: .4s;
	cursor:pointer;
	background: #375282;
	letter-spacing:0.2em;
}
.btn_insert:hover {
	background-color:#0080DE; /*rgba(55,155,255,0.2);*/
	color: white;
	text-shadow:0px 0px 5px #fff;
	box-shadow:10px 10px 15px inset rgba(200,200,250,0.2), 0px 0px 3px rgba(0,0,0,0.2);
	border: solid 2px #ffffff;

}
*/

.btn_insert:disabled {
	opacity:0.5;
	cursor:pointer;
}
.btn_insert:disabled:hover {
	box-shadow:none;
	text-shadow:none;
	border: solid 2px #eee;

}

.btn_insert2 {
	display: inline-block;
	padding: 0.2em 1.5em;
	text-decoration: none;
	color: rgba(255,255,255,0.8);
	border: solid 2px #eee;
	transition: .4s;
	cursor:pointer;
	background: #0094e4;
	letter-spacing:0.2em;
}
.btn_insert2:hover {
	background-color:#00BE02; /*rgba(55,155,255,0.2);*/
	color: white;
	text-shadow:0px 0px 5px #fff;
	box-shadow:10px 10px 15px inset rgba(200,250,200,0.2), 0px 0px 3px rgba(0,0,0,0.2);
	border: solid 2px #ffffff;

}



/*boot_strapとかぶるので*/

.btn2 {
	display:inline-block;
	text-decoration: none;
	color: #fff;
	background-color:#3879D9;
	border:none;
	padding:2px 4px;

}

.btn2:hover {
	background-color:#1859D9;
	color:white;
	cursor:pointer;
}



.btn3 {
	display:inline-block;
	text-decoration: none;
	color: rgba(30,30,60,0.6);
	filter:grayscale(30%);
	border:none;	
	padding:2px 4px;
	margin:1px;
	border-radius:4px;
	cursor:pointer;
	transition: all 0.5s 0s ease;

}

.btn3:hover {
	color: rgba(0,0,0,1);
	background-color:rgba(20,70,180,0.1);
}


.btn4 {
	display:inline-block;
	text-decoration: none;
	color: rgba(30,30,60,0.6);
	background-color:rgba(150,150,180,0.12);
	filter:grayscale(30%);
	border:none;	
	padding:2px 4px;
	margin:1px;
	border-radius:4px;
	cursor:pointer;
	transition: all 0.5s 0s ease;

}

.btn4:hover {
	color: rgba(0,0,0,1);
	background-color:rgba(20,70,180,0.2);
}



.hover_vivid {
	cursor:pointer;
	transition: all 0.5s 0s ease;
}

.hover_vivid:hover {
	 filter:brightness(170%)  ;
	 box-shadow:0px 0px 10px rgba(0,0,0,0.1);
}

div.bt{
	display:inline-block;
	padding:3px 6px;
	margin:5px;

	background: #fbfaf4;
	background: -webkit-gradient(linear, left top, left bottom, from(#e3dfde), to(#fbfaf4));
	background: -moz-linear-gradient(top,  #e3dfde,  #fbfaf4);
	background: -o-linear-gradient(top,  #e3dfde,  #fbfaf4);
	background: -ms-linear-gradient(top,  #e3dfde,  #fbfaf4);
	background: linear-gradient(top,  #e3dfde,  #fbfaf4);
	-webkit-border-radius: 15px; 
	-moz-border-radius: 15px;
	border-radius: 10px;

}




/*### BTN */
    

    
.btn_cart2 {
	position  : relative;
	text-align:center;
	display:inline-block;
	height: 50px;
	width:150px;
	border-radius: 10px;
	background-color:rgba(100,100,100,0.1);
	border-bottom: solid 2px #b5b5b5;
	
	background-image: url('/icon/cart2_45.png');
	background-repeat: no-repeat;
	background-position: 5px 5px;
	cursor:pointer;
}

.btn_cart2:hover {
	border-bottom: solid 2px transparent;

}


label.radio span{
	color:#444;
	padding: 0.5em;	
	min-width:4em;margin:3px;
	display: inline-block;	cursor: pointer;
	border:1px solid rgba(0,0,0, 0.3);
	color:rgba(0,0,0, 0.3);
	user-select: none;	border-radius:30px;
}

.radio span:hover{ filter:grayscale(0%) ; 	box-shadow: 0px 0px 10px 5px #ddeeff ; }
.radio input[type="radio"],		.radio input[type="checkbox"] {  border:none;display:none; }
.radio input[type="radio"]:checked + span,		.radio input[type="checkbox"]:checked + span {
	filter:grayscale(0%);
	color: rgba(0,0,255, 1);
	border: 1px solid rgba(0,0,255, 1);
	
	 font-weight:normal;
}


label.radio2  span{
	color:red;padding: 0.2em;	min-width:4em;margin:3px 1px;
	display: inline-block;	cursor: pointer;
	border:1px solid transparent; 
	background-color:rgba(0,0,0,0.01);
	user-select: none; border-radius:30px;
}
.radio2 span:hover{ filter:grayscale(0%) ; }
.radio2 input[type="radio"], .radio2 input[type="checkbox"] { border:1px solid transparent;  display:none; }
.radio2 input[type="radio"]:checked + span, .radio2 input[type="checkbox"]:checked + span {
	filter:grayscale(0%);
	border:1px solid transparent; 
	font-weight:normal;
	text-decoration:line-through;
}




label.radio3  span{
	padding: 4px 8px 0px 8px;
	min-width:3em;
	margin:0;
	display: inline-block;
	cursor: pointer;
	border-bottom:4px solid rgba(0,80,100,0.1);
	color:rgba(0,0,0,0.3);
	user-select: none;
}

/*
.radio3 input[type="radio"],		.radio3 input[type="checkbox"] {  border:none;display:none; }
.radio3 input[type="radio"]:checked + span,		.radio3 input[type="checkbox"]:checked + span {
	filter:grayscale(0%);
	border-bottom:4px solid #476282;
	font-weight:normal;
	color:#476282;
	box-shadow: 2px -8px 15px 3px rgba(255,255,255,0.2) ;
	
}
*/

.radio3 input[type="radio"],		.radio3 input[type="checkbox"] {  border:none;display:none; }
.radio3 input[type="radio"]:checked + span,		.radio3 input[type="checkbox"]:checked + span {
	filter:grayscale(0%);
	border-bottom:4px solid #476282;
	background-color:#476282;;
	font-weight:normal;
	color:#fff;
	box-shadow: 2px -8px 15px 3px rgba(255,255,255,0.2) ;
	
}




label.radio4 span{
	color:#444;
	padding: 0.3em 0.5em;	min-width:4em;margin:3px 1px;
	display: inline-block;	cursor: pointer;
	border:2px solid rgba(0,0,0,0.02);
	background-color:rgba(0,0,0,0.04);
	
	user-select: none;	border-radius:4px;
}

.radio4 span:hover{ filter:grayscale(0%) ; }
.radio4 input[type="radio"],		.radio4 input[type="checkbox"] {  border:none;display:none; }
.radio4 input[type="radio"]:checked + span,		.radio4 input[type="checkbox"]:checked + span {
	filter:grayscale(0%);
	font-weight:normal;
	
	border-radius:4px;
	border: 2px solid #0081f2; 

	background-color:#0081f2;
	color:#fff; 
}


/* レ */
label.check span{
	color:#999;
	padding: 2px 8px;	min-width:3em;
	display: inline-block;	cursor: pointer;
	border: 2px solid transparent;
	background-color:rgba(0,0,0,0);
	user-select: none;	border-radius:0px;
	border-radius:30px;
}
label.check span:hover{  }
label.check span::before{ content:'✔ '; color:#eee;font-size:large;   }
label.check span:hover::before{ color:#aaa; }
.check input[type="checkbox"] {  border:none;display:none; }
.check input[type="checkbox"]:checked + span {
	filter:grayscale(0%);
	color:#476282; border: 2px solid transparent; font-weight:normal;
	background-color:rgba(0,120,255,0.08);
}
.check input[type="checkbox"]:checked + span::before {
	color:#476282; 
}


/* ONOFF */


.check2  {
	background-color:rgba(100,100,100,0.05);
	border-radius:30px;
	padding:4px 8px;
	
}

label.check2  span{
	background-image:url(/icon/checkbox.png);
	user-select: none;
	padding-left:30px;
	display:inline-block;
	line-height:14px;
	background-repeat:no-repeat;
	background-position: 0 0;
	vertical-align:middle;
	cursor:pointer;
	color:#777;
}

.check2 span:hover{ filter:grayscale(0%) ; }
.check2 input[type="checkbox"] { border:none;display:none; }
.check2 input[type="checkbox"]:checked + span {
	background-position: 0 -14px;
	color:#333;
}






/*### RADIO */

.box_radio label span{
	padding: 0.3em 0.5em;
	min-width:4em;
	margin:5px 3px ;
	display: inline-block;
	cursor: pointer;
	border:1px solid rgba(0,0,0,0.01);
	background-color:rgba(0,0,0,0.02);
	user-select: none;
	border-radius:30px;
	
}

.box_radio span:hover{ filter:grayscale(0%) ; }
.box_radio input[type="radio"], .box_radio input[type="checkbox"] {  border:none;display:none; }
.box_radio input[type="radio"]:checked + span, .box_radio  input[type="checkbox"]:checked + span   {
	filter:grayscale(0%);
	border: 2px solid #00ccff;
	font-weight:normal;
	box-shadow: 0px 0px 4px 1px #eee, 2px 8px 15px 3px rgba(255,255,255,0.2) inset;
	background-color:rgba(0,0,255,0.05);
}


.box_radio label.silver span{ background-color:rgba(255,255,255,1);	border: 1px solid #8b98a8; color:#8b98a8;}
.box_radio label.brown span{ background-color:rgba(255,255,255,1);	border: 1px solid brown; color:brown; }
.box_radio label.red span{ background-color:rgba(255,255,255,1);	border: 1px solid brown; color:brown; }
.box_radio label.orange span{ background-color:rgba(255,255,255,1);	border: 1px solid orange; color:orange; }
.box_radio label.gold span{ background-color:rgba(255,255,255,1);	border: 1px solid orange; color:orange;}
.box_radio label.yellow span{ background-color:rgba(255,255,255,1);	border: 1px solid orange; color:orange; }
.box_radio label.blue span{ background-color:rgba(255,255,255,1);	border: 1px solid #3363ff; color:#3363ff; }
.box_radio label.green span{ background-color:rgba(255,255,255,1);	border: 1px solid #1bd2a4; color:#1bd2a4 }
.box_radio label.lime span{ background-color:rgba(255,255,255,1);	border: 1px solid #1bd2a4; color:#1bd2a4; }
.box_radio label.chocolate span{ background-color:rgba(255,255,255,1);	border: 1px solid #d2691e; color:#d2691e; }
.box_radio label.purple span{ background-color:rgba(255,255,255,1);	border: 1px solid #800080; color:#800080; }


.box_radio label.silver input[type="radio"]:checked + span,  label.silver input[type="checkbox"]:checked + span { background-color: #8b98a8	border: 1px solid  #8b98a8; color:white; }
.box_radio label.brown input[type="radio"]:checked + span,  label.brown input[type="checkbox"]:checked + span { background-color:brown;	border: 1px solid brown; color:white; }
.box_radio label.red input[type="radio"]:checked + span,  label.red input[type="checkbox"]:checked + span { background-color:brown;	border: 1px solid brown; color:white; }
.box_radio label.orange input[type="radio"]:checked + span,  label.orange input[type="checkbox"]:checked + span { background-color:orange	border: 1px solid orange; color:white; }
.box_radio label.gold input[type="radio"]:checked + span,  label.gold input[type="checkbox"]:checked + span { background-color:orange;	border: 1px solid orange; color:white; }
.box_radio label.yellow input[type="radio"]:checked + span,  label.yellow input[type="checkbox"]:checked + span { background-color:orange;	border: 1px solid orange; color:white; }
.box_radio label.blue input[type="radio"]:checked + span,  label.blue input[type="checkbox"]:checked + span {  background-color:#3363ff;	border: 1px solid #3363ff; color:white;  }
.box_radio label.green input[type="radio"]:checked + span,  label.green input[type="checkbox"]:checked + span { background-color:#1bd2a4;	border: 1px solid #1bd2a4; color:white; }
.box_radio label.lime input[type="radio"]:checked + span,  label.lime input[type="checkbox"]:checked + span { background-color:#1bd2a4;	border: 1px solid #1bd2a4; color:white; }
.box_radio label.chocolate input[type="radio"]:checked + span,  label.chocolate input[type="checkbox"]:checked + span { background-color:#d2691e;	border: 1px solid #d2691e; color:white; }
.box_radio label.purple input[type="radio"]:checked + span,  label.purple input[type="checkbox"]:checked + span { background-color:#800080;	border: 1px solid #800080; color:white; }

.box_radio label.blue input[type="radio"]:checked + span,  label.blue input[type="checkbox"]:checked + span { background-color:blue;	border: 1px solid blue; color:white; }


.box_radio2 label span{
	padding: 0.2em 0.7em;
	min-width:3em;
	margin:0;
	display: inline-block;
	cursor: pointer;
	border-bottom:2px solid rgba(0,0,0,0.1);
	color:rgba(0,0,0,0.3);
	user-select: none;
}

.box_radio2 span:hover{ filter:grayscale(0%) ; }
.box_radio2 input[type="radio"], .box_radio2 input[type="checkbox"] {  border:none;display:none; }
.box_radio2 input[type="radio"]:checked + span, .box_radio2  input[type="checkbox"]:checked + span   {
	filter:grayscale(0%);
	border-bottom:2px solid deepskyblue;
	font-weight:normal;
	background-color:rgba(0,0,0,0.02);
	color:rgba(0,0,0,0.8);
	box-shadow: 2px -8px 15px 3px rgba(255,255,255,0.2) ;
}


.box_radio_remove label span{
	padding: 0.5em 0.2em;
	margin:4px 1px;
	display: inline-block;
	cursor: pointer;
	text-shadow: 0px 1px 0px #eee;
	border:2px solid transparent;
	border-radius: 5px;
	background-color:rgba(0,0,0,0);
	user-select: none;
}
.box_radio_remove span:hover{ filter:grayscale(0%) ; }
.box_radio_remove input[type="radio"], .box_radio_remove input[type="checkbox"] {  border:none;display:none; }
.box_radio_remove input[type="radio"]:checked + span, .box_radio_remove  input[type="checkbox"]:checked + span   {
	border:2px solid transparent;
	filter:grayscale(0%) ;
	background: #ffdddd; 
	font-weight:normal;
	text-shadow:0px 0px 10px rgba(0,0,0,0.2);
	text-decoration:line-through;
	text-shadow:none;
}




.check_onoff {
	position:absolute; z-index:-1000; left:-1000px; overflow: hidden; 
	clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0;
}
.check_onoff + label.check_onoff_label {
	padding-left:30px;
	height:14px; 
	display:inline-block;
	line-height:14px;
	background-repeat:no-repeat;
	background-position: 0 0;
	vertical-align:middle;
	cursor:pointer;
}
label.check_onoff_label {
	background-image:url(/icon/checkbox.png);
	user-select: none;
}

.check_onoff:checked + label.check_onoff_label {
	background-position: 0 -14px;
}








.box_tab { }
.box_tab label span{
	padding: 5px 10px;
	margin:4px 0px;
	display: inline-block;
	cursor: pointer;
	text-shadow: 0px 1px 0px #eee;
	border-bottom2px dotted rgba(0,0,0,0.05);
	filter:grayscale(50%) ;
	user-select: none;
	text-align:center;
}
.box_tab span:hover{
	filter:grayscale(0%) ;
}
.box_tab input[type="radio"], .box_tab input[type="checkbox"] {  border:none;display:none; }
.box_tab input[type="radio"]:checked + span, .box_tab  input[type="checkbox"]:checked + span   {
	filter:grayscale(0%) ;
	background: rgba(255,255,255,0.3);
	border-bottom: 2px solid deepskyblue;
	font-weight:bold;

}



	
.box_check { text-align: center; 	vertical-align:middle; }

.box_check input[type="checkbox"] {
	display:inline-block;
	width: 30px;
	height: 30px;
	cursor: pointer;
	display: inline-block;
	transition: all 0.15s ease-out 0s;
	color: #ffffff; background: #d7d7d7; border: none;
	-webkit-appearance: none;
	appearance: none;
}
.box_check input[type="checkbox"]:hover { background: #a9a9d6; }
.box_check input[type="checkbox"]:checked { background: #3c4188; }
.box_check input[type="checkbox"]:checked::before {
	font-size: 25px;
	line-height: 30px;
	position: absolute;
	display: inline-block;
	width: 30px;
	height: 30px;
	content: '✔';
	text-align: center;
}
/*
.box_check input[type="checkbox"]:checked::after {
	position: relative;
	display: block;
	content: '';
	background: #3c41da;
}
*/




.box_check input[type="checkbox"].radio {
	border-radius: 50%;
}
.box_check input[type="checkbox"].radio::after {
	border-radius: 50%;
}
.box_check label {
	line-height: 30px;
}
.box_check input[type="checkbox"]:disabled {
	cursor: not-allowed;
	background: #b7b7b8;
}
.box_check input[type="checkbox"]:disabled::before {
	font-size: 20px;
	line-height: 30px;
	position: absolute;
	display: inline-block;
	width: 30px;
	height: 30px;
	content: '✖︎';
	text-align: center;
}


input[type="checkbox"].check_orange {}
input[type="checkbox"].check_orange:hover { background: #f0e68c; }
input[type="checkbox"].check_orange:checked { background: orange; }






/*### RADIO */

.ul_radio {
    margin:auto;

}
.ul_radio li {
	position:relative;
    cursor:pointer;
    list-style:none;
    margin-right:3px;
    margin-top:3px;
    overflow:hidden;
    display:inline-block;
}


.ul_radio label {
    display:inline-block;
    min-width:3em;
    text-align:center;
    background:#e5e5e5;
    padding:5px;
    cursor:pointer;
    border-radius:5px;
}

.ul_radio label:hover {
    background:#ddeeff;

}

.ul_radio input[type=radio] {
    position:absolute;
    opacity:0;
    width:100%;
    height:100%;
    margin:0;
    cursor:pointer;
}
.ul_radio input[type=radio]:checked {
    cursor:auto;
}
.ul_radio input[type=radio]:checked + label {
    color:white;
    text-shadow:0 -1px 0 rgba(0,0,0,0.2);
    background:darkorange;
 	box-shadow:0px 0px 3px orange;
}



.ul_radio input[type=checkbox] {
    position:absolute;
    opacity:0;
    width:100%;
    height:100%;
    margin:0;
    cursor:pointer;
}
.ul_radio input[type=checkbox]:checked {
    cursor:auto;
}
.ul_radio input[type=checkbox]:checked + label {
   color:white;
    text-shadow:0 -1px 0 rgba(0,0,0,0.2);
    background:orange;
}


.radio_ex { clear:both; }
.radio_ex input{ display: none; margin:0px;}
.radio_ex label{
	display: inline-block;
	cursor: pointer;
	margin: 0px -3px;
	padding: 10px;
	background: #eee;
	color: rgba(0,0,0,0.7);
	text-align: center;
	line-height: 1;
	transition: .1s;
/*	border-left:1px solid #ccc; */
	
}



.radio_ex label:first-of-type{
	border-left: 0px;
	border-radius: 5px 0 0 5px;
}
.radio_ex label:last-of-type{
	border-right: 0px;
	border-radius: 0 5px 5px 0;
}
.radio_ex input[type="radio"]:checked + label {
	background-color: #d0ccc9;
	color: #553333;
	text-shadow:0px 0px 3px #bbb;
	font-weight:bold;
}




.radio_ex2 { clear:both; }
.radio_ex2 input{ display: none; margin:0px;}
.radio_ex2 label{
	display: inline-block;
	cursor: pointer;
	margin: 0px;
	padding: 10px;
	background: rgba(0,0,0,0.05);
	color:  rgba(0,0,0,0.5);
	text-align: center;
	line-height: 1;
	transition: .1s;
	
}
.radio_ex2 input[type="radio"]:checked + label {
	background-color: #87cefa;
	color: #3333aa;
	text-shadow:0px 0px 3px #bbb;
	font-weight:bold;
}





.search_box {
	padding:5px;
	margin:5px 0px 10px 0px;

}


.search_box .search_box_text {
 height:30px;
 border:2px solid #ccc;
 text-indent:10px;
 background-color:#eee;

}
.search_box .search_box_btn {

 height:30px;
 width:45px;
 margin-left:-50px;
 background-color:#bababa;
 border:1px solid #ccc;
 color:#555;
}
.search_box .search_box_text:focus {
	background-color:#eee;
}

/*### TAB */

.tab { position:relative; text-align:center; }




/*### FORM UPLOAD*/

form.upload img.thumb {
    margin:0px 0px 5px 0px;
    max-width:180px;
    vertical-align:bottom;
}

form.upload .upload_box label {
    display:inline-block; position:relative;
    overflow:hidden; vertical-align:middle;
    cursor:pointer;
    margin:0px;

}

form.upload .upload_box label input[type="file"] {
    position:absolute; top:3px; left:3px; cursor:pointer;
    font-size:7pt;
    text-shadow:0px 0px 5px #fff;
    opacity:0.8; -ms-filter:"alpha(opacity=0.8)";
    margin:0px;
 }
    
form.upload .upload_box label input[type="file"]:hover + .button { }

form.upload .upload_box .alt  {
	margin:0px;
	padding:0px; border:1px solid #999; vertical-align:middle; 
}

.upload_box_img { 
	border-raidus:5px;
	display:inline-block;
	width:180px;min-height:120px;
	background-color:rgba(0,0,0,0.1);
	text-align:center;
	margin:0 5px 0px 0px;padding:3px;
	overflow:hidden;
	float:left;
}
	

.upload_box_img:hover { background-color:rgba(0,0,0,0.2);  }



/*### TAG */

.tag_mark {
	display:inline-block;
	border:1px solid #ccc;
	background-color:#f9f9f9;
	text-decoration:none;border-radius:5px;
	color:black;
	padding:3px 5px;
	margin:2px;
}

.tag_mark a{
	color:black;
	text-decoration:none;
}



/*### IMG */

.img_lazy2 {
	transition: opacity 0.8s;
	opacity: 0.3;
	background-color:#ddd;
}

.img_lazy2.flickity-lazyloaded, .img_lazy2.flickity-lazyerror {
	opacity: 1.0;
}


.img2 {
	display: inline-block;
	position: relative;
	padding: 6px;
	box-shadow: 0 2px 6px #999;
}
.img2:after {
	position: absolute;
	display: block;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient( /* ここで光を作っている */
	  -120deg, 
	  rgba(255, 250, 250, 0.1) 0, 
	  rgba(255, 250, 250, 0.5) 70px,
	  rgba(255, 250, 250, 0) 71px);
}

.stamp-0, .stamp-1 {
	display:inline-block;
	border:2px solid #bbb;color:#bbb;background-color:#fff;
	text-align:center;margin:5px;
	border-radius:50%;padding:5px;
width:1.8em;height:1.8em;
}
.stamp-0{
	border:3px solid #bbb;color:#bbb;
}
.stamp-1{
	border:3px solid red;color:red;
}

.server_ret { 
	font-weight:bold;
	text-align:center;
	letter-spacing:0.1em;
	padding:0.2em 0.3em;
	background-color:rgba(0,0,0,0.02);
	color:#aaa; 
	z-index:9;font-size:large;
	display:inline-block;

}
.server_ret_proc { 	color:#0087BF; text-shadow:0px 0px 20px #ddeeff; background-color:transparent; font-size:x-large;}
	
	
	
	
.check_ex2 {
	margin: 0.2em 0.1em;
	text-align: left;
}
/*
@keyframes click-wave {
	0% {
		position: relative;
		width: 30px;
		height: 30px;
		opacity: 0.35;
	}
	100% {
		width: 200px;
		height: 200px;
		margin-top: -80px;
		margin-left: -80px;
		opacity: 0;
	}
}
*/
.check_ex2 .check2 {
	position: relative;
	top: 3px;
	right: 0;
	bottom: 0;
	left: 0;
	width: 30px;
	height: 30px;
	margin-right: 0.5rem;
	cursor: pointer;
	transition: all 0.15s ease-out 0s;
	color: #ffffff;
	border: none;
	outline: none;
	background: #d7cbcb;
	-webkit-appearance: none;
	appearance: none;
}
.check_ex2 label { display:inline-block;  }

.check_ex2 .check2:hover {
	background: #d6a9a9;
}
.check_ex2 .check2:checked {
	background: #da3c41;
}
.check_ex2 .check2:checked::before {
	font-size: 20px;
	line-height: 30px;
	position: absolute;
	display: inline-block;
	width: 30px;
	height: 30px;
	content: '✔';
	text-align: center;
}
.check_ex2 .check2:checked::after {
	position: relative;
	display: block;
	content: '';
	-webkit-animation: click-wave 0.65s;
	animation: click-wave 0.65s;
	background: #da3c41;
}
	checkbox_ex2 .check2.radio {
	border-radius: 50%;
}
	checkbox_ex2 .check2.radio::after {
	border-radius: 50%;
}
.check_ex2 label {
	line-height: 40px;
	display: block;
}
.check_ex2 .check2:disabled {
	cursor: not-allowed;
	background: #b8b7b7;
}
.check_ex2 .check2:disabled::before {
	font-size: 20px;
	line-height: 30px;
	position: absolute;
	display: inline-block;
	width: 30px;
	height: 30px;
	content: '✖︎';
	text-align: center;
}



	
.check_ex2_blue {
	margin: 0.1em;
	padding:0.1em 0.2em;
	text-align: center;
}
.check_ex2_blue:hover {
}
.check_ex2_blue .check2 {
	display:inline-block;
	width: 30px;
	height: 30px;
	cursor: pointer;
	transition: all 0.15s ease-out 0s;
	color: #ffffff;
	border: none;
	background: #d7d7d7;
	-webkit-appearance: none;
	appearance: none;
}
.check_ex2_blue .check2:hover {
	background: #a9a9d6;
}
.check_ex2_blue .check2:checked {
	background: #3c4188;
}
.check_ex2_blue .check2:checked::before {
	font-size: 20px;
	line-height: 30px;
	position: absolute;
	display: inline-block;
	width: 30px;
	height: 30px;
	content: '✔';
	text-align: center;
}
.check_ex2_blue .check2:checked::after {
	position: relative;
	display: block;
	content: '';
	background: #3c41da;
}

.check_ex2_blue .check2.radio {
	border-radius: 50%;
}
.check_ex2_blue .check2.radio::after {
	border-radius: 50%;
}
.check_ex2_blue label {
	line-height: 30px;
	display: block;
}
.check_ex2_blue .check2:disabled {
	cursor: not-allowed;
	background: #b7b7b8;
}
.check_ex2_blue .check2:disabled::before {
	font-size: 20px;
	line-height: 30px;
	position: absolute;
	display: inline-block;
	width: 30px;
	height: 30px;
	content: '✖︎';
	text-align: center;
}





/*### UL LI */



a.tooltip {
	color:#fff;
	font-weight:bold;
	text-align:center;
	text-decoration:none;
	display:inline-block;
	position:relative;
}


/*### TOOL TIP */
a.tooltip span {
	display:none;
	padding:10px;
	width:200px;
	z-index:999;
}

a.tooltip:hover span{
	display:inline;
	position:absolute;
	background:#80bfff;
	color:#fff;
	bottom:50px;
	left:40px;
}



a.tooltip:hover span:after {
	content: "";
	display: block;
	width:0;
	height:0;
	position: absolute;
	left: 100px;
	bottom:-8px;
}


.tooltip span
{
  visibility: hidden;
  position: absolute;
  bottom: 30px;
  left: 50%;
  z-index: 999;
  width: 230px;
  margin-left: -127px;
  padding: 10px;
  border: 2px solid #ccc;
  opacity: .9;
  background-color: #ddd;
  background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
  box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
  text-shadow: 0 1px 0 rgba(255,255,255,.4);
}
 
.tooltip:hover
{
  border: 0; /* IE6 fix */
}
 
.tooltip:hover span
{
  visibility: visible;
}
 
.tooltip span:before,
.tooltip span:after
{
  content: "";
  position: absolute;
  z-index: 1000;
  bottom: -7px;
  left: 50%;
  margin-left: -8px;
  border-top: 8px solid #ddd;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 0;
}
 
.tooltip span:before
{
  border-top-color: #ccc;
  bottom: -8px;
}


/*### SNS */

.color_twitter{ background: #55acee; }
.color_fb{ background: #3b5998; }
.color_line{ background: #09B701; }
.color_google{ background: #d64136; }


.btn_sns{
    display: inline-block;
    width: 70px;
    margin: 2px;
    padding:3px;
    border-radius: 3px;        /* CSS3草案 */
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;   /* Firefox用 */
    text-decoration: none;
    color: #fff;
    text-align: center;
   vertical-align:middle;
   font-size:8pt;
}

.btn_sns:hover { opacity:0.5; color:white; }


.btn_timecard_10 { background-color:#1755aa; border:2px solid #1755aa; color:#fff;  }
.btn_timecard_10:hover { background-color:#107ddf; border:2px solid #20adff; color:#fff;	box-shadow:0px 0px 35px rgba(255,255,255,0.2) inset; }

.btn_timecard_20 { background-color:#ffd72c; border:2px solid #ffd72c; color:#000; }
.btn_timecard_20:hover { background-color:orange; border:2px solid #ffff00; color:#000;	box-shadow:0px 0px 35px rgba(255,255,255,0.4) inset; }

.btn_timecard_30 { background-color:#aaa; border:2px solid #999; color:#333; }
.btn_timecard_30:hover { background-color:#00aa44; border:2px solid green; color:#fff; }

.btn_timecard_40 { background-color:#e22939;; border:2px solid orangered; color:#fff; } 
.btn_timecard_40:hover { background-color:#f22939; border:2px solid red; color:#fff;	box-shadow:0px 0px 35px rgba(255,200,200,0.5) inset; } 






.tr_hover:hover td, .tr_hover:hover, li.tr_hover:hover { background-color:rgba(30,90,145,0.05);   transition: all 500ms 0s ease;}

.tr_disable { background-color:#aaa; }
.tr_through { text-decoration: line-through solid red; background-color:#ccc; }

.tr_enable{ background-color:rgba(0,150,250,0.05); }
.tr_orange{ background-color:rgba(255,232,140,0.2); }
.tr_disable { background-color:rgba(100,100,100,0.3); }
.tr_disable2 { background-color:rgba(100,100,100,0.2); opacity:0.5;}
.tr_lock { background-color:rgba(100,255,100,0.1); }






.line3 {
	display: -webkit-box;
	-webkit-line-clamp:3;
	line-clamp:3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	 background: linear-gradient(to top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%);
}




###


.fa-2x { font-size: 2em; }
.fa {
	position: relative;
	display: table-cell;
	width: 50px;
	height: 36px;
	text-align: center;
	vertical-align: middle;
	font-size:20px;
}

/*
.main-menu:hover,nav.main-menu.expanded {
	width:50vw; overflow:visible; 
}
*/



.main-menu {
	background:#212121;
	position:fixed;
	top:0;bottom:0;height:100%;
	left:0;width:50px;overflow:hidden;
backdrop-filter: blur(8px);
	-webkit-backdrop-filter:blur(8px);

/*
	transition:width .1s linear;
	-webkit-transition:width .05s linear;
	-webkit-transform:translateZ(0) scale(1,1);
*/
	z-index:99;
}

.side_menu_w80vw {
	width:90vw;
	min-width:320px;
	max-width:640px;
	box-shadow:0px 0px 10px #333;
	background-color:rgba(0,0,0,0.8);
}

.side_menu_h {
	height:200px;
}

.main-menu>ul {margin:7px 0;}
.main-menu li {position:relative;display:block;width:250px;}
.main-menu li>a {
	position:relative;
	display:table;
	border-collapse:collapse;
	border-spacing:0;
	color:#999; font-family: arial;
	font-size: 14px;text-decoration:none;
	-webkit-transform:translateZ(0) scale(1,1);
	-webkit-transition:all .1s linear;
	transition:all .1s linear;
}

.main-menu .nav-icon {
position:relative;
display:table-cell;
width:60px;
height:36px;
text-align:center;
vertical-align:middle;
font-size:18px;
}

.main-menu .nav-text {
	position:relative;
	display:table-cell;
	vertical-align:middle;
	width:190px;
	font-family: 'Titillium Web', sans-serif;
}

.main-menu>ul.logout {
	position:absolute;left:0;bottom:0;
}



.screen_lock {
	pointer-events : none;
	opacity:0.5;
		background-color:rgba(0,0,0,0.1);

}
.screen_lock:hover {
	cursor: grab;
}



.bg1 { background-color:#fff; }
.bg2 { background-color:rgba(0,0,0,0.1); }
.bg3 { background-color:rgba(150,0,0,0.1); }
.bg4 { background-color:rgba(0,150,0,0.1); }
.bg5 { background-color:rgba(0,0,150,0.1); }



/*--------------------------------------------------------------*/



.fontsize10 { font-size:10pt; }
.fontsize12 { font-size:12pt; }
.fontsize14 { font-size:14pt; }
.fontsize16 { font-size:16pt; }
.fontsize18 { font-size:18pt;}

.xx_small { font-size: xx-small; }
.x_small { font-size: x-small; }
.small { font-size: small; }
.medium { font-size:  medium; }
.large { font-size:  large; }
.x_large { font-size:  x-large; }
.xx_large { font-size: xx-large; }
.xxx_large { font-size: xxx-large; }


.flex_pc { } 
.flex_tb { } 
.flex_sp {} 
.flex_child { margin: 5px; }

.ul_side_menu {	gap:10px; display:flex; justify-content:flex-start; align-items: top;	flex-direction:row; flex-wrap:wrap; 	box-sizing: border-box; }
.ul_side_menu li{padding:10px;max-width:320px;}
 

@media screen and (min-width:641px) { 
	.flex_tb {  display:flex;justify-content:center;flex-direction: row; } 
	.flex_tb .flex_child { margin: 20px; }
	.flex_tb .ul_side_menu li{max-width:100%;}
}

@media screen and (min-width:1001px) { 
	.flex_pc {  display:flex;justify-content:center;flex-direction: row; } 
	.flex_pc .flex_child { margin: 20px; }
	.flex_pc .ul_side_menu li{max-width:100%;}
	
}




.icon_search:before{
	position:absolute;top:50%;left:12px;-webkit-transform:translateY(-50%);transform:translateY(-50%);display:block;content:"";
	background-image:url("/icon/asset2/search.svg");background-size:cover;background-repeat:no-repeat;background-position:center center;width:19px;height:19px;
}

.icon_edit{position:relative}
.icon_edit:after{position:absolute;top:50%;right:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);content:"";display:block;width:26px;height:26px;background-image:url("/icon/asset2/edit.svg");background-size:cover;background-repeat:no-repeat;background-position:center center;background-size:contain}