@charset "utf-8";

/* aside内のiframeのサイズ指定 */
.easide {
	width: 210px;
	margin: 6px 0 0 0;
	border: none;
	overflow: hidden;
}
#ebopt01 {
	height: 545px;
}
#ebopt02 {
	height: 475px;
}
#ebopt03 {
	height: 525px;
}
#ebopt04 {
	height: 790px;
}
#ebopt05 {
	height: 380px;
}
#ebopt06 {
	height: 450px;
}
#ebopt07 {
	height: 525px;
}
#ebopt08 {
	height: 570px;
}
#ebopt09 {
	height: 440px;
}
#ebopt10 {
	height: 405px;
}

/* asideのiframe一覧画面の指定 */
#a_aside,#b_aside {
	height: 795px;
}
#a_aside div,#b_aside div {
	float: left;
	margin-left: 5px
}
#allpage2 {
	display: block;
	width: 1080px;
	margin: 5px auto;
	background-color: white;
}
#aside_list a {
	display: block;
	/* background-color: white; */
	margin: 0;
	padding: 0;
	width: 20px;
	height: 20px;
	margin-left: 450px;
	opacity: 0.5;
}
#aside_list a:hover {
	background-color: rgba(255, 100, 100, 0.2);
	opacity: 0.5;
}
#aside_list_page header {
	display: block;
	width: 1080px;
	height: 80px;
	margin-bottom: 15px;
}

/* asideチェンジプルダウン */
aside>h4 {
	display: none;
}

#change_aside {
	position: relative;
	width: 210px;
	margin: 5px auto 0;
	padding: 0;
	font-size: 14px;
	line-height: 1;
	font-family: 'ヒラギノ丸ゴ Pro W4', 'Hiragino Maru Gothic Pro', Meiryo, メイリオ, 'HGMaruGothicMPRO', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
aside>article>#change_aside>#change_aside_puldown>h3 {
	top: 20px;
	margin: 0;
	font-family: 'ヒラギノ丸ゴ Pro W4', 'Hiragino Maru Gothic Pro', Meiryo, メイリオ, 'HGMaruGothicMPRO', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-size: 14px;
	line-height: 2.8;
	padding-left: 0;
	font-weight: bold;
	height: 100%;
	
	/* margin-left: 36px;
	background-color: red; */
}
#change_aside #change_aside_puldown {

}
#change_aside input {
	position: absolute;
	height: 0;
	padding: 0;
	display: none;
}
aside>article>#change_aside div #change_aside_menu {
	/* position: relative; */
	display: block;
	/* height: 36px; */
	padding-top : 0px;
	padding-bottom : 0;
	background-color: #5c5c5c;
	color: white;
	font-size: 14px;
	margin: 0;
	font-weight: bold;
	/* padding-left : 36px; */
	padding-left : 0;
	padding-right : 0; 
	width: 210px;
}
aside>article>#change_aside div #change_aside_menu>span {
	padding-left : 36px; 
}
#change_aside #change_aside_menu {
	border-top: 0;
	border-bottom: 0;
}

#change_aside div #change_aside_menu:hover {
	background: #a0d2e2;
	cursor: pointer;
}
/* hover時回転後の下向き>アイコンを関連情報の後ろに追加 */
#change_aside div #change_aside_menu:hover:after {
	top: -15px;
	right: 3px;
	font-family: 'Genericons';
	font-size: 24px;
	font-weight: bold;
	content: '\f431';
	-moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
}
/* メニューアイコンを関連情報の前に追加 */
#change_aside div #change_aside_menu:before {
	position: absolute;
	top: -9px;
	left: 7px;
	color: white;
	font-family: 'Genericons';
	font-size: 20px;
	content: '\f505';
	margin: 0;
	padding: 0;
}
/* 回転前の右向き>アイコンを関連情報の後ろに追加 */
#change_aside div #change_aside_menu:after {
	position: absolute;
	top: -15px;
	right: 3px;
	color: white;
	font-family: 'Genericons';
	font-size: 24px;
	font-weight: bold;
	content: '\f431';
	-moz-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	transform: rotate(-90deg);
	-moz-transition: .3s;
	-webkit-transition: .3s;
	-o-transition: .3s;
	-ms-transition: .3s;
	transition: .3s;
}
/* プルダウン展開時回転後の下向き>アイコンを関連情報の後ろに追加 */
#change_aside #caside00:checked ~ div #change_aside_menu:after {
	top: -15px;
	right: 3px;
	font-family: 'Genericons';
	font-size: 24px;
	font-weight: bold;
	content: '\f431';
	-moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
}
#change_aside ul {
	list-style: none;
	margin: 0;
	background: #e1f1f6;
	padding-left: 0;
	padding-right: 0;
	position: absolute;
	z-index: 1000;
	width: 210px;
}
#change_aside ul li {
	display: block;
	overflow: hidden;
	height: 0;
	padding: 0;
	color: #333;
	text-decoration: none;
	-moz-transition: .5s;
	-webkit-transition: .5s;
	-o-transition: .5s;
	-ms-transition: .5s;
	transition: .5s;
	margin: 0;
	width: 210px; 
	line-height: 3;
}

#change_aside ul li:hover {
	border-top-color: #c7e4ee;
	background: #d4ebf2;
	color: #1b4958;
}
#change_aside #caside00:checked ~ div ul li {
	position: relative;
	background: none;
	line-height: 1.4;
	/* height: 16px; */
	height: 100%;
	padding: 0px 0 0px 0px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #a0d2e2;
	cursor: pointer;
	margin: 0;
	/* padding: 13px 0 13px 0px; */
}

