@import url("/css/component.css");
@import url("/css/animate.css");

body{ align:center; background-color:#ffffff; margin:0; padding:0;}
td{
	color:#000000;
	font-family:sans-selif;
}

.hd1{ background-image:url(/img/hd_bk.gif);}
.hd2{ background-image:url(/img/hd_bk2.gif);}
.hd3{ background-image:url(/img/hd_bks.gif);}
.sc1{ background-image:url(/img/sc_bk1.gif);}
.sc2{ background-image:url(/img/sc_bk2.gif);}
.sc3{ background-image:url(/img/sc_bk3.gif);}
.sc02{ background-image:url(/img/sc_bk02.gif); background-repeat:repeat-x;}
.fd{ background-image:url(/img/fd_bk.gif); background-repeat:repeat-x;}
.tp00{ background-image:url(/img/tp00bk.gif);}
.tp01{ background-image:url(/img/tp01bk.gif);}
.tp02{ background-image:url(/img/tp02bk.gif);}
.tp022{ background-image:url(/img/tp022.gif);}
.tp08{ background-image:url(/img/tp08bk.gif);}
.tp09{ background-image:url(/img/tp09bk.gif);}
.tp10{ background-image:url(/img/tp10bk.gif);}
.tp20{ background-image:url(/img/tp20bk.gif);}
.tp30{ background-image:url(/img/tp30bk.gif);}

a{ color:#3366cc; text-decoration:underline; }
a:visited{ color:#3366cc; text-decoration:underline; }
a:hover{ color:#3366cc; text-decoration:none; }
a:active {color:#ff0000; text-decoration:none; }

a.a1 { color:#425D01; text-decoration:underline;}
a.a1:visited { color:#425D01; text-decoration:underline;}
a.a1:hover { color:#425D01; text-decoration:none;}
a.a1:active { color:#425D01; text-decoration:none;}

a.a2 { color:#86161F; text-decoration:underline;}
a.a2:visited { color:#86161F; text-decoration:underline;}
a.a2:hover { color:#86161F; text-decoration:none;}
a.a2:active { color:#86161F; text-decoration:none;}

a.a3 { color:#333399; text-decoration:underline;}
a.a3:visited { color:#333399; text-decoration:underline;}
a.a3:hover { color:#333399; text-decoration:none;}
a.a3:active { color:#333399; text-decoration:none;}

.e07{ font:70% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif;}
.e08{ font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif;}
.e08_bd{ font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; font-weight:bold;}
.e08_12{ font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; line-height:120%;}
.e08_12bd{ font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; line-height:120%; font-weight:bold;}
.e08_14{ font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; line-height:140%;}
.e10_bd{ font:100% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; line-height:120%; font-weight:bold;}
/*  さらに小さい文字   */
.e05{ font:50% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif;}
.f07{ font-size:70%; line-height:120%;}
/*   ここまで   */

.f08{ font-size:83%; line-height:120%;}
.f08_bd{ font-size:83%; line-height:120%; font-weight:bold;}
.f08_14{ font-size:83%; line-height:140%;}
.f10{ font-size:100%; line-height:120%;}
.f10_bd{ font-size:100%; line-height:120%; font-weight:bold;}
.f11{ font-size:110%;}

.c_r{ color:#cc0000;}
.c_b{ color:#333399;}
.c_g8{ color:#888888;}
.c_g6l{ color:#666666; text-decoration:line-through;}
.c_gn{ color:#64980A;}
.c_o{ color:#AC3E22;}

.b_y{ background-color:#F1EECB;}
.b_b{ background-color:#D4E0ED;}
.b_b2{ background-color:#D5E7EA;}
.b_w{ background-color:#ffffff;}
.b_g{ background-color:#ebebeb;}
.b_gn{ background-color:#E1E890;}
.b_o{ background-color:#F2D861;}
.b_p{ background-color:#C71585;}

.bd1{ border:solid 1px #999999;}
.bd2{ border-style: solid; border-color:#999999; border-width:0px 1px 1px 1px;}
.bd3{ border-style: solid; border-color:#999999; border-width:1px 1px 0px 0px;}
.bd4{ border-style: solid; border-color:#999999; border-width:0px 0px 1px 1px;}
.bd5{ border-style: solid; border-color:#999999; border-width:1px 0px 0px 0px;}
.bd6{ border:solid 1px #DFDFDF;}

/*   色つきテーブル枠  2011.2.16　hirosaka */
/*   yellow 輸入書   */
.bd-yellow{
	border-style: solid;
	border-color:#FFCC33;
	border-width:1px 1px 1px 20px;
	outline-style: outset;
	outline-width: 5px;
	width: auto
	height: auto;
	margin-top: 10px;
	margin-right: 10px;
	float: left;
	padding: 5px;
	text-align: left;
}
/*   red ＴＯＰ記事   */
.bd-red{
	border-style: solid;
	border-color:#FF0000;
	border-width:1px 1px 1px 20px;
	outline-style: outset;
	outline-width: 5px;
	width: auto;
	height: auto;
	margin-top: 10px;
	margin-right: 10px;
	float: left;
	padding: 5px;
	text-align: left;
}
/*   bule 輸入雑誌記事・ビジネス   */
.bd-bule{
	border-style: solid;
	border-color:#0066CC;
	border-width:1px 1px 1px 20px;
	outline-style: outset;
	outline-width: 5px;
	width: auto;
	height: auto;
	margin-top: 10px;
	margin-right: 10px;
	float: left;
	padding: 5px;
	text-align: left;
}
/*   green 国内書記事・広東台湾  */
.bd-green{
	border-style: solid;
	border-color:#00CC00;
	border-width:1px 1px 1px 20px;
	outline-style: outset;
	outline-width: 5px;
	width: auto;
	height: auto;
	margin-top: 10px;
	margin-right: 10px;
	float: left;
	padding: 5px;
	text-align: left;
}
/*   purple 自社・店舗記事・中級   */
.bd-purple{
	border-style: solid;
	border-color:#D14775;
	border-width:1px 1px 1px 20px;
	outline-style: outset;
	outline-width: 5px;
	width: auto;
	height: auto;
	margin-top: 10px;
	margin-right: 10px;
	float: left;
	padding: 5px;
	text-align: left;
}
/*   pink ピンク・入門   */
.bd-pink{
	border-style: solid;
	border-color:#ffc0cb;
	border-width:1px 1px 1px 20px;
	outline-style: outset;
	outline-width: 5px;
	width: auto;
	height: auto;
	margin-top: 10px;
	margin-right: 10px;
	float: left;
	padding: 5px;
	text-align: left;
}
/*   pink オレンジ・中級   */
.bd-orange{
	border-style: solid;
	border-color:#ffa500;
	border-width:1px 1px 1px 20px;
	outline-style: outset;
	outline-width: 5px;
	width: auto;
	height: auto;
	margin-top: 10px;
	margin-right: 10px;
	float: left;
	padding: 5px;
	text-align: left;
}
/*   greenyellow 黄緑・辞書   */
.bd-greenyellow{
	border-style: solid;
	border-color:#adff2f;
	border-width:1px 1px 1px 20px;
	outline-style: outset;
	outline-width: 5px;
	width: auto;
	height: auto;
	margin-top: 10px;
	margin-right: 10px;
	float: left;
	padding: 5px;
	text-align: left;
}
/*   skyblue 黄緑・辞書   */
.bd-skyblue{
	border-style: solid;
	border-color:#87ceeb;
	border-width:1px 1px 1px 20px;
	outline-style: outset;
	outline-width: 5px;
	width: auto;
	height: auto;
	margin-top: 10px;
	margin-right: 10px;
	float: left;
	padding: 5px;
	text-align: left;
}


.t01{ font-size:92%; padding:6px 12px 6px 18px; font-weight: bold;}
.t01s{ font-size:80%; padding:4px 12px; font-weight: bold;}
.t01b{ font-size:92%; padding:4px 12px 4px 18px; padding:8px 12px 6px 18px; font-weight:bold;}
.t02{ font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; padding:5px 12px; line-height:140%;}
.t02b{ font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; padding:5px 12px; font-weight:bold; line-height:140%;}
.t03{ font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; padding:4px 20px;}
.t04{ padding:4px 20px;}
.t04b{ padding:4px 20px 0px 20px;}
.pic{ padding:0px 0px 20px 20px; text-align:center; vertical-align:top;}
.pt04{ padding:4px 0px 0px 0px}
.py20{ padding:0px 20px}
.pl10{ padding:0px 0px 0px 10px}
.pl20{ padding:0px 0px 0px 20px}
.pr10e{ padding-right:10px; font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif;}


.t05{ text-align:center; vertical-align:middle; background-color:#E1E890; border:solid #EDEFB2; border-width:1px 0px 0px 1px; border-bottom:solid 1px #999999;
 font:70% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; font-weight:bold;}
.t06{ background-image:url(/img/sc_line01.gif); background-repeat:no-repeat; background-position:0% 50%; background-color:#E1E890;
 text-align:center; vertical-align:middle; border-top:solid 1px #EDEFB2; border-bottom:solid 1px #999999;
 font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; font-weight:bold; line-height:120%;}
.t25{ text-align:center; vertical-align:middle; background-color:#F2D861; border:solid #FBDFBD; border-width:1px 0px 0px 1px; border-bottom:solid 1px #999999;
 font:70% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; font-weight:bold;}
.t26{ background-image:url(/img/sc_line02.gif); background-repeat:no-repeat; background-position:0% 50%; background-color:#F2D861;
 text-align:center; vertical-align:middle; border-top:solid 1px #FBDFBD; border-bottom:solid 1px #999999;
 font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; font-weight:bold; line-height:120%;}
.t35{ text-align:center; vertical-align:middle; background-color:#D5E7EA; border:solid #DBEAEA; border-width:1px 0px 0px 1px; border-bottom:solid 1px #999999;
 font:70% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; font-weight:bold;}
.t36{ background-image:url(/img/sc_line03.gif); background-repeat:no-repeat; background-position:0% 50%; background-color:#D5E7EA;
 text-align:center; vertical-align:middle; border-top:solid 1px #DBEAEA; border-bottom:solid 1px #999999;
 font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; font-weight:bold; line-height:120%;}

.t15s{ text-align:center; vertical-align:middle; background-color:#ebebeb; border:solid #999999; border-width:0px 0px 1px 0px;
 font:70% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; font-weight:bold;}
.t16{ text-align:center; vertical-align:middle; background-color:#ebebeb; border:solid #999999; border-width:0px 0px 1px 1px;
 font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; font-weight:bold;}
.t16s{ text-align:center; vertical-align:middle; background-color:#ebebeb; border:solid #999999; border-width:0px 0px 1px 1px;
 font:70% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif; font-weight:bold;}


.l01{ background-image:url(/img/line_x.gif); background-repeat:repeat-x; background-position:0% 100%;}
.l01b{ background-image:url(/img/line_x2.gif); background-repeat:repeat-x; background-position:0% 100%;}
.l02{ background-image:url(/img/line_x.gif); background-repeat:repeat-x; background-position:0% 100%; background-color:#F1EECB;}
.l22{ background-image:url(/img/line_x.gif); background-repeat:repeat-x; background-position:0% 100%; background-color:#F0E8D1;}
.l32{ background-image:url(/img/line_x.gif); background-repeat:repeat-x; background-position:0% 100%; background-color:#E9F1E8;}
.l02b{ background-image:url(/img/line_x2.gif); background-repeat:repeat-x; background-position:0% 100%; background-color:#F1EECB;}
.l03{ background-image:url(/img/line_x.gif); background-repeat:repeat-x; background-position:0% 0%;}
.l04{ background-image:url(/img/line_x3.gif); background-repeat:repeat-y; background-position:50% 0%;}

p {
	border-top-color: #FFCC00;


}


h1 {
  font-size: 160%;
  // font-weight: bold;
  padding: 4px;
  background-image:url(/img/line_x2.gif); background-repeat:repeat-x; background-position:0% 100%; background-color:#F1EECB;
}

#menu {
  width: 220px;
  float: left;
}

#body {
  float: left;
  font:83% "MS PGothic", Osaka, "ＭＳ Ｐゴシック",sans-selif;
}

#body h1 {
  font-size: 160%;
  padding: 6px;
  background-image:url(/img/line_x2.gif);
  background-repeat:repeat-x;
  background-position:0% 100%;
  background-color:#F1EECB;
}

#body h2 {
  font-size: 120%;
  padding: 6px;
  background-image:url(/img/line_x2.gif);
  background-repeat:repeat-x;
  background-position:0% 100%;
}

#right {
  width: 220px;
  float: left;
}


#footer {
  clear: both;
}

/*   リストのマーカーにイメージを指定する   */
/*   list-style-image   */
 .ul-shop { list-style-image: url("/img/parts/shop_bot.gif") }
 .ul-cbook {
	list-style-image: url("/img/parts/cbook_bot.gif");
	background-color: #FFFFFF;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 0px;
}
 .ul-cbook2 {
	list-style-image: url("/img/parts/cbook_bot.gif");
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
 .ul-kbook { list-style-image: url("/img/parts/kbook_bot.gif") }
 .ul-jbook { list-style-image: url("/img/parts/jbook_bot.gif") }
 .ul-cmag { list-style-image: url("/img/parts/cmag_bot.gif") }


/*   北京便り・上海便り・ネット語のタブ   */

span.bj_tab{ width:32px; height:225px;}
span.bj_tab a{ background:url(/img/beijin/bj-ac.jpg) no-repeat; display:block; overflow:hidden;}
span.bj_tab a img{ border:none}
span.bj_tab a:hover img{ visibility:hidden;}
span.bj_tab a:hover{ width:32px; height:225px;}

span.sh_tab{ width:32px; height:225px;}
span.sh_tab a{ background:url(/img/beijin/sh-ac.jpg) no-repeat; display:block; overflow:hidden;}
span.sh_tab a img{ border:none}
span.sh_tab a:hover img{ visibility:hidden;}
span.sh_tab a:hover{ width:32px; height:225px;}

span.cn_tab{ width:32px; height:323px;}
span.cn_tab a{ background:url(/img/beijin/cn-ac.jpg) no-repeat; display:block; overflow:hidden;}
span.cn_tab a img{ border:none}
span.cn_tab a:hover img{ visibility:hidden;}
span.cn_tab a:hover{ width:32px; height:323px;}


/*   リスト画像   */
.mk26 { list-style-image: url("/img/ar26.gif") }
.mk36 { list-style-image: url("/img/ar36.gif") }
.mk35 { list-style-image: url("/img/ar35.gif") }
.mk02 { list-style-image: url("/img/listbutton2.gif") }


/*   画像スクロール   */
/* Container DIV - automatically generated */
.simply-scroll-container {
	position: relative;
}

/* Clip DIV - automatically generated */
.simply-scroll-clip {
	position: relative;
	overflow: hidden;
	z-index: 2;
}

/* UL/OL/DIV - the element that simplyScroll is inited on
Class name automatically added to element */
.simply-scroll-list {
	position: absolute;   /*  スクロールの絶対位置   */
	top: 0;
	left: 0;
	z-index: 1;
	overflow: hidden;
	margin: 0;
	padding: 0;
	list-style: none;
}
	
.simply-scroll-list li {
	padding: 0;
/*	margin: 0;   */
	margin: 5;
	list-style: none;
}
	
.simply-scroll-list li img {
	border: none;
	display: block;
}

/* Custom class modifications - adds to / overrides above

.simply-scroll is default base class */

/* Container DIV     コンテナ全体の大きさを指定します  */
.simply-scroll {
/*	width: 690px;  */
	width: *px;
/*	height: 150px;  */
	height: 160px;
	margin-bottom: 1em;
}

/* Clip DIV */
.simply-scroll .simply-scroll-clip {
/*	width: 690px;   */
	width: *px;
	height: 180px;
}
	
/* Explicitly set height/width of each list item */	
.simply-scroll .simply-scroll-list li {
	float: left; /* Horizontal scroll only */
	width: 120px;
	height: 180px;
}


/*   画像の数をそろえる  */
#content { border:1px solid black; }
#content img { float:left; margin:20px 10px 20px 10px; border:1px solid #333;}
#content {background-image:url(/img/book_bk.jpg);}




/* --- トップページ今週のおすすめ --- */
/* --- ボックス --- */
div.section {
width: 15*px; /* ボックスの幅 */
/* width: 300px; /* ボックスの幅 */
padding-bottom: 1px; /* ボックスの下パディング */
background-color: #f5f5f5; /* ボックスの背景色 */
font-size: 80%; /* ボックスの文字サイズ */
}

/* --- 見出しエリア --- */
div.section div.heading {
margin: 0 0 1em; /* 見出しエリアのマージン（上、左右、下） */
padding: 5px; /* 見出しエリアのパディング */
background: #ff9966 top; /* 見出しエリアの背景 */
/*background: #ff0033 top; /* 見出しエリアの背景 */
/* background: #ff9966 url(/img/head2.gif) repeat-x top; /* 見出しエリアの背景 */
/* background: #3f3f3f url(/img/head2.gif) repeat-x top; 見出しエリアの背景 */
border: 1px #666666 solid; /* 見出しエリアの境界線 */
}

/* --- 見出しエリア 2--- */
div.section div.heading2 {
margin: 0 0 1em; /* 見出しエリアのマージン（上、左右、下） */
padding: 5px; /* 見出しエリアのパディング */
background: #ee99cc top; /* 見出しエリアの背景 */
/* background: #ffcccc url(/img/head2.gif) repeat-x top; /* 見出しエリアの背景 */
/* background: #3f3f3f url(/img/head2.gif) repeat-x top; 見出しエリアの背景 */
border: 1px #666666 solid; /* 見出しエリアの境界線 */
}

/* --- 見出しエリア 3--- */
div.section div.heading3 {
margin: 0 0 1em; /* 見出しエリアのマージン（上、左右、下） */
padding: 5px; /* 見出しエリアのパディング */
background: #ccccff top; /* 見出しエリアの背景 */
/* background: #ffcccc url(/img/head2.gif) repeat-x top; /* 見出しエリアの背景 */
/* background: #3f3f3f url(/img/head2.gif) repeat-x top; 見出しエリアの背景 */
border: 1px #666666 solid; /* 見出しエリアの境界線 */
}

/* --- 見出しエリア 4--- */
div.section div.heading4 {
margin: 0 0 1em; /* 見出しエリアのマージン（上、左右、下） */
padding: 5px; /* 見出しエリアのパディング */
background: #ffccff top; /* 見出しエリアの背景 */
/* background: #ffcccc url(/img/head2.gif) repeat-x top; /* 見出しエリアの背景 */
/* background: #3f3f3f url(/img/head2.gif) repeat-x top; 見出しエリアの背景 */
border: 1px #666666 solid; /* 見出しエリアの境界線 */
}

/* --- 見出し --- */
div.section h3 {
margin: 0;
padding: 2px 0 2px 7px; /* 見出しのパディング（上右下左） */
border-left: 4px #ffffff solid; /* 見出しの左境界線 */
/* border-left: 4px #add8e6 solid; 見出しの左境界線 */
font-size: 100%; /* 見出しの文字サイズ */
color: #f9f9f9; /* 見出しの文字色 */
line-height: 100%;
}

/* --- ボックス内の段落 --- */
div.section p {
margin: 1em 10px; /* 段落のマージン（上下、左右） */
}

/* --- トップページ今週のおすすめ --- */

/* --- メールマガジン関連 -- */
.btn {
	text-decoration:none;
	color: #FFF;
/*	background-color: #666; */
	background-color: #6699ff;
	padding:10px 16px;
	font-weight:bold;
	margin-right:10px;
	text-align:center;
	cursor:pointer;
	display: inline-block;
}

.social .soc-btn {
	padding: 3px 7px;
	font-size:12px;
	margin-bottom:10px;
	text-decoration:none;
	color: #FFF;font-weight:bold;
	display:block;
	text-align:center;
}
a.fb { background-color: #3B5998!important; }
a.tw { background-color: #1daced!important; }
a.gp { background-color: #DB4A39!important; }
a.ms { background-color: #000!important; }


.mailhead {
  font-size: 160%;
  // font-weight: bold;
  color: #FFFFFF;
  padding: 4px;
}


.cds-navi,
.cds-navi ul { list-style-type: none; }

.cds-navi { margin: 0 0 2em; padding: 0; }

/*  メニュー間のスペース  */
.cds-navi ul { margin: 1px 0 0; padding: 0; }

.cds-navi li { display: inline; }

/*
.cds-navi li a,
.cds-navi ul li a {
  text-align: center;
  margin-bottom: 1px;
  padding: 5px 0;
  width: 100%;/
  display: block;
  text-decoration: none;
}
*/

.cds-navi li a,
.cds-navi li a {
  margin-bottom: 1px;  /*  下に1pxのスペースを空ける */
  padding: 10px 0 5px 10px;  /*  上右下左伸すペース  */
  display: block;
/*  width: 165px;  */
  width: 126px;         /*  幅を指定  */
/*  height: 20px;  */
  text-decoration: none;
/*  border-left: 5px solid #000000;  */
  border-left: 10px solid #cc0000;  /*
/*  background-color: #eeeeee;  */
  background-color: #ffc0cb;
  color: #7b1212;
  font-size: 90%;

}


/*  親メニューの背景色と文字色の指定  */
.cds-navi a {
  background-color: #ffc0cb;   /*  薄いピンク  */
  color: #7b1212;              /*  暗い赤  */
/*    background-color: #000000;   */
/*    color: #ffffff;   */
}
/*  子メニューの背景色と文字色の指定  */
.cds-navi ul a {
  background-color: #FF915A;   /*  オレンジ  */
  color: #ffffff;              /*  白  */
}

/*  親子のオンマウス時の背景色と文字色の指定  */

/*
.cds-navi a:hover,
.cds-navi ul a:hover {
  background-color: #ffccff;
  color: #ff0000;
  text-decoration: underline;
}
*/
/*  オンマウスの時の状態  */
.cds-navi a:hover,
.cds-navi ul a:hover {
/*  .cds-navi li a:hover {  */
  background-color: #ff7878;
  color: #ffffff;
  border-left: 10px solid #ff0000;
  font-size: 90%;
}



/*  中文書近刊リスト用 2015.2.16  */
.cb-navi {
  list-style-type: none;
  margin: 0 0 2em;
  padding: 0;
}

.cb-navi li { display: inline; }

.cb-navi li a {
  margin-bottom: 1px;  /*  下に1pxのスペースを空ける */
  padding: 10px 0 5px 10px;  /*  上右下左伸すペース  */
  display: block;
/*  width: 148px;  */
  width: 126px;         /*  幅を指定  */
/*  height: 20px;  */
  text-decoration: none;
/*  border-left: 5px solid #000000;  */
  border-left: 10px solid #66cc33;
  border-top: 1px solid #66cc33;
  border-right: 1px solid #66cc33;
  border-bottom: 1px solid #66cc33;
/*  background-color: #eeeeee;  */
  background-color: #ffffff;
  color: #339933;
  font-size: 80%;

}
/*  オンマウスの時の状態  */
.cb-navi li a:hover {
  background-color: #ffffff;
  color: #339933;
  border-left: 10px solid #2e8b57;
  border-top: 1px solid #2e8b57;
  border-right: 1px solid #2e8b57;
  border-bottom: 1px solid #2e8b57;
  font-size: 80%;
}



/*  TOPメニューのレイアウトに関する記述  2014.5.29 */
#globalnavi{
  margin: 0;
  padding: 0;
  width: ***;
}

#globalnavi ul{
  list-style-type: none;
  margin: 0;
  padding: 0;
}

#globalnavi li{
  float: left;
  width: 100px;
  margin: 1;
  padding: 0;
}

#globalnavi a{
  text-align: center;
  display:block;
  padding: 0.5em 0;
  width: 100%;
  background-color: black;
  color: white;
}

#globalnavi a:hover{
  background-color: red;
  color: white;
}


/*  WEB東方・TOPメニューのレイアウトに関する記述  2014.5.29 */
#toho-globalnavi{
  margin: 0;
  padding: 0;
  width: ***;
}

#toho-globalnavi ul{
  list-style-type: none;
  margin: 0;
  padding: 0;
}

#toho-globalnavi li{
  float: left;
  width: 150px;
  margin: 1;
  padding: 0;
}

#toho-globalnavi a{
  text-align: center;
  display:block;
  padding: 0.5em 0;
  width: 100%;
  background-color: #ffb6c1;
  color: white;
}

#toho-globalnavi a:hover{
  background-color: 40e0d0;
  color: white;
}


/*  TOPページの近刊書  2015.3.9 */
#recent{
  margin: 0;
  padding: 0;
  width: ***;
}

#recent ul{
  list-style-type: none;
  margin: 0;
  padding: 0;
  font-size: 80%; /** フォントサイズ指定 **/
}

#recent li{
  float: left;
  width: 80px;
  margin: 1;
  padding: 0;
}

#recent a{
  text-align: center;
  display:block;
  padding: 0.5em 0;
  width: 100%;
  background-color: #ffb6c1;
  color: white;
}

#recent a:hover{
  background-color: 40e0d0;
  color: white;
}

/*  東方　図書目録メニューのレイアウトに関する記述  2016.8.9   */
#toho-catalogs{
  margin: 0;
  padding: 0;
  width: ***;
  height: 100%;
}

#toho-catalogs ul{
  list-style-type: none;
  margin: 0;
  padding: 0;
  font-size: 80%; /** フォントサイズ指定 **/
}

#toho-catalogs li{
  float: left;
  width: 100px;
  margin: 1;
  padding: 0;
}

#toho-catalogs a{
  text-align: center;
  display:block;
  padding: 0.5em 0;
  width: 100%;
  background-color: #191970;
  color: white;
}

#toho-catalogs a:hover{
  background-color: 87ceeb;
  color: white;
}

/*  縦アコーディオン CSS   216.08.31 */
label {
    background: #0099FF;
    color: #fff;
    padding: 10px;
    display: block;
    margin: 0;
    border: 1px solid #fff;
    width: 128px;
    height: 13px;
    font-size: 80%; /** フォントサイズ指定 **/
}

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;
    padding: 0;
    list-style: none;
    font-size: 80%; /** フォントサイズ指定 **/

}

.menu li {
    padding: 5px;
    margin: 1;
    border: 1px solid #0099FF;
    width: 136px;
    height: 13px;
}

input[type="checkbox"].on-off + ul{
    height: 0;
    overflow: hidden;
}

input[type="checkbox"].on-off:checked + ul{
    height: 350px;
}


/*  簡単なタブ切替え  */

  /* ▼タブ機能の掲載領域の装飾(※必須ではありません) */
   .tabbox { margin: 0px; padding: 1em; background-color: #f8f8ff; }

   /* ▼タブ機能を制御するラジオボタン(非表示にする) */
   .tabbox input { display: none; }

   /* ▼タブ(共通装飾＋非選択状態の装飾) */
   .tab {
      display: inline-block;
      border-width: 1px 1px 0px 1px;
      border-style: solid;
      border-color: black;
      border-radius: 0.75em 0.75em 0px 0px;
      padding: 0.75em 1em;
      color: black;
      background-color: #e0e0e0;
      font-weight: bold;
   }

   /* ▼タブにマウスポインタが載った際の装飾 */
   .tab:hover {
      background-color: #ccffcc;
      color: green;
      cursor: pointer;
   }

   /* ▼チェックが入っているラジオボタンの隣にあるタブの装飾(＝選択状態のタブ) */
   input:checked + .tab {
      color: red;
      background-color: #ffffcc;
      position: relative;
      z-index: 10;
   }

   /* ▼タブの中身(共通装飾＋非選択状態の装飾) */
   .tabcontent {
      display: none;
      border: 1px solid black;
      margin-top: -1px;
      padding: 1em;
      position: relative;
      z-index: 0;
      background-color: #ffffffc;

/*      background-color: #ffffcc;  */
   }

   /* ▼チェックが入っているラジオボタンに対応するタブの中身を表示する */
   #tabcheck1:checked ~ #tabcontent1 { display: block; }
   #tabcheck2:checked ~ #tabcontent2 { display: block; }
   #tabcheck3:checked ~ #tabcontent3 { display: block; }
   #tabcheck4:checked ~ #tabcontent4 { display: block; }

/*  簡単なタブ切替え＜おわり＞  */