/* layout */
/* ご注意：
ブラウザIEのバージョンに依っては一部CSS3機能が使えません。
（例、外枠の角を丸くするborder-radius等）
対応方法はあるようですが、現状そのままとしています。
*/

/* ↓======= 以下、フォント「Yu Gothic」各種ブラウザ対応 Add.2017/2/22 =======*/
/* 各要素の幅を親要素の98%に設定　Add.2022/07/15 */
.header,.main,.footer {
    width: 98%;
}
body　{
    margin: 0;
}
/* 画面左右ブレ対策 Add.2022/12/14 */
.wrap_zure {
	overflow: hidden;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 100;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 200;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 300;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 100;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 200;
}
/* ↑===============================================================================*/


body, textarea { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", Verdana, Meiryo, "M+ 1p", sans-serif; }
a,body,p,form,input{margin: 0}


/* ↓ --------- 未使用 ---------------------- */
/*
body, textarea { font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; }
a,body,p,form,input{margin: 0}
*/

/*
body, textarea { font-family:"游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif; }
a,body,p,form,input{margin: 0}
*/

/*
body, textarea { font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"; }
a,body,p,form,input{margin: 0}
*/

/*
body, textarea { font-family:"Meiryo", "メイリオ", "ヒラギノ角ゴ Pro W3", "sans", "ＭＳ Ｐゴシック", sans-serif; }
a,body,p,form,input{margin: 0}
*/
/* ↑ --------- 未使用 ---------------------- */


/* 余計な余白を削除 */
* {
	margin: 0;
	padding: 0;
}

textarea,input{
    background-color: #cff; /* Add.2016/12/24 */
    border-radius: 20px; /* CSS3 Add.2016/12/24 */
    -moz-border-radius: 20px; /* Firefox Add.2016/12/24 */
    -webkit-border-radius: 20px; /* Safari,Chrome Add.2016/12/24 */
    padding: 2px 4px;  /* Add.2016/12/26 */
    border: 1px solid #ccc;
}

fieldset{
	margin: 4px 5px 10px 5px;
	padding: 6px;
	font-size: 10px;
	border: 1px #ccc solid;
	-webkit-border-radius: 5px; /* for Chrome */
	-moz-border-radius: 5px; /* for Firefox */
	background-color: #e0ffff;  /* かなり薄青(lightcyan) */
}

legend{
    background-color: #099; /* 青緑 */
    padding: 4px 10px;
    border-radius: 5px;
    color: #fff; /* 白（white）*/
}

/* 表題 */
figure figcaption {
    margin: 0 2px;
    padding: 0 2px;
    font-size: 14px;
    font-style: oblique; /* 斜体 */
 	color: #555; /* gray */
    font-weight: bold;
/*	background-color: #099; */ /* 青緑 */
}

h3{
	font-size: 12px;
 	color: #555;/* grey */
  	padding: 2px;
  	text-align: center;
  	font-weight: bold;
}

/* Add.2022/07/24 */
strong.style1{
	padding: 2px 4px;
	color: #ff3333;
}

/* Add.2022/07/26 */
a{
	display: inline-block; /* インライン要素の上下中央寄せの為 */
	padding-bottom:3px;
}

/* Add.2022/07/23 */
/* 特定のクラスが指定されているリンクへの設定 */
a.sample:link {color: #0000ff;}
a.sample:visited {color: #9400D3;}
a.sample:hover {color: #fff; background: #0000FF;}
a.sample:active {color: #fff; background: #9400D3;}

p{
    font-size: 12px;
    padding-left: 2px;
    padding-right: 2px;
    color: #066;/* 青緑（teal） */
  	font-weight: bold;
}

p.style1{
  	text-align: center;
}

p.style2{
  	text-align: right;
}

p.style3{
  	text-align: left;
}

p.style4{
  	text-align: left;
  	font-style: oblique; /* 斜体 */
    font-size: 14px;
    margin-top: 0;
    padding-bottom: 12px;
}

p.style4a{
  	margin-left: 4px;
    font-size: 12px;
    color: #888; /* gry */
}

p.style5{
    margin: 0;
  	text-align: left;
    font-size: 10px;
    color: #f00;/* red */
}

p.style6{
    margin-left: 4px;
 /* margin: 0px; */
  	text-align: left;
    font-size: 10px;
 	color: #066; /* 暗緑青色(teal)  */
    font-weight: bold;
}

p.style7{
    font-size: 10px;
    color: #888; /* gry */
/*    color: #000; */  /* blk */
}

p.style11{
    font-size: 16px;
    margin-bottom: 0;
    margin-left: 4px;
    padding-left: 4px;
    padding-right: 2px;
    padding-bottom: 0;
    color: #00f; /* blue */
    font-weight: bold;
}

/* Add.2022/07/26 */
p.regist{
    font-size: 14px;
}

span{
	font-size: 12px;
 	color: #333;/* grey */
  	padding: 2px;
}

span.style1{
	font-size: 10px;
 	color: #00f;/* blue */
}

span.style2{
	font-size: 14px;
 	color: #333; /* grey */
  	padding: 1px;
  	margin: 2px;
/*  line-height: 150%; */  /* Del.2017/2/18 */
  	font-weight: normal;
}

span.style3{
	font-size: 10px;
 	color: #c00;/* red */
  	padding: 1px;
  	font-weight: normal;
}

span.style4{
	font-size: 10px;
 	color: #333;/* gray */
  	padding: 1px;
  	font-weight: normal;
}

span.style6{
	padding-bottom: 0;
	font-size: 16px;
    color: #066; /* teal */
/*    color: #666; */ /* gray */
  	font-weight: bold;
}

span.style7{
	font-size: 10px;
 	color:  #e00;/* red */
  	font-weight: bold;
}

span.style8{
	font-size: 10px;
 	color:  #00f;/* blue */
  	font-weight: bold;
}

span.style9{
	font-size: 10px;
 	color:  #333;/* gray */
 /*	padding: 40%; */
  	font-weight: bold;
}

span.style10{
	font-size: 10px;
    color: #888; /* gry */
/*  color:  #000;*/ /* blk */
}

span.style11{
    font-size: 16px;
    margin:28px 0 4px 4px;
    padding: 0 2px 4px 4px;
    color: #00f; /* blue */
    font-weight: bold;
    /* 以下2行は重なり問題対策 Add.20221215 */
	position: relative;
	z-index: 1
}

span.style12{
    font-size: 10px;
    color: #fff;/* white */
}

span.style14{
    font-size: 10px;
    margin-bottom: 0;
    margin-left: 4px;
    padding-left: 0;
    padding-right: 2px;
    padding-bottom: 0;
    color: #00f; /* blue */
    font-weight: bold;
}

span.style15{
    font-size: 12px;
	padding-left: 4px;
    padding-bottom: 0;
	/* vertical-align: super; */
 	color: #008e8e; /* 暗緑青色(teal) */
    font-weight: bold;
}

span.style16{
	padding: 0 0 0 4px;
	font-size: 18px;
    color: #555; /* gray */
  	font-weight: bold;
}

span.style17{
    font-size: 10px;
	padding-left:2px;
    padding-bottom: 0;
	/* vertical-align: super; */
 	color: #c00;/* red */
/*    font-weight: bold; */
}

span.style18{
	padding-bottom: 0;
	font-size: 14px;
    color: #555; /* gray */
  	font-weight: bold;
}

/* テーブル（グループメンバー行動一覧） */
table.style1{
    table-layout: fixed; /* Add.2022/07/02 */
	margin: 4px;
	border-collapse: collapse; /* 枠線の表示方法 */
	border: 1px #ccc solid; /* テーブル全体の枠線（太さ,色,スタイル）Chg.2021/01/27 */
 /* border: 1px #333 solid; */ /* テーブル全体の枠線（太さ,色,スタイル） */
 	border-spacing: 1;/* Mod.20250415*/
 /* cellspacing: 1; */ /* HTML5から非推奨 */
 /* width: 100%; */
    width: 98%; /* Add 2017/09/17 画面横ずれ対策  */
	overflow:hidden; /* Add 2017/09/16 画面横ずれ対策 */
	background-color: #cff; /* Mod.20250415 かなり薄青 */
	
	/* Add.2022/07/02 */
	style1.td {
		width: 4%;
	}
	
}
/* カレンダー表示 */
table.style2{
	border-collapse: collapse; /* 枠線の表示方法 */
	border: 0 #ccc solid;/* テーブル全体の枠線（太さ,色,スタイル）Chg.2021/01/27 */
 /* border: 0 #333 solid; */ /* テーブル全体の枠線（太さ,色,スタイル） */
 	border-spacing: 0; /* Mod.20250415 */
	/*cellspacing: 0;*/ /* HTML5から非推奨 */
	width: 53px; /* Mod.2022/07/16 */
  /* width: 100%; */
	margin: 0 0 0 -3px ;
	text-align: center; /* Add.20250321 */
	background-color: #cff; /* Mod.20250415 かなり薄青 */
}

/* カレンダー＆個別登録一覧表示 */
table.style3{
    margin: 8px 1px 8px 2px; /* Mod. 20250415 */
    margin-top: -8px; /* Add. 2017/2/15 */
	padding: 1px 1px;
	border-spacing: 1;/* Mod.20250415*/
	/* cellspacing: 1;*//* HTML5から非推奨 */
	background-color: #b0e0e6;  /* かなり薄青(powderblue) */
	border: 1px solid #EEE9ED;
    width: 99%; /* Mod.20250415 */
	/*↓ボックスの角丸の指定 */
    -webkit-border-radius: 5px; /* Chg.2021/01/27 12px -> 5px */
	-moz-border-radius: 5px;    /* Chg.2021/01/27 12px -> 5px */
	border-radius: 5px;         /* Chg.2021/01/27 12px -> 5px */
}

table.style4{
	padding: 1px; /* Mod.20250415 */
	border: 0;
	border-spacing: 1;/* Mod.20250415*/
	/* cellspacing: 1;*//* HTML5から非推奨 */
	/* width: 98%; */ /* Del.20250415 */
}

table.style5{
	border: 0;
	width: 150px; /* Mod. 2017/2/18 */
}


th.style1{
	font-size: 12px;
	margin-bottom: 0;
}

td.style1{
	border: 1px #ccc solid; /* セルの枠線（太さ・色・スタイル） */
	width: 8%;
	text-align: center; /* Add.20250304 */
    background-color: #EBF7F8; /* 薄青 */ /* Chg.2021/01/26 */
 /* background-color: #cff; */
}

td.style2{
	border: 1px #ccc solid; /* セルの枠線（太さ・色・スタイル） */
	width: 8%;
	height: 60px;
	background-color: #FFF;
	vertical-align: top; /* Mod. 2017/2/18 */
}

td.style3{
	text-align: center; /* Add.20250321 */
	background-color: #FFF;
}

td.style4{
	height: 10px;
	text-align: center; /* Add.20250321 */
 /* background-color: #cff; */
}
td.style5{
	width: 40%;
	height: 20px;
	background-color: #fcf; /* カレンダー今日の背景色：淡ピンク */
	vertical-align: top; /* Mod. 2017/2/18 */
}

td.style6{
	width: 40%;
	height: 20px;
	background-color: #fff;
	vertical-align: top; /* Mod. 2017/2/18 */
}

td.style7{
	vertical-align: bottom;
	padding: 4px; /* 余白指定 Add.2022/07/16 */
}

td, th{
	font-size: 12px;
 	color: #333;/* grey */
  	padding: 1px;
  	font-weight: normal;
  	/* text-align: center; */
}

input.style1{
    background-color: #fff; /* Add.2016/12/24 */
	margin: 5px;
	width: 300px; /* Mod.20250414 */
	height: 24px;
	border: 1px solid #ccc;
}

input.style2{
	margin: 5px;
	width: auto;
 /* width: 100px; */
	height: 20px;
}


input[type="search"] {
  -webkit-appearance: searchfield;
}
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: searchfield-cancel-button;
}



hr.line{
	width: 98%; /* Mod.2017/2/18 */
	overflow:hidden; /* Add 2017/09/17 画面横ずれ対策 */
    height: 1px; /* for IE6 Add.2017/2/18 */
    clear: both; /* for IE6 Add.2017/2/18 */
/*	size: 1px; */  /* Del.2017/2/18 */
	margin-bottom: 6px;
	color: #333;
	/* margin-top: 2px; */
}

img{
	margin-bottom:0px;
	border: none;/* 画像リンク時の境界線を表示させない */
}

img.user{
	vertical-align: -2px;
	border: none;/* 画像リンク時の境界線を表示させない */
}

img.user1{
   margin-top: 10px;
   margin-bottom: 0;
   margin-left: 4px;
}

select{
	margin: 2px;
	padding: 3px 0; /* Add.2017/2/15 */
 /*	margin-left: 4px; */
}

/* ↓-------- （使わない）アコーディオンパネル Del.2022/12/15 --------- */
/*
.menu {
    margin: 0 1px;
    padding: 4px 2px;
    background: #fff;
    font-size: 12px;
}
label {
    height: 20px;
    background: #666;
    color: #fff;
    padding: 8px;
    display: block;
    margin: 0;
    border: 1px solid #fff;
    cursor: pointer;
}
label:hover {
    background: #666;
}
input[type="checkbox"].on-off{
    display: none;
}
.menu ul {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    margin: 0 0 10px;
    padding: 0;
    list-style: none;
}
.menu li {
    padding: 1px;
}
input[type="checkbox"].on-off + ul{
    display: none;
}
input[type="checkbox"].on-off:checked + ul{
  display: block;
}
*/
/* ↑-------------------------------------------------------------- */

#form{
	width: 320px; /* Mod.2022/07/17 */
/* width: 260px; */ /* Del.2022/07/16 */
	margin: 16px auto;
	padding: 10px;
	border: 1px solid #555;
}

form p{
    font-size: 12px;
    padding-left: 2px;
    padding-right: 0;
}

.form-title{
	text-align: center;
}

.userid,.username,.regist,.mail,.pass{
  margin-bottom: 20px;
  }

input[type="userid"],
input[type="username"],
input[type="email"],
input[type="password"] {
 /*	width: 48em;*/
	padding: 4px;
	font-size: 14px;
	border: 1px solid #ccc;
  }

.submit{
  margin-bottom: 10px; /* Add.2017/2/15 */
  text-align: right;
  margin-right: 40px;
  }

/* font */
#form p{
  color: #099;
  font-weight: bold;
  }

#form p.form-title{
  font-family: arial,sans-serif,"Hiragino Kaku Gothic ProN",helvetica,"Avenir Next",meiryo;
/*  font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; */
  color: #099;
  font-style: normal;
  font-weight: bold;
  }

#form .form-titleTop{
  font-family: arial,sans-serif,"Hiragino Kaku Gothic ProN",helvetica,"Avenir Next",meiryo;
/*  font-family: Arial; */
  font-style: oblique;
  font-size: 18px;
  padding: 10px 20px;
  color: #099; /* 緑みの青 */
/*  text-shadow: 1px 1px #333; */ /* Mod.2017/2/11 */
  }

