@charset "UTF-8";
/* ===== for conc2/c*.html =================(Pcode:20)=== */

#header_in { background-image: url("../image/score01.gif"); }
#hdr_logo  { background-image: url("../image/hdr_logo.gif"); }
#content   { background-image: url("../image/wallpp1.gif"); }

/* ==== for 3-pane layout ===================== */

#wrapper {
	display: table;
	max-width: 1100px;
	min-width: 960px;
}
#sidebar, #mainbox {
	display: table-cell;	/* for ~IE7 */ *display: inline;  *zoom: 1;
	vertical-align: top;
}
#sidebar, #curtain {
	width: 160px;
	background-image: url("../image/side160.gif");
	background-repeat: repeat-y;
	-webkit-background-size: 160px 8px;
		background-size: 160px 8px;
}
#curtain {
	position: fixed;
	top: 0;  left: 0;
	height: 40px;	/* #fx_box{top} + #fx_ttl {height} */
	z-index: 12;
}
#header_in {
	padding-right: 25px;
}
/* @media only screen and (max-width:400px) {
	#header_in { padding-right: 15px; }
} */

/* "#top_mgn" does not exist. */

/* ---- Sidebar ------------------------------- */

#conBody {
	z-index: 11;
	margin-top: 60px;
	margin-bottom: 15px;
}
#conBody.fix_top {	/* for wide height window | refer to JS */
	position: fixed;
	top: 0;  left: 0;
	width: 160px;
	margin-bottom: 0;
}
#conBody.fix_bottom {	/* refer to JS */
	position: fixed;
	bottom: 0;  left: 0;
	width: 160px;
}
#con_ttl {
	color: #707070;
	font-weight: bold;
	text-align: center;
	margin: 0 2px 10px 0;	/* Don't change margin-top */
}
/* "#reserved" does not exist. */

#con_list {	/* UL */
	width: 108px;
	list-style-type: none;
	margin: 0 auto 0 26px;	/* left = (#sidebar{width} - width) / 2 | Don't change margin-bottom */
	padding-left: 0;
}
#con_list LI {
	white-space: nowrap;
	margin-bottom: 10px;
}
#con_list LI#backto_c2 {
	margin-bottom: 0;
}
#con_list A {
	display: block;
	width: auto;
	text-decoration: none;
	padding: 4px 2px 3px 7px;
	background-color: rgba(255,255,255,0.3);
	border-radius: 5px;
}
#con_list A:link, #con_list A:visited { color: #006060; }
#con_list A:hover, #con_list A:active {
	color: #0000FF;
	background-color: #FFFFFF;
	box-shadow: 6px 6px 6px rgba(0,0,0,0.25);
}
#con_list A#here1 {
	cursor: default;
	color: #000000;
	background-color: #FCFCFC;
	background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), color-stop(0.49, #FCFCFC), color-stop(0.50, #F4F4F4), to(#E4E4E4));
	background: -webkit-linear-gradient(top, #FFFFFF, #FCFCFC 49%, #F4F4F4 50%, #E4E4E4);
	background: linear-gradient(to bottom,   #FFFFFF, #FCFCFC 49%, #F4F4F4 50%, #E4E4E4);
	box-shadow: 4px 4px 4px rgba(0,0,0,0.25);
}

/* ---- Flexible Menu ------------------------- */

#fx_box {
	position: fixed;
	top: 15px;
	left: 17px;	/* (#sidebar{width} - width) / 2 */
	width: 126px;	/* #fx_menu + padding*2 + border*2 */
	padding: 2px;
	background-color: #FFFFFF;
	border: solid 1px #404040;
	box-shadow: 6px 6px 6px rgba(0,0,0,0.5);
}
#fx_ttl {
	height: 25px;	/* 13(height of IMG) + padding */
	text-align: center;
	padding: 6px 0 6px 1px;
	background-color: #007878;
	background: -webkit-gradient(linear, left top, left bottom, from(#006868), to(#008888));
	background: -webkit-linear-gradient(top, #006868, #008888);
	background: linear-gradient(to bottom,   #006868, #008888);
	border-bottom: none;
}
#fx_ttl.onhover {	/* for jQuery*/
	height: 26px;	/* 13(height of IMG) + padding + border */
	border-bottom: solid 1px #FFFFFF;
}
#fx_menu { display: none; }	/* for jQuery */

#fx_menu LI {
	/* margin-bottom: 0; */
	border-bottom: solid 1px #FFFFFF;
}
#fx_menu A {
	color: #FFFFFF;
	padding: 6px 2px 5px 7px;
	background-color: #808080;
	/* border-radius: 0; */
}
#fx_menu A:link, #fx_menu A:visited { color: #FFFFFF; }
#fx_menu A:hover, #fx_menu A:active {
	color: #FFFF00;
	background-color: #4040FF;
	/* box-shadow: none; */
}
#fx_menu LI#fx_home {
	border-bottom: none;
}
#fx_menu LI#fx_home A {
	padding-left: 25px;
}

@media only screen and (max-width:999px) {
	#sidebar, #curtain {
		width: 140px;	/* = #mainbox {margin-left} (= #header {left}) */
		background-image: url("../image/side140.gif");
		-webkit-background-size: 140px 8px;
			background-size: 140px 8px;
	}
	#conBody.fix_top, #conBody.fix_bottom { width: 140px; }
	#con_list { margin-left: 16px; }	/* (#sidebar{width} - width) / 2 */
	#fx_box { left: 7px; }	/* (#sidebar{width} - width) / 2 */
}
@media only screen and (min-width:1101px) {
	#wrapper { box-shadow: 32px 0px 64px rgba(254,254,252,1); }	/* #FEFEFC */
	#mainbox { width: 940px; }
	#content { padding-right: 15px; }
}
@media only screen and (min-width:1101px) and (max-width:1120px) {
	#wrapper {
		width: 1100px;
		max-width: 1100px;
		min-width: 1100px;
	}
}
@media only screen and (min-width:1121px) {
	#wrapper {
		width: 1120px;
		max-width: 1120px;
		min-width: 1120px;
	}
	#sidebar, #curtain {
		width: 180px;	/* = #mainbox {margin-left} (= #header {left}) */
		background-image: url("../image/side180.gif");
		-webkit-background-size: 180px 8px;
			background-size: 180px 8px;
	}
	#conBody.fix_top, #conBody.fix_bottom { width: 180px; }
	#con_list { margin-left: 36px; }	/* (#sidebar{width} - width) / 2 */
	#fx_box { left: 27px; }	/* (#sidebar{width} - width) / 2 */
}

/* ==== @ Print =============================== */

@media print {
	#curtain, #conBody { display: none !important; }
}