#change_aside #caside00:checked ~ div ul li>span {
	display: block;
	margin-left: 36px;
	padding: 13px 0 13px 0;
}

#change_aside div ul li>label {
	position: relative;
	display: block;
	width: 210px;
	height: 16px;
	padding: 13px 0 13px 36px;
	padding-left: 36px;
	/* background-color: red; */
} 
#change_aside div ul li>label:hover {
	cursor: pointer;
} 
/* カメラアイコンを各関連情報選択プルダウンの展開時のみ前に追加 */
#change_aside #caside00:checked ~ div ul li>label>span:before {
/*	position: absolute;
	top: 9px;
	left: 8px;
	color: #2f7f99;
	font-family: 'Genericons';
	font-size: 20px;
	font-weight: bold;
	content: '\f102';
 	-moz-transition: .3s;
	-webkit-transition: .3s;
	-o-transition: .3s;
	-ms-transition: .3s;
	transition: .3s; */
}
/* カメラアイコンを各関連情報選択プルダウンの前に追加 */
#change_aside div ul li>label>span:before {
	position: absolute;
	top: 9px;
	left: 8px;
	color: #2f7f99;
	font-family: 'Genericons';
	font-size: 20px;
	/* font-weight: bold; */
	content: '\f102';
}

#change_aside #caside00:checked ~ div ul li:first-child {
	border-top: 0;
	box-shadow: 0 7px 7px -7px rgba(0,0,0,0.5) inset;
}
#change_aside #caside00:checked ~ div ul li:last-child {
	border-bottom: 1px solid #d4ebf2;
}
#change_aside #caside00:checked ~ div ul li:hover {
	background: #d4ebf2;
	border-top-color: #eef7fa;
}

/* #change_aside div * { アニメーション
	-moz-transition: .3s;
	-webkit-transition: .3s;
	-o-transition: .3s;
	-ms-transition: .3s;
	transition: .3s;
} */

/* 各関連情報iframe表示／非表示1 */
#change_aside #caside01:checked ~ #bopt01 {
	display: block;
}
#change_aside #caside01:not(:checked) ~ #bopt01 {
	display: none;
}
/* #change_aside #caside01:checked ~ div #change_aside_menu span {
	display: block;
} */
#change_aside #caside01:checked ~ #change_aside_puldown>h3>label>span>span:after {
	content: "その１";
}

/* 各関連情報iframe表示／非表示2 */
#change_aside #caside02:checked ~ #bopt02 {
	display: block;
}
#change_aside #caside02:not(:checked) ~ #bopt02 {
	display: none;
}
#change_aside #caside02:checked ~ #change_aside_puldown>h3>label>span>span:after {
	content: "その２";
}

/* 各関連情報iframe表示／非表示3 */
#change_aside #caside03:checked ~ #bopt03 {
	display: block;
}
#change_aside #caside03:not(:checked) ~ #bopt03 {
	display: none;
}
#change_aside #caside03:checked ~ #change_aside_puldown>h3>label>span>span:after {
	content: "その３";
}

/* 各関連情報iframe表示／非表示4 */
#change_aside #caside04:checked ~ #bopt04 {
	display: block;
}
#change_aside #caside04:not(:checked) ~ #bopt04 {
	display: none;
}
#change_aside #caside04:checked ~ #change_aside_puldown>h3>label>span>span:after {
	content: "その４";
}

/* 各関連情報iframe表示／非表示5 */
#change_aside #caside05:checked ~ #bopt05 {
	display: block;
}
#change_aside #caside05:not(:checked) ~ #bopt05 {
	display: none;
}
#change_aside #caside05:checked ~ #change_aside_puldown>h3>label>span>span:after {
	content: "その５";
}

/* 各関連情報iframe表示／非表示6 */
#change_aside #caside06:checked ~ #bopt06 {
	display: block;
}
#change_aside #caside06:not(:checked) ~ #bopt06 {
	display: none;
}
#change_aside #caside06:checked ~ #change_aside_puldown>h3>label>span>span:after {
	content: "その６";
}

/* 各関連情報iframe表示／非表示7 */
#change_aside #caside07:checked ~ #bopt07 {
	display: block;
}
#change_aside #caside07:not(:checked) ~ #bopt07 {
	display: none;
}
#change_aside #caside07:checked ~ #change_aside_puldown>h3>label>span>span:after {
	content: "その７";
}

/* 各関連情報iframe表示／非表示 8*/
#change_aside #caside08:checked ~ #bopt08 {
	display: block;
}
#change_aside #caside08:not(:checked) ~ #bopt08 {
	display: none;
}
#change_aside #caside08:checked ~ #change_aside_puldown>h3>label>span>span:after {
	content: "その８";
}

/* 各関連情報iframe表示／非表示9 */
#change_aside #caside09:checked ~ #bopt09 {
	display: block;
}
#change_aside #caside09:not(:checked) ~ #bopt09 {
	display: none;
}
#change_aside #caside09:checked ~ #change_aside_puldown>h3>label>span>span:after {
	content: "その９";
}

/* 各関連情報iframe表示／非表示10 */
#change_aside #caside10:checked ~ #bopt10 {
	display: block;
}
#change_aside #caside10:not(:checked) ~ #bopt10 {
	display: none;
}
#change_aside #caside10:checked ~ #change_aside_puldown>h3>label>span>span:after {
	content: "その10";
}