#form .form-title{
  font-family: arial,sans-serif,"Hiragino Kaku Gothic ProN",helvetica,"Avenir Next",meiryo;
/*  font-family: Arial; */
  font-style: oblique;
  font-size: 20px;
  color: #099; /* 緑みの青 */
/*  text-shadow: 1px 1px #333; */ /* Mod.2017/2/11 */
  }

/* skin */
#form{
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-shadow: 0 1px 10px #488a9e;
  -moz-box-shadow: 0 1px 10px #488a9e;
  box-shadow: 0 1px 10px #488a9e;
  border: solid #4eb4c2 1px;
  background: #fafafa;
  }

#form .form-title{
  padding-bottom: 1px;
/* padding-bottom: 6px; */
  border-bottom: 3px solid #4eb4c2;
  /* border-bottom: 2px solid #4eb4c2; */
  margin-bottom: 8px;
 /* margin-bottom: 16px; */
  }

/* ボタン定義 */
.submit input{
	margin-top: 6px;
	margin-bottom: 6px;
	border:1px solid #25729a;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;border-radius: 18px;
	font-size:14px;font-family:arial, helvetica, sans-serif;
	padding: 8px 18px 8px 18px; text-decoration:none;
	display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
	font-weight:bold;
	color: #FFFFFF;
	background-color: #3093c7;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#3093c7), to(#1c5a85));
	background-image: -webkit-linear-gradient(top, #3093c7, #1c5a85);
	background-image: -moz-linear-gradient(top, #3093c7, #1c5a85);
	background-image: -ms-linear-gradient(top, #3093c7, #1c5a85);
	background-image: -o-linear-gradient(top, #3093c7, #1c5a85);
	background-image: linear-gradient(to bottom, #3093c7, #1c5a85);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#3093c7, endColorstr=#1c5a85);
}

.submit input:hover{
	margin-top: 6px;
	margin-bottom: 6px;
	border:1px solid #1c5675;
	background-color: #26759e;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#26759e), to(#133d5b));
	background-image: -webkit-linear-gradient(top, #26759e, #133d5b);
	background-image: -moz-linear-gradient(top, #26759e, #133d5b);
	background-image: -ms-linear-gradient(top, #26759e, #133d5b);
	background-image: -o-linear-gradient(top, #26759e, #133d5b);
	background-image: linear-gradient(to bottom, #26759e, #133d5b);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#26759e, endColorstr=#133d5b);
 }

p.license {
	margin: 28px 0;
	text-align: center;
	color: #ccc;
}

/*---------------------------------
リンクボタン「先月」、「翌月」、「登録・編集」、「戻る」 Add.2025/04/11
--------------------------------*/
/* 前月ボタン  */
:root {
    --link_color: #66b3b3;/* グローバル変数定義 */
}
/*.stepMonth {
    padding: 0 2px;
    margin: 4px 0;
    position: relative;
}*/
*, ::before, ::after {
  box-sizing: border-box;
}
a {
    display: inline-block;
    text-decoration: none;
    line-height: 1;
}
.preMonth {
    margin: 2px 0px 2px 20px;
    background: var(--link_color);
    color: #fff;
    padding: 0.4em 0.8em 0.4em 2.4em;/* 文字位置 */
 /* padding: 0.4em 0.8em 0.4em 2.4em;*/ /* 文字位置 */
    position: relative;
}
.preMonth::before,
.preMonth::after {
    content: "";
    width: 8px;
    height: 8px;
    position: absolute;
    top: 50%;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: translateY(-50%) rotate(225deg);/* 左向き矢印へ回転 */
    transition: all 0.2s ease-in;
}
.preMonth::before {
    left: 14px;/* 左向き矢印位置 */
}
.preMonth::after {
    left: 20px;/* 左向き矢印位置 */
}
.preMonth:hover::before {
    left: 6px;/* 左向き矢印位置 */
}
.preMonth:hover::after {
    left: 12px;/* 左向き矢印位置 */
}


/* 翌月ボタン  */
:root {
    --link_color: #66b3b3;
}
/*.stepMonth {
    padding: 0 2px;
    margin: 4px 0;
    position: relative;
}*/
*, ::before, ::after {
  box-sizing: border-box;
}
a {
    display: inline-block;
    text-decoration: none;
    line-height: 1;
}
.nextMonth {
    margin-right: 20px;
    background: var(--link_color);
    color: #fff;
    padding: 0.4em 2.4em 0.4em 0.8em; /* 文字位置 */
    position: relative;
}
.nextMonth::before,
.nextMonth::after {
    content: "";
    width: 8px;
    height: 8px;
    position: absolute;
    top: 50%;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: translateY(-50%) rotate(45deg);/* 右向き矢印へ回転 */
    transition: all 0.2s ease-in;
}
.nextMonth::before {
    right: 16px;/* 右向き矢印位置 */
}
.nextMonth::after {
    right: 22px;/* 右向き矢印位置 */
}
.nextMonth:hover::before {
    right: 8px;/* 右向き矢印位置 */
}
.nextMonth:hover::after {
    right: 14px;/* 右向き矢印位置 */
}


/* 登録・編集ボタン  */
:root {
    --link_color1: #666;
}
*, ::before, ::after {
  box-sizing: border-box;
}
a.regUpdate {
    display: inline-block;
    text-decoration: none;
    line-height: 1;
    font-size: 14px;
  /*  background-color:#333; */ /* Add.20250411 */
}
.regUpdate {
    margin: 18px 10px;
    background: var(--link_color1);
    color: #fff;
    padding: 0.4em 2.4em 0.4em 0.8em;/* 文字位置 */
    position: relative;
}
.regUpdate::before,
.regUpdate::after {
    content: "";
    width: 8px;
    height: 8px;
    position: absolute;
    top: 50%;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: translateY(-50%) rotate(45deg);/* 右向き矢印へ回転 */
    transition: all 0.2s ease-in;
}
.regUpdate::before {
    right: 16px;/* 右向き矢印位置 */
}
.regUpdate::after {
    right: 22px;/* 右向き矢印位置 */
}
.regUpdate:hover::before {
    right: 8px;/* 右向き矢印位置 */
}
.regUpdate:hover::after {
    right: 14px;/* 右向き矢印位置 */
}


/* 戻るボタン  */
:root {
    --link_color1: #666;
}
*, ::before, ::after {
  box-sizing: border-box;
}
a.retTop {
    display: inline-block;
    text-decoration: none;
    line-height: 1;
    font-size: 14px;
}
.retTop {
    margin: 8px 10px;
    background: var(--link_color1);
    color: #fff;
    padding: 0.4em 0.8em 0.4em 2.4em;/* 文字位置 */
    position: relative;
}
.retTop::before,
.retTop::after {
    content: "";
    width: 8px;
    height: 8px;
    position: absolute;
    top: 50%;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: translateY(-50%) rotate(225deg);/* 左向き矢印へ回転 */
    transition: all 0.2s ease-in;
}
.retTop::before {
    left: 20px;/* 左向き矢印位置 */
}
.retTop::after {
    left: 26px;/* 左向き矢印位置 */
}
.retTop:hover::before {
    left: 12px;/* 左向き矢印位置 */
}
.retTop:hover::after {
    left: 18px;/* 左向き矢印位置 */
}


/*---------------------------------
アコーディオンボックス Add.2022/07/17
--------------------------------*/
.acbox{
	width: 98%;
/*	width: auto; */
	font-size:0px; /* ラベルと開く部分を分離する時は数値を入れる */
	margin: 4px; /* ボックス全体の位置調整 */
}

.acbox label{
  width: auto;
  font-size: 16px; /* ラベルの文字サイズ */
  font-weight: bold;
  text-align: center;
  background:#15839b;/* 青緑　ラベル背景色 */
  /* background: #8BC34A; */ /* ラベルの背景色 */
  position: relative;
  display: block;
  padding:8px;
  border-radius: 4px; /* ラベルの角の丸み */
  cursor: pointer;
  color: #fff;
}

.acbox label:hover{
  background: #c0dee9; /* light blue マウスオン時の背景色 */
 /* background: #8BC34A; */ /* ラベルにマウスを乗せた時の背景色 */
}

.acbox input{
  display: none;
}

.acbox label:after{
  color: #fff;
  content:"▼"; /* ラベルのアイコン */
  position: absolute;
  top: 50%;
  right: 15px;
  margin-top: -14px;
}

.acbox input:checked ~ label::after {
  content:"▲"; /* ラベルをクリックした後のアイコン */
}

.acbox div{
  height: 0px;
  opacity: 0;
  transition: 0.15s; /* 開閉スピードの設定 */
}

.acbox input:checked ~ div{
	height: auto;
	padding: 4px; /* 開いた部分の枠内の余白 */
	border-radius: 0px;
	background: #F3F4F5; /* light gray 開いた部分の背景色 */
	opacity: 1;
}

.acbox input:checked ~ label {
  background: #c0dee9; /* light blue クリック後のラベルの背景色 */
 /* background: #8BC34A; */ /* クリック後のラベルの背景色 */
}

.acbox-under{
  font-size: 15px; /* 開いた部分の文字サイズ */
  color: #555555; /* 開いた部分の文字色 */
  margin:4px;
}


/* ------- CSS ページトップへ戻る（開始） Add.201/03/17 -------- */

#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 74%;
}

#page-top a {
    background: #003;
    text-decoration: none;
    color: #fff;
    width: 60px;
    padding: 10px 0;
    text-align: center;
    display: block;
    border-radius: 4px;
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}

#page-top a:hover {
    text-decoration: none;
    background: #666;
    filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
}

/* --------- ページトップへ戻る（ここまで） ----------- */