/* Common Classes
----------------------------------------------------- */

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

.clearfix:after,
.breadcrumb:after,
#main:after,
header:after,
nav:after,
section:after,
footer:after,
ul:after,
dl:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	overflow: hidden;
}

.clearfix,
.breadcrumb,
#main,
header,
nav,
section,
footer,
ul,
dl {display: inline-block;}

* html .clearfix,
* html .breadcrumb,
* html #main,
* html header,
* html nav,
* html section,
* html footer,
* html ul,
* html dl {height: 1%;}

.clearfix,
breadcrumb,
#main,
header,
nav,
section,
footer,
ul,
dl {display: block;}

.hide {
	height: 0;
	width: 0;
	overflow: hidden;
	position: absolute;
}

input ,select{
vertical-align:middle !important;
}

input.text {
	display: inline-block;
	border:solid 1px #e5e5e5;
	font-size: 16px;
	width: 16em;
	max-width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	z-index: 1;
	-webkit-border-radius: 2px 0 0 2px;
	-moz-border-radius: 2px 0 0 2px;
	border-radius: 2px 0 0 2px;
	-webkit-box-shadow: inset 0px 0px 2px rgba(0,0,0,0.1);
	-moz-box-shadow: inset 0px 0px 2px rgba(0,0,0,0.1);
	box-shadow: inset 0px 0px 2px rgba(0,0,0,0.1);
}

textarea.code {
	width: 100%;
	font-size: 12px;
	font-family: monospace;
	border: solid 1px #e5e5e5
}

.btn {
	position: relative;
	display: inline-block;
	color: white;
	background-color: #0066bb;
	border: 0;
	padding: 4px;
	font-family: arial;
	line-height: 1;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	cursor: pointer;
	font-size: 10px;
	text-decoration: none;
	text-shadow: none;
	text-align: center;	
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	
	-webkit-box-shadow: 0px 1px 0px rgba(0,0,0,.15);
	-moz-box-shadow: 0px 1px 0px rgba(0,0,0,.15);
	box-shadow: 0px 1px 0px rgba(0,0,0,.15);
	
	background-image: -webkit-linear-gradient(top, rgba(255,255,255,.25), rgba(255,255,255,0));
	background-image: -moz-linear-gradient(top, rgba(255,255,255,.25), rgba(255,255,255,0));
	background-image: -o-linear-gradient(top, rgba(255,255,255,.25), rgba(255,255,255,0));
	background-image: -ms-linear-gradient(top, rgba(255,255,255,.25), rgba(255,255,255,0));
	background-image: linear-gradient(top, rgba(255,255,255,.25), rgba(255,255,255,0));
}


.ie7 .btn {
	display: inline;
}

.lt-ie10 .btn {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#55ffffff,endColorstr=#00ffffff);
}

.btn.disabled,
.btn[disabled] {
	opacity: 1;
	-ms-filter: "alpha( opacity=100 )";
	filter: alpha( opacity=100 );
	cursor: default;
	pointer-events: none;
	text-shadow: none;
}




.form {
	border: solid 2px #e5e5e5;
	position: relative;
	padding: 10px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin: 2em 0;
	text-align: center;
}

.wdlib .form {
	text-align: left;
	padding: 20px;
}

.wdlib .form p {
	margin: 0;
}

.entr {
	margin: 2em 0;
	text-align: center;
}

.pc .entr.short {
	text-align: left;
	margin: 1em 0;
}

.form .entr {
	margin: 1em 0;
}
.entr .btn {
	font-size: 18px;
	padding: 0.5em 1em;
	font-weight: bold;
	margin: 0 2px;
	white-space: nowrap;
}
.entr--wide .btn {
	min-width: 8em;
}

.entr.multi {
	margin-top: 1em !important;
}

.entr.multi .btn {
	font-size: 16px;
	width: 15em;
	line-height: 1.2;
	white-space: nowrap;
}

.btn:hover {
	text-decoration: none;
	border-color:#2266bb;;
	background-color: #0077cc;
}

.btn:active,
.press .btn {
	border-color: #004499;
	background-color: #0066bb;
	/*-webkit-box-shadow: inset 0px 0px 3px rgba(0,0,0,.3);
	-moz-box-shadow: inset 0px 0px 3px rgba(0,0,0,.3);
	box-shadow: inset 0px 0px 3px rgba(0,0,0,.3);*/
	background-image: -webkit-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2));
	background-image: -moz-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2));
	background-image: -o-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2));
	background-image: -ms-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2));
	background-image: linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,.2));
}

.lt-ie10 .btn:active,
.lt-ie10 .press .btn {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#00ffffff,endColorstr=#55ffffff);
}

.btn.disabled:active,
.btn.disabled:hover {
	background-color: #0066bb;
	border: solid 1px #114499;
	font-family: arial;
	line-height: 1;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	cursor: default;
	text-decoration: none;
	text-align: center;	
	-webkit-box-shadow: inset 0px 1px 0px rgba(255,255,255,.2);
	-moz-box-shadow: inset 0px 1px 0px rgba(255,255,255,.2);
	box-shadow: inset 0px 1px 0px rgba(255,255,255,.2);	
	-webkit-text-shadow: 0 -1px 0px rgba(0,0,0,.3);
	-moz-text-shadow: 0 -1px 0px rgba(0,0,0,.3);
	text-shadow: 0 -1px 0px rgba(0,0,0,.3);	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background-image: -webkit-linear-gradient(top, rgba(255,255,255,.3), rgba(255,255,255,0));
	background-image: -moz-linear-gradient(top, rgba(255,255,255,.33), rgba(255,255,255,0));
	background-image: -o-linear-gradient(top, rgba(255,255,255,.3), rgba(255,255,255,0));
	background-image: -ms-linear-gradient(top, rgba(255,255,255,.3), rgba(255,255,255,0));
	background-image: linear-gradient(top, rgba(255,255,255,.3), rgba(255,255,255,0));
}

p.small,
span.small {
	font-size: 80%;
}

p.small {
	margin-top: -1em;
}

p.large,
span.large {
	margin: 2em 0 1em 0;
	font-size: 120%;
}

.red {
	color: #cc0033;
}

.center {
	text-align: center;
}



.ref a:link[href$=".zip"],
.ref a:link[href$=".lzh"],
.ref a:link[href$=".doc"] {
	position: relative;
	padding-right: 22px;
	
}

.ref a.zip:before,
.ref a:link[href$=".zip"]:before,
.ref a:link[href$=".lzh"]:before,
.ref a:link[href$=".doc"]:before {
	content: "";
	position: absolute;
	top:0;
	bottom:-1px;
	right: 0;
	display: inline-block;
	width: 20px;
	height: 20px;
	background:url(../images/icon-dl-20.png) 0 0 no-repeat;
}

.ref a.zip {
	position: relative;
	padding-left: 18px;
}

.ref a.zip:before {
	left: 0;
}
dl.ref{
	margin: 2em 0 !important;
	border-bottom: 1px solid #ddd;
	line-height: 1.6;

}

dl.ref dt {
	clear: both;
	width:70%;
	float: left;
	margin: 0 -1% 0 0 !important;
	padding: 12px 0 !important;
	border-top: 1px solid #ddd;
	font-weight: normal !important;
}

dl.ref dd {
	float: right;
	text-align: right;
	width: 31%;
	margin: 0 0 0 -1% !important;
	padding: 12px 0 !important;
	border-top: 1px solid #ddd;
	color: #999;

}

@media screen and (max-device-width:767px) {
	dl.ref dt {
		width: 60%;
	}
	dl.ref dd {
		width: 40%;
		font-size: 10px;
	}
}


@media screen and (min-device-width:768px) {
	.right {			
		float: right;
		margin: 0 0 0 20px;
	}

	.hidden-pc {
		display: none !important;
	}
}
/* Layout
----------------------------------------------------- */

#wrapper {
	position: relative;
	width: 958px;
	min-height: 100%;
	padding: 11px;
	margin: 0 auto;
	background-color: #fdfdfd;
	-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
	box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
}

#wrapper > header {
	position: relative;
	width: 100%;
	height: 28px;
	font-size: 0;
	line-height: 0;
}

#wrapper > header h1 {
	position: relative;
	float: left;
	margin: 0 5px 0 0;
	width: 65px;
	height: 28px;
}

#wrapper > header p {
	font-size: 10px;
	line-height: 1;
	margin: 0;
	padding: 17px 0 0 0;
}

#wrapper > header p a,
#wrapper > header p a:hover {
	color: #333;
	text-decoration: none;
}

#wrapper > header p strong {
	font-weight: bold;
}

#wrapper > header p em {
	display: none;
}

@media screen and (min-device-width:768px) {
	
	#lang{
		display: block;
		position: absolute;
		right: 63px;
		top: -28px;
	}
	
	#lang ul{
		display: block;
		margin: 0;
		padding: 0;
		list-style-type: none;
		border: solid 1px #e5e5e5;
		font-size: 0;
		line-height: 0;
		width: 85px;
		background-color: white;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		border-radius: 2px;	
	}
	
	#lang ul:hover{
		border-color: #ccc;
	}
	
	#lang.open ul{
		-webkit-box-shadow: 0px 2px 3px rgba(0,0,0,0.1);
		-moz-box-shadow: 0px 2px 3px rgba(0,0,0,0.1);
		box-shadow: 0px 2px 3px rgba(0,0,0,0.1);
	}
	
	
	.ja #lang ul li#lang-ja:after,
	.en #lang ul li#lang-en:after {
		content: "";
		position: absolute;
		display: block;
		top: 6px;
		right: 5px;
		width: 0;
		height: 0;
		border-top: solid 3px #ccc;
		border-left: solid 3px transparent;
		border-right: solid 3px transparent;
		z-index: 0;
		zoom: 1;
	}
	
	.ja #lang.open ul li#lang-ja:after,
	.en #lang.open ul li#lang-en:after {
		content: "";
		position: absolute;
		display: none;
		border: 0;
	}
		
	.en #lang.open {
		margin-top: -14px;
	}
	
	#lang ul li {
		width: 85px;	
		display: block;
		position: relative;
		background-image: -webkit-linear-gradient(top, #ffffff, #fcfcfc);
		background-image: -moz-linear-gradient(top, #ffffff, #fcfcfc);
		background-image: -o-linear-gradient(top, #ffffff, #fcfcfc);
		background-image: -ms-linear-gradient(top, #ffffff, #fcfcfc);
		background-image: linear-gradient(top, #ffffff, #fcfcfc);
		cursor: pointer;
	}

	.ie7 #lang ul li {
		display: inline;
	}
	
	#lang ul:hover li {
		background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
		background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
		background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
		background-image: -ms-linear-gradient(top, #ffffff, #f2f2f2);
		background-image: linear-gradient(top, #ffffff, #f2f2f2);
	}
	
	#lang ul li a {
		display: block;
		position: relative;
		padding: 0 0 0 18px;
		text-decoration: none;
		color:#666;
		z-index: 1;
		cursor: pointer;
		font-size: 10px;
		line-height: 14px;
	}
	
	
	#lang.open ul li {
		background-image: none;
	}
	
	#lang.open ul li a {
		background-color: #fff;
	}
	
	
	#lang.open ul li a:hover {
		color: #fff;
		background-color: #00b1ec;
	}
	
	#lang ul li#lang-en a,
	#lang ul li#lang-ja a {
		background-image: url(../images/icons.png);
		background-repeat: no-repeat;
	}
	
	#lang ul li#lang-ja a {
		background-position: 0 -40px;
	}
	
	#lang ul li#lang-en a {
		background-position: 0 -54px;
	}
	
	.ja #lang.open ul li#lang-ja,
	.ja #lang.open ul li#lang-en,
	.en #lang.open ul li#lang-ja,
	.en #lang.open ul li#lang-en {
		display: block;
	}
	
	.ja #lang ul li#lang-en,
	.en #lang ul li#lang-ja {
		display: none;
	}

	#rel {
		position: absolute;
		font-size: 0;
		top:-28px;
		right: 0;
		z-index: 10;
	}
}

@media only screen and (min-device-width:768px) and (-webkit-min-device-pixel-ratio: 2), 
only screen and (min-device-width:768px) and (min-device-pixel-ratio: 2) {
	#lang ul li#lang-en a,
	#lang ul li#lang-ja a {
		background-image: url(../images/icons@2x.png);
		background-size:16px 68px;
	}
}

#rel ul {
	display: block;
	list-style-type: none;
}

#rel li {
	display: inline;
}

#rel a {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-left: 5px;
	overflow: hidden;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	font-size: 12px;
	line-height: 18px;
	white-space: nowrap;
	color: white;
	vertical-align: top;
	background-image: -webkit-linear-gradient(top, rgba(255,255,255,.2), rgba(255,255,255,0));
	background-image: -moz-linear-gradient(top, rgba(255,255,255,.2), rgba(255,255,255,0));
	background-image: -o-linear-gradient(top, rgba(255,255,255,.2), rgba(255,255,255,0));
	background-image: -ms-linear-gradient(top, rgba(255,255,255,.2), rgba(255,255,255,0));
	background-image: linear-gradient(top, rgba(255,255,255,.2), rgba(255,255,255,0));
}

.lt-ie10 #rel a {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#55ffffff,endColorstr=#00ffffff);
}


#rel-rss a {
	background-color: #f6923b;
}

#rel-rss a:before {
	content: "\F09E";
	font-family: FontAwesome;
	display: inline-block;		
	width: 16px;
	height: 16px;
	margin-right: 16px;
	text-align: center;
	font-weight: normal;
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');	
}

#rel-twitter a {
	background-color: #09aeec;
}

#rel-twitter a:before {
	content: "\F099";
	font-family: FontAwesome;
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-right: 16px;
	text-align: center;
	font-weight: normal;
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');	
}

#rel-facebook a {
	background-color: #3b5998;
}

#rel-facebook a:before {
	content: "\F09A";
	font-family: FontAwesome;
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-right: 16px;
	text-align: center;
	font-weight: normal;
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}


/* gnav
----------------------------------------------------- */

@media screen and (min-device-width:768px) {
	nav#gnav {
		margin: 5px 0 0 0;
	}
	
	nav#gnav h2 {
		display: none;
	}
	
	#gnav-content {
		margin: 0;
		position: relative;
		display: block !important;
	}
	
	ul#gnav-main {
		position: relative;
		display: block;
		list-style-type: none;
		font-size: 0;
		line-height: 0;
		padding: 0;
		margin: 0;
		background-color: #f9f9f9;
		border: solid 1px #e0e0e0;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
		/*-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,.05), inset 0px 0px 1px rgba(255,255,255,1);
		-moz-box-shadow: 0px 1px 2px rgba(0,0,0,.05), inset 0px 0px 1px rgba(255,255,255,1);
		box-shadow: 0px 1px 2px rgba(0,0,0,.05), inset 0px 0px 1px rgba(255,255,255,1);*/
		background-image: -webkit-linear-gradient(top, #fefefe, #f4f4f4);
		background-image: -moz-linear-gradient(top, #fefefe, #f4f4f4);
		background-image: -o-linear-gradient(top, #fefefe, #f4f4f4);
		background-image: -ms-linear-gradient(top, #fefefe, #f4f4f4);
		background-image: linear-gradient(top, #fefefe, #f4f4f4);

	}
	
	.lt-ie10 ul#gnav-main {
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#ffeeeeee);
	}

	ul#gnav-main li {
		position: relative;
		display: inline-block;
		font-weight: bold;
		line-height: 1;
		margin: -1px 0px -1px -1px;
		border: solid 1px #e0e0e0;
		overflow:hidden; 
	}
	
	ul#gnav-main li a {
		display: block;
		line-height: 31px;
		font-size: 14px;
		padding: 0 20px;
		color: #0072bc;
		text-align: center;
		zoom:1;
		-webkit-transition:0.1s ease-in-out;
		-moz-transition:0.1s ease-in-out;
		transition:0.1s ease-in-out;
	}

	ul#gnav-main li:first-child {
		-webkit-border-radius: 4px 0 0 4px;
		-moz-border-radius: 4px 0 0 4px;
		border-radius: 4px 0 0 4px;
	}
	
	ul#gnav-main li:first-child a {
		-webkit-border-radius: 3px 0 0 3px;
		-moz-border-radius: 3px 0 0 3px;
		border-radius: 3px 0 0 3px;
	}
	
	.ie7 ul#gnav-main li {
		display: inline;
		zoom:1;

	}
	
	ul#gnav-main li a:hover {
		text-decoration: none;
		color: #00b1ec;
	}
	
	.home #nav-home,
	.currentissue #nav-currentissue,
	.backnumber #nav-backnumber,
	.archive #nav-archive,
	.mailmag #nav-mailmag,
	.teiki #nav-teiki,
	.wdlib #nav-wdlib,
	.home #nav-home:hover,
	.currentissue #nav-currentissue:hover,
	.backnumber #nav-backnumber:hover,
	.archive #nav-archive:hover,
	.archive #nav-archive:hover,
	.mailmag #nav-mailmag:hover,
	.teiki #nav-teiki:hover,
	.wdlib #nav-wdlib:hover {
		z-index: 10;
		border-color:#22ade0;
	}
	
	.home #nav-home a,
	.currentissue #nav-currentissue a,
	.backnumber #nav-backnumber a,
	.archive #nav-archive a,
	.mailmag #nav-mailmag a,
	.teiki #nav-teiki a,
	.wdlib #nav-wdlib a {
		background-color: #00b1ec;
		color: white;
		-webkit-text-shadow: none;
		-moz-text-shadow: none;
		text-shadow: none;
		/*-webkit-box-shadow: inset 0px 0px 2px rgba(0,0,0,.2);
		-moz-box-shadow: inset 0px 0px 2px rgba(0,0,0,.2);
		box-shadow: inset 0px 0px 2px rgba(0,0,0,.2);
		background-image: -webkit-linear-gradient(top, #00b8e8, #00a1e6);
		background-image: -moz-linear-gradient(top, #00b8e8, #00a1e6);
		background-image: -o-linear-gradient(top, #00b8e8, #00a1e6);
		background-image: -ms-linear-gradient(top, #00b8e8, #00a1e6);
		background-image: linear-gradient(top, #00b8e8, #00a1e6);*/
	}
	
	#nav-home a {
		font-size: 0 !important;
		line-height: 0 !important;
	}
	
	#nav-home a:before {
		content: "\F015";
		font-size: 14px;
		line-height: 31px;
		display: inline-block;
		font-weight: normal;

		text-align: center;
		font-family: FontAwesome;
	}

}







.lt-ie10 .home #nav-home a,
.lt-ie10 .currentissue #nav-currentissue a,
.lt-ie10 .backnumber #nav-backnumber a,
.lt-ie10 .archive #nav-archive a,
.lt-ie10 .mailmag #nav-mailmag a,
.lt-ie10 .teiki #nav-teiki a,
.lt-ie10 .wdlib #nav-wdlib a {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#00000000,endColorstr=#22000000);
}

.home #nav-home a:hover,
.currentissue #nav-currentissue a:hover,
.backnumber #nav-backnumber a:hover,
.archive #nav-archive a:hover,
.mailmag #nav-mailmag a:hover,
.teiki #nav-teiki a:hover,
.wdlib #nav-wdlib a:hover {
	text-decoration: none;
	color: white;
}

#search-form {
	display: block;
	position: absolute;
	top:0;
	right: 0;
	width: 133px;
	border: solid 1px #e5e5e5;
	margin: 5px;
	height: 20px;
	
	border-radius: 3px;
	font-size: 0;
	line-height: 1;
}

#search-form:before {
	content: "\F002";
	font-family: FontAwesome;
	display: block;
	position: absolute;
	top:3px;
	right: 4px;
	font-size: 13px;
	line-height: 1;
	color: #999;
	z-index: 1;
	width: 1em;
	cursor: pointer;
	text-align: center;
	font-weight: normal;
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

#search-form input {
	border: 0;
	margin: 0;
	padding: 0;
	position: relative;
	vertical-align: middle;
}

#search-form input.text {
	-webkit-appearance: none;
	appearance: none;
	position: absolute;
	top:0;
	left: 0;
	display: block;
	margin: 0;
	height: 16px;
	line-height: 1;
	font-size: 11px;
	width: 108px;
	padding: 2px;
	z-index: 1;
	border: 0;
	-webkit-border-radius: 2px 0 0 2px;
	-moz-border-radius: 2px 0 0 2px;
	border-radius: 2px 0 0 2px;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;	
}

#search-form input.submit {
	position: absolute;
	z-index: 2;
	display: block;
	font-size:0;
	line-height: 0;
	top:-1px;
	right: -1px;
	margin: 0;
	width: 22px;
	height: 22px;
	padding: 0;
	text-indent: 100%;
	cursor: pointer;
	background-color: transparent;
	background-image: url(../images/transparent.gif);
	border: solid 1px #e5e5e5;
	-webkit-border-radius: 0 2px 2px 0;
	-moz-border-radius: 0 2px 2px 0;
	border-radius: 0 2px 2px 0;

}

.ie7 #search-form input.submit {
	border: 0;
}

#search-form input.submit:hover {
	border-color: #ddd;
}
#search-form input.submit:active {
	-webkit-box-shadow: inset 0px 0px 2px rgba(0,0,0,.2);
	-moz-box-shadow: inset 0px 0px 2px rgba(0,0,0,.2);
	box-shadow: inset 0px 0px 2px rgba(0,0,0,.2);
}



/* Main
----------------------------------------------------- */


#main {
	margin: 12px 0 12px 0;
}


/* Content Base
----------------------------------------------------- */

#content {
	float: left;
	width: 644px;
	position: relative;
	border: solid 1px #eee;
	background-color: #fff;
	padding: 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,.05);
	-moz-box-shadow: 0px 1px 2px rgba(0,0,0,.05);
	box-shadow: 0px 1px 2px rgba(0,0,0,.05);
}



.single #content {
	float none;
	width: 100%;
}

.snav {
	position: relative;
	padding: 6px 5px 4px 5px;
	border-bottom: solid 1px #f4f4f4;
	font-size: 0;
	line-height: 0;
}

#bottom .snav {
	border-bottom: 0;	
	border-top: solid 1px #f4f4f4;
}


.breadcrumb {
	float: left;
	width: 70%;
	min-height: 14px;
	margin: 0;
	padding: 0;
	color: #fff;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 0;
	line-height: 0;
}

.breadcrumb * {
	vertical-align: bottom;
}
.detail .breadcrumb,
.sub .breadcrumb,
.mailmag .breadcrumb,
.doc .breadcrumb,
.special .breadcrumb,
.sp .breadcrumb,
.nbc .breadcrumb {
	float: none;
	width: 100%;
}


.breadcrumb a {
	position: relative;
	display: inline;
	color: #999;
	font-size: 13px;
	line-height: 18px;
	cursor: pointer;
	padding: 0 0 0 0;
	margin: 0 5px 0 0;
}

.breadcrumb a:hover {
	text-decoration: none;
	cursor: default;
}

.breadcrumb a[href^="/wd/"]:hover,
.breadcrumb a[href^="./"]:hover {
	cursor: pointer;
	color: #333;
}

.breadcrumb a.home {
	display: inline-block;
	position: relative;
	width: 1em;
	height: 18px;
	line-height: 18px;
	overflow: hidden;
	white-space: nowrap !important;
	vertical-align: middle;
}

.breadcrumb a:before {
	content: "\F105";
	font-family: FontAwesome;
	display: inline;
	color: #e9e9e9;
	margin-right: .5em;
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

.breadcrumb a.home:before {
	content: "\F015";
	display: block;
	width: 1em;
	text-align: center;
	font-family: FontAwesome;
	margin-right: 5px;
	color: #999;
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

.breadcrumb a.home:hover:before {
	color: #333;
}


.sns {
	position: relative;
	min-height: 20px;
	height: 20px;
	padding: 5px;
	border-top: solid 1px #f4f4f4;
	border-bottom: solid 1px #f4f4f4;
	font-size: 0;
	line-height: 1;
	margin: -1px 0;
	background-color: white;
}

#bottom .sns {
	margin-bottom: 0;
	border-bottom: 0;
	background-color: transparent;
	white-space: nowrap;
}

.addthis_toolbox > * {
	display: block !important;
	margin: 0 0 2px 0 !important;
	height: 20px;
	padding: 0 2px 0 0 !important;
}

.addthis_counter {
	display: block !important;
}

.addthis_button_facebook_like,
.addthis_button_facebook_like iframe {
	width: 115px !important;
}

.addthis_button_google_plusone {
	width:65px !important;
}

.twitter-share-button,
.addthis_button_tweet {
	width: 100px !important;
}


	
/* Aside
----------------------------------------------------- */

aside {
	position: relative;
	float: right;
	width: 300px;
	line-height: 0;
	margin: 0 0 -5px 0;
}


.single aside {
	display: none;
}

aside ul.full,
aside ul.half {
	display: block;
	margin: 0;
	padding: 0;
	list-style-type: none;
}

aside ul.half {
	margin-right: -4px;
	zoom:1;
}

aside ul.full li {
	font-size: 0;
	line-height: 0;
	margin-bottom: 5px;
}

aside ul.half li {
	float: left;
	margin: 0 4px 4px 0;
}

#bnr-mm {
	border: solid 1px #e5e5e5;
	margin: 0;
	padding: 4px;
	background-color: #fff;
}

#bnr-tw {
	min-height: 100px;
}

#bnr-facebook {
	min-height: 248px;
	background-color: #fff;
	border: solid 1px #e5e5e5;
}

#bnr-mm form{
	border-top: solid 1px #e5e5e5;
	margin: 3px 0 0 0;
	padding: 3px 0 0 0;
	font-size: 10px;
	height: 19px;
	position: relative;
}

#bnr-mm form *{
	font-size: 10px;
}

#bnr-mm form input {
	margin: 0;
	vertical-align: baseline;
	line-height: 1;
}

#bnr-mm form input.checkbox {
	vertical-align:text-bottom;
	margin: 0;
	padding: 0;
	font-size: 0;
	line-height: 0;
	border: 0;
	width: 12px;
}



#bnr-mm form .text {
	border: solid 1px #e5e5e5;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: inset 0px 0px 2px rgba(0,0,0,0.1);
	-moz-box-shadow: inset 0px 0px 2px rgba(0,0,0,0.1);
	box-shadow: inset 0px 0px 2px rgba(0,0,0,0.1);
	margin-right: 4px;
	width: 110px;
	font-size: 12px;	
}

#bnr-mm form .btn {
	display: inline-block;
	float: right;
	font-size: 10px;
}

.ie7 #bnr-mm form .btn {
	display: inline;	
	width: 3em;
	padding:1px 2px;
	margin: 0 0 0 5px;
	float: none;
}

#bnr-widget {
	position: relative;

}

/* Footer
----------------------------------------------------- */

footer {
	margin: 0;
}

#gfooter-sub {
	border-top:solid 1px #e5e5e5;
}

#gfooter-sub ul {
	display: block;
	margin: 0;
	padding: 3px 0;
	list-style-type: none;
	position: relative;
	font-size: 10px;
}

#gfooter-sub ul li {
	display: inline;
}

#gfooter-sub ul li.totop {
	position: absolute;
	right: 0;
}

#gfooter-sub ul li a {
	border-left: solid 1px #e5e5e5;
	padding: 0 5px;
	color: #666;
}

#gfooter-sub ul li:first-child a {
	border-left: 0;
	padding-left:0;
}

#gfooter-sub ul li.totop a {
	border-left: 0;
	padding:0;
	position: relative;
}

#gfooter-sub ul li.totop a:before {
	content: "\F0AA";
	font-family: FontAwesome;
	display: inline-block;
	width: 1em;
	margin-right: .125em;
	text-align: center;
	font-weight: normal;
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

#gfooter-main .copy {
	display: none;
}

#hashes {
	position: fixed;
	display: block;
	z-index: 80;
	right: 20px;
	bottom: 30px;
}

#hashes>.hash {
	position: relative;
	margin: 5px 0 0 0;
	font-size: 0;
	line-height: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}


#hashes>.hash>.anchor {
	display: block;
	padding: 0;
	width: 44px;
	height: 44px;
	overflow: hidden;
	background-color: rgba(0,0,0,.85);
	border-radius: 4px;
	text-decoration: none;
	color: #ccc;
	cursor: pointer;
}



.no-rgba #hashes>.hash>.anchor {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#cc000000,endColorstr=#cc000000);
}


#hashes>.hash .tgl-content {
	display: none;
	position: absolute;
	right: 0;
	bottom: 52px;
	background-color: rgba(0,0,0,.85);
	border-radius: 4px;
	padding: 4px 0;
}

#hashes>.hash.press .tgl-content {
	display: block;
}

#hashes>.hash .tgl-content:before {
	content: "";
	display: block;
	position: absolute;
	width: 0;
	height: 0;
	border-top: 6px solid rgba(0,0,0,.85);
	border-left: 6px solid transparent;
	border-right: 6px solid transparent; 
	bottom:-6px;
	right: 22px;
	margin-right: -6px;
}

.mCSB_container {
	margin-right: 10px !important;
}

#hashes>.hash ul {
	display: block;
	margin: 0;
	padding: 0;
	max-height: 130px;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

#hashes .hash li {
	display: block;
	margin: 0;
	white-space: nowrap;
}

#hashes>.hash ul a {
	display: block;
	padding: 0 5px;
	color: #ccc;
	font-size: 14px;
	line-height: 22px;
	text-decoration: none;
}

.no-touch #hashes>.hash ul a:hover {
	color: #fff;
	text-decoration: none;
}


#hashes .hash>.anchor:before {
	font-family: FontAwesome;
	display: inline-block;
	font-size: 26px !important;
	line-height: 44px !important;
	width: 44px;
	margin-right: .25em;
	text-align: center;
	font-weight: normal;
}

#hashes .hash>.top:before {
	content: "\F062";
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

#hashes .hash>.section:before {
	content: "\F02E";
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}


/* Content
----------------------------------------------------- */


#content > article {
	padding: 30px 23px;
}



.single.doc #content > article {
	padding: 30px 30px;
}


h2,
h3 {
	margin: 0;
	line-height: 1.4 !important;
}

.detail section > h3 {
	color: #cc0033;
}

h2 {
	font-size: 28px;
	line-height: normal
}

h2 .vol {
	font-size: 16px;
}

h2 .small {
	font-size: 16px;
	display: block;
	line-height: 1.6;
}

h2 .xsmall {
	font-size: 13px;
	display: block;
	line-height: 1.6;
}

h2 em {
	font-size: 16px;
	display: block;
	font-style: normal;
}

h2 em:last-child {
	padding-top: .5em;
	border-top: solid 1px #999;
}

/*.home h2,
.home .price {
	display: inline;
}*/


.home h2 {
	margin-right: 0.25em;
}

h3 {
	font-size: 26px;
	margin: 1em 0 0 0;
}

.home h3 {

	margin-top: 2em;
	font-size: 22px;
	border-left: solid 5px #c03;
	padding-left: .25em;

}

.wdlib h3,
.\ h3 {
	font-size: 21px;
}

h4 {
	font-size: 20px;
	margin: 1.5em 0 0 0;
}

h5 {
	font-size: 16px;
	margin: 1em 0 1em 0;
}

.home h4 {
	margin-top: 2em;
}


.home h4+h5 {
	margin-top: 0.5em;
}

.home h4+p {
	margin-top: 0.5em;
}

.doc h2,
.sub h2,
.ad h2,
.special h2 {
	color: #333;
	line-height: 1.2;
	margin: 0 0 1em 0;
}

.sub h2 {
	font-size: 23px;
}



.doc h3,
.sub h3,
.ad h3,
.special h3 {
	color: #333;
	font-size: 18px;
	line-height: 1.4;
	margin: 2em 0 1em 0;
}

.sub h3 {
	font-size: 16px;
}

.sub h3+p {
	margin-top: -1em !important;
}

.sub h3+p.cap {
	margin-top: 1em !important;
}


.doc h4,
.sub h4,
.ad h4,
.special h4 {
	font-size: 16px;
	margin: 2em 0 1em 0;
}

p.gray {
	margin: 0;
	color: #ccc;
}

.detail #cover {
	position: relative;
	margin: 0 20px 0 0;
	width: 230px;
	height: 300px;
	zoom: 1;
	float: left;
	z-index: 0;
}

.legacy.detail #cover,
.legacy.detail #cover img {
	width: 145px;
	height: 190px;	
}

#cover a>span.new {
	display: block;
	position: absolute;
	right: 0;
	top:0;
    width: 64px;
    height: 64px;
    overflow:hidden;
}

#cover a>span.new:after {
	content: "最新号";
	position: absolute;
    display: block;
    right: -32px;
    text-align: center;
    text-transform: uppercase;
    top: 8px;
    background: #c03;
    color: #fff;
    font-weight: bold;
    font-size: 11px;
    line-height: 1;
    width: 80px;
    padding: 4px 10px 3px 10px;
    box-shadow: 0 0 2px rgba(0,0,0,.25);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
}

.no-csstransforms #cover a>span.new:after {
	width: auto;
	right: -1px;
	padding: 4px;
	text-align: left;
}


.en #cover a span:after {
	content: "NEW";
}

#cover a {
	position: relative;
	display: block;
	text-decoration: none;
	font-size: 0;
	width: 100%;
	height: 100%;
	background-image: url(../images/cap-bg.gif);
	z-index: -2; /*IE*/
}

#cover a img {
	position: absolute;
	display: block;
	left: 0;
	top:0;
	z-index: -1; /*IE*/
}

#cover a:hover:before {
	content: "誌面をプレビュー";
	white-space: nowrap;
	position: relative;
	display: block;
	bottom:10px;
	margin: 0 auto;
	width: 8em;
	height: 14px;
	top: 48%;
	z-index: 1;
	background: #111;
	background: rgba(0,0,0,.7);
	padding: 5px 5px 5px 23px;
	font-size: 14px;
	font-weight: bold;
	line-height: 1;
	color: white;
	background-image: url(../images/icons.png);
	background-repeat: no-repeat;
	background-position: 4px -18px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,.3);
	box-shadow: 0px 0px 3px rgba(0,0,0,.3);
	-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
}



.en #cover a:hover:before {
	content: "Preview";
	width: 4em;
}

#cover a:hover {
	background-image: none;
	background-color: #000;
}

#cover a:hover img {
	opacity: .8;
	-ms-filter: "alpha( opacity=80 )";
	filter: alpha( opacity=80 );
	-webkit-transition: opacity .2s ease-out;
	-moz-transition: opacity .2s ease-out;
	-o-transition: opacity .2s ease-out;
	transition: opacity .2s ease-out;
}

.desc {
	float: left;
	position: relative;
	min-width: 340px;
	max-width:  430px;
}

.price,
.ship {
	font-size: 14px;
	margin: 0.25em 0;
}

.ship {
	color: #999;
}

.go {

	font-weight: bold;
	margin: 2em 0 0 0;
}

.go a:after {
	content:"..." /* \00BB*/
}

.buy {
	clear: both;
	position: relative;	
	margin: 1em 0;
	line-height: 1;
}

.buy * {
	vertical-align: top;
}

.buy-text .btn {
	font-size: 16px !important;
	padding: 5px 22px 5px 7px;
	line-height: 1;
}

.wdlib .buy {
	margin-bottom: 1.5em;
}
.wdlib .buy-text {
	margin: .5em 0;
}
.wdlib .buy-text .btn {
	min-width: 12em;
}

.buy-text.nobnr .btn {
	padding: 5px 7px;
}



.buy-text.nobnr .btn:before {
	display: none;
}



.buy-bnrs {
	font-size: 0px;
	line-height: 1;
	position: absolute;
	top:30px;
	left: 0;
	margin: 0;
	float: left;
	width: auto;
	padding: 4px 0 0 4px;
	background-color: #f8f8f8;
	border: solid 1px #ddd;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
	box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
	zoom: 1;
	display: none;
}

.buys {
	margin: 1em 0;
}


dl.buy {
	display: inline-block;
	position: relative;
	margin: 0 5px 0 0 !important;
}

dl.buy.press {
	z-index: 100;
}

dl.buy dt.btn {
	display: inline-block;
	position: relative;
	font-size: 16px !important;
	padding: 7px 30px 7px 7px;
	text-align: left;
	white-space: nowrap;
	line-height: 1;
}

dl.buy.press dt.btn {
	background-image: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.025));
	background-image: -moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.025));
	background-image: -o-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.025));
	background-image: -ms-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.025));
	background-image: linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.025));*/
}


dl.buy dt.btn:after {
	content: "\F107";
	position: absolute;
	right:7px;
	top:7px;
	font-family: FontAwesome;
	display: inline-block;
	width: 1em;
	margin-left: 0.25em;
	text-align: center;
	font-weight: normal;
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

dl.buy dd {
	margin: 0;
	padding: 0;
	position: relative;
	display: none;
}

dl.buy dd ul {
	font-size: 0px;
	line-height: 1;
	position: absolute;
	display: inline-block;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: rgba(248,248,248,.98);
	border: solid 1px #ddd;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0px 1px 5px rgba(0,0,0,.2);
	-moz-box-shadow: 0px 1px 5px rgba(0,0,0,.2);
	box-shadow: 0px 1px 5px rgba(0,0,0,.2);
	z-index: 100;
}

.no-rgba dl.buy dd ul {
	background-color: #f8f8f8;
}

dl.buy dd a {
	font-size: 14px;
	line-height: 14px;
	display: block;
	white-space: nowrap;
	padding: 6px 10px 6px 6px;
	color: #333;	
}

dl.buy dd a:hover {
	color: #fff;
	background-color: #0088dd;
	text-decoration: none;
}

dl.buy dd a:before {
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-right: 4px;
	vertical-align: bottom;
}

dl.buy a[href*="book.mynavi.jp"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=https://book.mynavi.jp);
}

dl.buy a[href*="amazon.co.jp"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=http://www.amazon.co.jp);
}

dl.buy a[href*="7netshopping.jp"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=http://7net.omni7.jp);
}

dl.buy a[href*="rakuten.co.jp"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=http://books.rakuten.co.jp);
}

dl.buy a[href*="e-hon.ne.jp"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=http://www.e-hon.ne.jp);
}

dl.buy a[href*="play.google.com"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=https://play.google.com/store);
}

dl.buy a[href*="magastore.jp"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=http://magastore.jp);
}

dl.buy a[href*="fujisan.co.jp"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=http://www.fujisan.co.jp);
}

dl.buy a[href*="zasshi-online.com"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=http://www.zasshi-online.com);
}

dl.buy a[href*="honto.jp"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=http://honto.jp);
}

dl.buy a[href*="kinokuniya.co.jp"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=https://www.kinokuniya.co.jp);
}

dl.buy a[href*="honyaclub.com"]:before {
	background-image:url(http://www.google.com/s2/favicons?domain_url=http://www.honyaclub.com);
}


.buy.press .buy-bnrs {
	display: block;
}

dl.buy.press dd {
	display: block;
}

.buy-bnrs:before {
	content: "";
	position: absolute;
	top:-8px;
	font-size: 18px;
	left: 2.5em;
	margin-left: -8px;
	width: 0;
	height: 0;
	border-bottom: solid 8px #ddd;
	border-right: solid 8px transparent;
	border-left: solid 8px transparent;
	border-right-color: rgba(255,255,255,0);
	border-left-color: rgba(255,255,255,0);
}

.buy-bnrs:after {
	content: "";
	position: absolute;
	top:-7px;
	font-size: 18px;
	left: 2.5em;
	margin-left: -8px;
	width: 0;
	height: 0;
	border-bottom: solid 8px #f8f8f8;
	border-right: solid 8px transparent;
	border-left: solid 8px transparent;
	border-right-color: rgba(255,255,255,0);
	border-left-color: rgba(255,255,255,0);
}


.buy-bnrs a {
	position: relative;
	display: inline-block;
	margin: 0 4px 4px 0;
}
.ie7 .buy-bnrs a {
	display: inline;
}

.buy-bnrs a img {
	border:solid 1px #e5e5e5;
	
}
.buy-bnrs a:hover img {
	border:solid 1px #ccc;
}

.buy-bnrs a:first-child {
	margin-left: 0;
}

.readme,
.terms {
	background-color:#f7f7f7;
	padding: 15px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	font-size: 12px;
	margin: 2em 0;
}


.terms.em {
	background-color:#fcf0f3;
	font-size: 16px;
}

.terms.blue {
	background-color:#f0f9fc;
	font-size: 16px;
}

.terms p,
.terms ul,
.terms.em dl,
.terms.em dt {
	margin: 1em 0 0 0 !important;
}

.terms.large {
	font-size: 16px;
	padding: 20px;
}


.readme h3,
.readme h4,
.terms h3,
.terms h5 {
	font-size: 120%;
	margin: 0 0 0.5em 0;
}

.terms h4 {
	font-size: 120%;
	margin: 2em 0 0.5em 0;
}

.terms h4:first-child,
.readme p:first-child {
	margin-top: 0;
}
.readme p:last-child {
	margin-bottom: 0;
}

.attn h4,
.attn p {
	font-size: 100%;
	margin: 0;
}


.terms h3.em {
	color: #cc0033;
	
}
.terms dl.correct dt {
	display: block;
	clear: both;
	width: 8%;
	float: left;
	margin: 0;
}

.terms dl.correct dd {
	width: 80%;
	float: left;
	margin: 0;
}

.readme ul {
	margin: 0;
	padding: 0 0 0 1.5em;
}

.attn {
	font-size: smaller;
}


.column {
	position: relative;
	border: solid 2px #f0f0f0;
	padding: 20px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin: 2em 0;
}

.brdr {
	position: relative;
	border: solid 1px #f0f0f0;
	padding: 20px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin: 2em 0;
}

.brdr h4:first-child {
	margin-top:0;
}

.brdr h4 {
	border-bottom: solid 1px #999;
	margin-bottom: 1.5em;
	margin-top: 2em;
}

.brdr .attn h4 {
	border: none;
}

.balloon {
	position: relative;
	border: solid 1px #f0f0f0;
	padding: 15px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin: 2em 0;
}

.balloon.new:before,
.balloon.end:before {
	content: "完売御礼";
	position: absolute;
	display: block;
	width: 60px;
	height: 60px;
	top:10px;
	right: 10px;
	padding: 5px;
	background-color: #cc0033;
	text-transform: uppercase;
	text-align: center;
	font-size: 15px;
	font-weight: bold;
	line-height: 60px;
	white-space: nowrap;
	color: #fff;
	-webkit-border-radius: 35px;
	   -moz-border-radius: 35px;
	        border-radius: 35px;
}

.balloon.new:before {
	content: "New";
}

.balloon.end:before {
	content: "受付終了";
	background-color: #111;
}

.balloon.small,
.balloon.small h4 {
	font-size: 12px;
	line-height: 1.6;
}

.balloon.blue {
	background-color:#f0f9fc;
	border-color:  #f0f9fc;
	text-align: center;
}

.balloon h4 {
	font-size: 24px;
	line-height: 1;
	margin: 0;
}

.balloon h4 em {
	color: #cc0033;
	font-style: normal;
	font-size: smaller;
}

.balloon dl.table {
	border-top: solid 1px #999;
	padding-top: 1em;
	margin: .5em 0 0 0 !important;
}

.balloon.up:before {
	content: "";
	position: absolute;
	z-index: 0;
	display: block;
	top:-8px;
	left: 16px;
	width: 0;
	height: 0;
	border-bottom: solid 8px #e5e5e5;
	border-right: solid 8px transparent;
	border-left: solid 8px transparent;
	border-right-color: rgba(255,255,255,0);
	border-left-color: rgba(255,255,255,0);
	
}

.balloon.up:after {
	content: "";
	position: absolute;
	z-index: 1;
	display: block;
	top:-7px;
	left: 16px;
	width: 0;
	height: 0;
	border-bottom: solid 8px #fff;
	border-right: solid 8px transparent;
	border-left: solid 8px transparent;
	border-right-color: rgba(255,255,255,0);
	border-left-color: rgba(255,255,255,0);
}

.terms p:first-child,
.balloon p:first-child,
.balloon h4:first-child,
.column h4:first-child {
	margin-top: 0 !important;
}

.terms p:last-child,
.balloon p:last-child,
.column p:last-child {
	margin-bottom: 0 !important;
}

.circle {
	text-align: center;
	margin-right: -10px;
}

.circle p {
	display: inline-block;
	position: relative;
	background-color: #06abe3;
	width: 110px;
	height: 110px;
	padding: 10px;
	-webkit-border-radius: 70px;
	   -moz-border-radius: 70px;
	        border-radius: 70px;
	text-align: center;
	margin: 0 10px 10px 0;
	font-size: 14px;
	line-height: 1.5;
}


.circle p.new {
	background-color: #cc0033;
	color: #fff;
}

.circle p.new:before {
	content: "追加";
	display: block;
	position: absolute;
	top:0;
	right: 0;
	background-color: #000;
	color: #fff !important;
	line-height: 1;
	padding: 5px;
	font-size: 14px;
	font-weight: bold;
}

.circle p.end:after {
	content: "完売御礼";
	display: block;
	position: absolute;
	top:50%;
	left: 50%;
	background-color: #fff;
	color: #111 !important;
	line-height: 1;
	padding: 5px 0;
	width: 102%;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	margin-top: -10px;
	margin-left: -50%;
	-webkit-transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
	transform: rotate(-30deg);
}

.circle p strong {
	color: #fff;
	font-size: 24px;
}

.cap {
	position: relative;
	margin: 1.75em 0px;
	text-align: center;
	z-index: 0;
}

.cap>.cap-wrap {
	display: inline-block;
}


.cap ul {
	margin: -0.5em 0;
}

.cap.left {
	text-align: left;
}

.detail .cap a,
.sub .cap a,
.special .cap>a  {
	display: inline-block;
	position: relative;
	line-height: 0;
	margin: 0 auto 10px auto;
	background-image: url(../images/cap-bg.gif);
	z-index: -2;
}

.ie7 .detail .cap a {
	display: inline
}

.detail .cap a img,
.sub .cap a img,
.special .cap>a img {
	position: relative;
	z-index: -1;
}

.detail .cap a[href$=".jpg"]:hover:before,
.sub .cap a[href$=".jpg"]:hover:before,
.special .cap a[href$=".jpg"]:hover:before {
	content: "";
	position: absolute;
	bottom:10px;
	right: 10px;
	background: #000;
	background: rgba(0,0,0,.7);
	width: 20px;
	height: 20px;
	background-image: url(../images/icons.png);
	background-repeat: no-repeat;
	background-position: 2px -20px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,.3);
	box-shadow: 0px 0px 3px rgba(0,0,0,.3);
	z-index: 1;
}

.detail .cap a[href$=".jpg"]:hover,
.sub .cap a[href$=".jpg"]:hover,
.special .cap a[href$=".jpg"]:hover {
	background-image:none;
	background-color: #000;
}

.detail .cap a[href$=".jpg"]:hover img,
.sub .cap a[href$=".jpg"]:hover img,
.special .cap a[href$=".jpg"]:hover img {
	opacity: .8;
	-ms-filter: "alpha( opacity=80 )";
	filter: alpha( opacity=80 );
	-webkit-transition: opacity .2s ease-out;
	-moz-transition: opacity .2s ease-out;
	-o-transition: opacity .2s ease-out;
	transition: opacity .2s ease-out;
}

.detail #cover img,
.detail .cap img,
.sub .cap img,
.archive .cap img,
.special .cap img,
.doc .cap img,
.ad .cap img {
	border: solid 1px #e5e5e5;
	-webkit-box-shadow: 0px 0px 2px rgba(0,0,0,.1);
	-moz-box-shadow: 0px 0px 2px rgba(0,0,0,.1);
	box-shadow: 0px 0px 2px rgba(0,0,0,.1);
	max-width: 100%;
}

.caps.border img,
.cap.border img {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

.caps.noborder img,
.cap.noborder img {
	border: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

.caption {
	position: relative;
	display: inline-block;

	width: 100%;
	text-align: left;
	font-size: 11px;
	margin: .25em 0px;
}

.caption a {
	word-break: break-word
}

.center .caption {
	text-align: center;
}

@media screen and (max-device-width:767px) {
	.detail .cap a,
	.detail .cover a,
	.doc .cover a,
	.special .cover a {
		width: 100%;
		max-width: 598px;
		/*pointer-events: none;*/
	}
	.detail .cap img {
		width: 100%;
		margin-left: -1px;
		
	}
	.center .caption {
		text-align: left;
	}

}

.newseries,
em.sold,
.en dt.btn em {
	position: relative;
	display: inline-block;
	background-color: #cc0033;
	color:white;
	font-size: 12px;
	line-height: 12px;
	padding: 2px 2px 2px 1px;
	margin: -0.5em 0 0 8px;
	vertical-align:middle;
	font-family: arial;
	text-transform: uppercase;
	font-style: normal;
}

.en dt.btn em {
	vertical-align:baseline;
	text-transform:capitalize;
}

.en dt.btn em {
	position: absolute;
	display: none;
	margin: 0 0 0 100%;
	top:0;
	left: 15px;
	text-transform:capitalize;
	white-space: nowrap;
	cursor: default;
}

.en dt.btn:hover em,
.en dl.press dt.btn em {
	display: block;
}


.backnumber .newseries {
	background-color: #999;
}

.newseries:before,
em.sold:before,
.en dt.btn em:before {
	content: "";
	display: block;
	position: absolute;
	width: 0;
	height: 0;
	top:0;
	left: -8px;
	border-top:solid 8px transparent;
	border-bottom:solid 8px transparent;
	border-right:solid 8px #cc0033;
}

.backnumber .newseries:before {
	border-right-color: #999;
}

p.bal {
	color:#cc0033;
	margin: 0;
	font-weight: bold;
	font-size: 21px;
}

h3 a {
	color: #458;
}


.sum dl,
.sum ul,
dl.summary {
	margin: 1em 0;
}

.sum dl,
.sum ul {
	font-size: 13px;
}
.sum ul {
	list-style-type: none;
	padding: 0;
}
.sum ul.disc {
	list-style-type: disc;
	padding-left: 1.5em;
}

.sum>dl>dt,
dl.summary dt {
	margin: 1em 0 0 0;
	font-weight: bold;
}

.sum dl dd,
dl.summary dd {
	margin: 0;
}



dl.summary.alt dd:first-line {
	font-weight: bold;
}

dl.summary.alt dd+dd {
	margin-top: 1em;	
}

.sum dl dd {
	margin-left: 1em;
}

.backnumber.index .sum dl,
.backnumber.index dl.summary {
	font-size: 14px;
}

.backnumber.index dl.summary.alt dt {
	font-size: 18px;
	margin: 2em 0 .5em 0;	
}

.sub article ul {
	list-style-type: none;
	padding-left: 0;
}

.sub article ul.def {
	list-style-type:disc;
	padding-left: 1.5em;
	margin-bottom: -1em;
}

.sub article ul.def li {
	margin-bottom: 1em;
}

.sub article ul.def2 ul {
	padding-left: 1em;
	margin: 0;

}

.sub article ul.def2 h4 {
	margin: 1em 0 !important;

}

.sub article dl dt {
	margin-top: 1em;
}

.sub article dl dd {
	margin-left: 1em;
}

.sub article ol.zero {
	list-style-type: decimal-leading-zero;
	padding-left: 2em;
}

.sub article ol.zero>li {
	margin-bottom: 1em;

}

.sub article ol.zero>li>ul {
	font-weight: normal;
	list-style-type: disc;
	padding-left: 1em;
}

ol.lz {
	list-style-type: decimal-leading-zero;
	margin: -1em 0 3em 0;
	padding-left: 2.25em;
}

/* More
----------------------------------------------------- */

.more-wrap {
	display: none;
	margin-left: 1.25em;
	zoom: 1;
	font-size: 14px;
}

.no-indent .more-wrap {
	margin-left: 0;
}

.more {
	position: relative;
	z-index: 0;
}

.more .toggle {
	display: inline;
	color:#999;
	cursor: pointer;
	font-weight: bold;
	margin-bottom: 1em;
}

.more .toggle:hover {
	color:#888;
}

.more .toggle:before {
	content: "\F0DA";
	font-family: FontAwesome;
	display: inline-block;
	width: 1em;
	text-align: center;
	font-weight: normal;
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

.more .toggle.open:before {
	content: "\f0d7";
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

.more p {
	margin-top: 1em !important;
}

.more ul {
	list-style-type: none;
	padding-left: 0;
}

.more dl.long dt {
	margin-top: 1em;
}

.more dl.long dl {
	margin-top: 0;
}

.more dl.long dt:first-child {
	margin-top: 0;
}

.more dd {
	margin-left: 1em;
	margin-bottom: 0em;
}

.more dd>dl {
	margin: 0;
}

.more ol.zero {
	list-style-type: decimal-leading-zero;
	padding: 0 0 0 2.25em;
	margin: 1em 0 0 0;
}


#webdesigninglab h4 {
	position: relative;
	display: inline-block;
	padding-right: 60px;
	zoom:1;
}

#webdesigninglab h4:before {
	content: "";
	position: absolute;
	display: block;
	width: 48px;
	height: 48px;
	right: 0;
	top:-15px;
	background-image: url(../images/logo-wdlab.gif);
	background-repeat: no-repeat;
	background-position: right top;
}

.dl h4 {
	position: relative;
	display: inline-block;
	padding-right: 72px;
	zoom:1;
}

.dl h4:before {
	content: "";
	position: absolute;
	display: block;
	width: 64px;
	height: 64px;
	right: 0;
	top:3px;
	background-image: url(../images/download.png);
	background-repeat: no-repeat;
	background-position: right top;
}

dl.table {
	margin: 2em 0 !important;
}

dl.table dt {
	clear: both;
	width: 17%;
	float: left;
	margin: .5em 0 !important;
}

dl.table dd {
	float: right;
	width: 83%;
	margin: .5em 0 !important;
	
}

dl.table.em5 {
	margin: 1em 0 !important;
}

dl.table.em5 dt {
	font-weight: bold;
	width: 5em;
	float: left;
	margin: 0 !important;
}

dl.table.em5 dt:after {
	content: ":";
	display: inline;
}

dl.table.em5 dd {
	width: auto;
	float: none;
	margin: 1em 0 1em 5.5em !important;
	
}

ul.notice {
	list-style-type: none;
}

ul.notice li {
	text-indent: -1em;
}
ul.notice li:before {
	content: "※";	
}

@media screen and (max-device-width:767px) {
	dl.table.em5 dt {
		float: none;
		width: auto;
		
	}
	dl.table.em5 dd {
		margin-top: 0 !important;
		margin-left: 1em !important;
	
	}
}

/* Home
----------------------------------------------------- */

#cov {
	width: 100%;
	margin-bottom: 12px;
}

.ja #cov {
	margin-bottom: 12px;
	height: 330px;
	border: solid 1px #e6e6e6;
	box-sizing: border-box;
}

/*.home #content:before {
	content: "";
	display: block;
	position: absolute;
	left: 20px;
	top: -10px;
	width:0px;
	height: 0px;
	border-bottom: solid 10px #e5e5e5;
	border-left: solid 10px transparent;
	border-right: solid 10px transparent;
	border-left-color: rgba(255,255,255,0);
	border-right-color: rgba(255,255,255,0);
}


.home #content:after {
	content: "";
	display: block;
	position: absolute;
	left: 20px;
	top: -9px;
	width:0px;
	height: 0px;
	border-bottom: solid 10px #fff;
	border-left: solid 10px transparent;
	border-right: solid 10px transparent;
	border-left-color: rgba(255,255,255,0);
	border-right-color: rgba(255,255,255,0);
}*/

.home #content > article {
	position: relative;
}
.newest {
	position: absolute;
    display: block;
    width: 100px;
    height: 100px;
    top:-1px;
    right: -1px;
    margin: 0;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
}

.newest:before {
	content: "最新号";
	position: absolute;
    display: block;
    right: -35px;
    text-align: center;
    text-transform: uppercase;
    top: 20px;
    background: #c03;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    line-height: 1;
    width: 120px;
    padding: 6px 10px;
    box-shadow: 0 0 2px rgba(0,0,0,.5);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    
}

.no-csstransforms .newest:before {
	width: auto;
	right: -1px;
	text-align: left;
}
.en .newest:before {
	content: "NEW";
}


/* home - wdcover
----------------------------------------------------- */
#wdcover,
#wdview {
	position: relative;
	float: left;
	font-size: 0;
	width: 474px;
	height: 620px;
	background-color:#fff;
	border: solid 1px #e5e5e5;
	-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,.05);
	-moz-box-shadow: 0px 1px 2px rgba(0,0,0,.05);
	box-shadow: 0px 1px 2px rgba(0,0,0,.05);
	overflow: hidden;
	margin: 0;
	padding: 0;
}


#wdcover a {
	display: block;
	width: 100%;
	height: 100%;
}

#wdcover img {
	display: none;
	width: 474px;
	height: 620px;
	max-width: 474px !important;
	max-height: 620px !important;
}

#wdcover a.loading {
	background-position: center center;
	background-repeat: no-repeat;
	background-image: url(../images/ajax-loader-ws.gif);
}

/* home - wdview
----------------------------------------------------- */

#wdview {
	float: right;
}

#wdview dl {
	position: absolute;
	right: 0;
	bottom:0;
	margin: 0;
	padding: 0;
	z-index: 10;
	background-color: red;
}

#wdview dd {
	margin: 0;
	padding: 0;
	display: none;
}

#wdview dt a {
	position: absolute;
	white-space: nowrap;
	right: 10px;
	bottom: 10px;
	display: inline-block;
	line-height: 1;
	padding: 5px 5px 5px 22px;
	background: #111;
	background: rgba(0,0,0,.7);
	font-style: normal;
	color: white;
	text-decoration: none;
	font-size: 14px;
	font-weight: bold;
	background-image: url(../images/icons.png);
	background-repeat: no-repeat;
	background-position: 4px -18px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,.3);
	box-shadow: 0px 0px 3px rgba(0,0,0,.3);
	-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
}

#wdview dt a:hover {
	text-decoration: none;
	background-color: rgba(0,0,0,1);
}

#wdview-row0,
#wdview-row1,
#wdview-row2 {
	position: absolute;
	overflow: visible;
	left: 0px;
}

#wdview-row0,
#wdview-row1 {
	height: 155px;
	width: 711px;
	overflow: hidden;
}

#wdview-row0:after,
#wdview-row1:after {
	content: "";
	position: absolute;
	bottom:0;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: rgba(0,0,0,.05);
	z-index: 100;
}

#wdview-row2 {
	height: 310px;
	width: 948px;
}

#wdview-row0 {
	top:0;
}

#wdview-row1 {
	top:155px;
}

#wdview-row2 {
	top:310px;
}

#wdview .col {
	display: block;
	position: relative;
	float: left;
	background-color: #fff;
	background-position: center center;
	background-repeat: no-repeat;
}

#wdview .col:after {
	content: "";
	position: absolute;
	bottom:0;
	right: -1px;
	height: 100%;
	width: 1px;
	background-color: rgba(0,0,0,.05);
	z-index: 100;
}


#wdview .col img {
	
	-webkit-transition: opacity 0.2s ease-out;
	-moz-transition: opacity 0.2s ease-out;
	-o-transition: opacity 0.2s ease-out;
	transition: opacity 0.2s ease-out;
	
	
}

#wdview .col.hover > img {
	opacity: .8;
	-ms-filter: "alpha( opacity=80 )";
	filter: alpha( opacity=80 ) !important;
}

#wdview .col.black {
	background-color: black;

}

#wdview .col.loading {
	background-image: url(../images/ajax-loader-ws.gif);
}

#wdview .col.black.loading {
	background-image: url(../images/ajax-loader-bs.gif);
}

#wdview .col.done,
#wdview .col.black.done {
	background-color: black;
}

#wdview .col img {
	display: none;
}

#wdview-row0 .col,
#wdview-row1 .col {
	width: 237px;
	height: 155px;
}

#wdview-row2 .col {
	width: 474px;
	height: 310px;
}

@media screen and (max-device-width:767px){
	
	#wdview {
		display: none;
	}
	
	#wdcover {
		position: relative;
		float: none;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		width: 100%;
		height: auto;
		max-width: 476px;
		max-height: 622px;
		margin: 0;
	}
	
	#wdcover a,
	#wdcover img {
		width: 100% !important;
		height: auto !important;
		max-width: 474px;
		max-height: 620px;
		min-height: 32px;
	}
	

	
}

/* backnumber
----------------------------------------------------- */
.number .small {
	font-size: 16px;
}

.number {
	white-space: nowrap;
}

.wdlib .number {
	white-space: normal;
}

.wdlib.index .number {
	font-size: 27px;
}

.backnumber.index .number {
	font-size: 24px;
}

.pc .number wbr{
	display: block;
}

section.issue {
	padding: 25px 0 30px 0;
	margin: 0 0 0 0;
	border-bottom: solid 1px #e5e5e5;
}

article>section.issue:first-child {
	margin-top: -25px;
}

.wdlib section.issue {
	border-bottom: solid 10px #00b0ec;
}


.wdlib #header {

	border-bottom: solid 10px #00b0ec;
	padding-bottom: 1em;
}

.wdlib #header>p {
	margin-top: 0 !important;
}

.wdlib #header .small {
	margin: 1em 0 !important;
	font-size: 11px;
}

.wdlib section.issue {
	border-top:none !important;
}

section.issue h2 {
	margin: 0;
}

article > section.issue:last-child {
	border-bottom:0 !important;
	padding-bottom: 0;
	margin-bottom: 0;
}
section.issue header {
	margin-bottom: 2em;
}

.desc {
	float:right;
	max-width: 342px;
}

.backnumber .issue .desc,
.backnumber.legacy .desc {
	min-width: 423px;
}


section.issue .cover {
	float: left;
	width: 145px;
	margin: 0;
	line-height: 0;
}

.wdlib section.issue .cover {
	width: 230px;
}


.doc .cover,
.special .cover {
	float: none;
	width: auto;
	margin: 1em 0;
	line-height: normal;
}


section.issue .cover img,
.doc .cover img,
.special .cover img {
	border: solid 1px #e5e5e5;
	-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,.1);
	-moz-box-shadow: 0px 1px 2px rgba(0,0,0,.1);
	box-shadow: 0px 1px 2px rgba(0,0,0,.1);
}


.backnumber.index section.issue .cover img {
	width: 145px;
	height: 190px;
}

.wdlib section.issue .number-sub {
	font-size: 13px;
	line-height: 1.6;
	margin: 0;
}

.wdlib section.issue .number-sub em {
	font-size: 15px;
	font-style: normal;
	display: block;
	margin: .5em 0 -.75em 0;
}

@media screen and (max-device-width:767px){
	.number {
		font-size: 26px;
	}

	section.issue .desc,
	section.issue .cover {
		float:none;
		max-width: auto;
	}
	
	section.issue .cover {
		margin-bottom: 1em;
	}
	
	section.issue.legacy .desc {
		min-width: auto;
	}

}

/* nav year
----------------------------------------------------- */

.nav-year {
	position: absolute;
	z-index: 1;
	top:0;
	right: 0;
	width: 100px;
}

.nav-year .trigger {
	position: absolute;
	top:6px;
	right: 6px;
	margin: 0;
	ruby-align: 0;
	font-size: 12px;
	line-height: 16px;
	color: #999;
	cursor: pointer;
}

.nav-year .trigger:hover {
	color: #333;
}

.nav-year .trigger:after {
	content: "\F107";
	font-family: FontAwesome;
	display: inline-block;
	width: 1em;
	margin-left: 0.25em;
	text-align: center;
	font-weight: normal;
	*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

.nav-year .content {
	position: absolute;
	top:30px;
	right: 5px;
	background: #111;
	background: rgba(0,0,0,.8);
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	padding: 6px 0;
	-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.5);
	box-shadow: 0px 1px 2px rgba(0,0,0,0.5);
	z-index: 10;
	display: none;
}

.nav-year.press .content {
	display: block;
}

#bottom .nav-year .content {
	top:auto;
	bottom:4px;
}

.nav-year .content:before {
	content: "";
	position: absolute;
	display: block;
	top:-8px;
	left: 50%;
	margin-left: -8px;
	width: 0;
	height: 0;
	border-bottom: solid 8px rgba(0,0,0,.8);
	border-right: solid 8px transparent;
	border-left: solid 8px transparent;
	z-index: 0;
}

.lt-ie9 .nav-year .content:before {
	border-bottom: solid 8px #111;
}


#bottom .nav-year .content:before {
	top:auto;
	bottom:-8px;
	border-top: solid 8px rgba(0,0,0,.8);
	border-bottom: 0;
}

.lt-ie9 #bottom .nav-year .content:before {
	border-top: solid 8px #111;
}


.nav-year .content ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	max-height: 130px;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

.nav-year .content li {
	display: block;
}

.nav-year .content li a {
	position: relative;
	font-size: 14px;
	line-height: 22px;
	display: block;
	white-space: nowrap;
	padding:0px 5px;
	color: #ccc;
}

.no-touch .nav-year .content li a:hover {
	color: #fff;
	text-decoration: none;
}


/* archive
----------------------------------------------------- */

.archive h3.em {
	color: #c81037;
}
.archive #forms {
	margin-top: 2em;
}
.archive .entry ul {
	list-style-type: none;
	padding-left: 0;
	margin: 1em 0;
}

.archive.index .entry ul {
	font-size: 18px;
}

.archive.index .entry li {
	margin: 0.25em 0;
}

ul#tnav {
	position: relative;
	z-index: 11;
	margin: 0 -1px -1px 0;
	padding: 0;
	list-style-type: none;
	font-size: 0;
	line-height:0;	
}

ul#tnav li {
	display: inline-block;
	width: 50%;
	margin: 0 -1px 0 0;
}

ul#tnav li>a {
	display: block;
	position: relative;
	font-size: 21px;
	line-height: 1;
	padding: 10px;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	border: solid 1px #d0dde4;
	color: #488eab;
	background-color: #fff;
	
}


ul#tnav li>a:hover {
	background-color: #d3e5ee;
	-webkit-transition:0.1s ease-in-out;
	-moz-transition:0.1s ease-in-out;
	transition:0.1s ease-in-out;
}

ul#tnav li>a.active {
	color: #fff;
	background-color: #12678e;
	border-color: #12678e;
}

ul#tnav li>a.active:after {
	content: "";
	position: absolute;
	width: 0;
	left: 0;
	right: 0;
	bottom:-10px;
	margin: auto;
	border-top: solid 10px #12678e;
	border-left: solid 10px transparent;
	border-right: solid 10px transparent;
}

.tnav-content {
	position: relative;
	min-height: 200px;
	border: solid 1px #d0dde4;
	padding: 20px;
	display: none;
}

.tnav-content.active {
	display: block;
}

.tnav-content.send:before {
	content: "";
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,.85);
	z-index: 10;
	background-image: url(../images/ajax-loader.gif);
	background-position: center center;
	background-repeat: no-repeat;
}

.no-rgba .tnav-content.send:before {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccffffff,endColorstr=#ccffffff);
}

.tnav-content h4 {
	display: none;	
}

.tnav-content h4.done {
	font-size: 32px;
	display: block;
	text-align: center;
}

.tnav-content h4.done:before {
	content: "\f058";
	font-family: FontAwesome;
	font-size: larger;
	margin-right: .1em;
	color: #3A6;
}

.tnav-content .thanks {
	text-align: center;
}


.archive #entryform dd ul.staff {
	list-style-type: none;
	padding-left: 0;
	font-size: 0;
}

.archive #entryform dd ul.staff>li {
	display: inline-block;
	font-size: 11px;
}

.archive #entryform input[type="text"],
.archive #entryform textarea {
	border: 0;
	border-radius: 2px;
	background-color: #ecfaff;
	width: 100%;
	margin: 0;
	padding: 5px;
	box-sizing: border-box;
	font-size: 16px;
	
}

.archive #entryform input[type="text"]:focus,
.archive #entryform textarea:focus {
	outline: 4px solid #c0e0fe;
}
.archive #date {
	width: 45% !important;
	margin-right: 5px !important;
}

.archive #date:after {
	content: "\f071";
	font-family: FontAwesome;
	margin-right: 2px;
}

.archive #entryform input[type="text"]+input[type="text"] {
	margin-top: 10px;
}

.archive #entryform dl {
	margin: -1px 0 0 0;
}

.archive #entryform dt {
	clear: both;
	position: relative;
	padding:  15px 10% 10px 0;
	width: 30%;
	margin: 0;
	float: left;
	font-size: 14px;
	border-top:dashed 1px #d0dde4;
	font-weight: bold;
}

.archive #entryform.confirm dt {
	width: 40%;
	padding-right: 0;
}

.archive #entryform dt>em {
	position: absolute;
	top:15px;
	right: 10px;
	background-color: #c81037;
	color: #fff;
	padding: 0 3px;
	font-style: normal;
	font-size: 11px;
	border-radius: 3px;
	font-weight: normal;
}

.archive #entryform {
	padding-top: 20px;
}
.archive #entryform dt>em.op {
	background-color: #999;
}

.archive #entryform dd {
	position: relative;
	border-top:dashed 1px #d0dde4;
	margin: 0;
	padding: 10px 0;
	width: 60%;	
	float: right;
}

.archive #entryform dd {
	font-size: 11px;	
}

.archive #entryform dd>.preview {
	display: block;
	font-size: 16px;
	padding: 5px;
}

.archive #entryform label.error {
	white-space: nowrap;
	font-size: 12px;
	color: #c81037;
}

.archive #entryform label.error:before {
	content: "\f06a";
	font-family: FontAwesome;
	margin-right: 2px;
}

#entryform-snippet li {
	cursor: pointer;
	background-color: #deecf3;
	width: auto;
	margin: 0 5px 10px 0;
	padding: 0 10px;
	border-radius: 10px;
	
}

.no-touch #entryform-snippet li:hover {
	
	background-color: #d7f4ff;
	color: #36c;
}

.archive #viaemail ul em {
	background-color: #c81037;
	color: #fff;
	padding: 2px 3px;
	font-style: normal;
	font-size: 11px;
	border-radius: 3px;
	vertical-align: middle;
}

.archive #viaemail ul em.op {
	background-color: #999;
}

.archive #viaemail ul ul {
	margin: 1em 0 0 0;

	font-size: 12px;
}

.archive #viaemail ul.staff>li {
	display: inline-block;
	width: 45%;
}

.archive #viaemail h5 {
	font-size: 12px;
	margin: 1em 0;
}


#enter-submit-wrap {
	display: none;
}

.archive .dl-wrap+.dl-wrap,
.archive .entr {
	border-top:dashed 1px #d0dde4;
}

.archive .entr {
	margin: -1px 0 0 0;
	padding-top: 20px;
}
.archive .dl-wrap .more {
	padding: 0;
}

.archive #entryform.confirm .more-wrap {
	height: auto !important;
}

.archive #entryform .toggle {
	display: inline-block;
	
	margin: 10px 0 !important;
}

.archive #forms .toggle {
	color: #488eab;
}
.archive #entryform.confirm .toggle {
	display: none;
}
@media screen and (max-device-width:767px) {
	ul#tnav li>a {
		font-size: 16px;	
	}
	
	.tnav-content {
		padding: 10px;
	}
	
	.archive #entryform dt {
		width: auto;
		float: none;
		padding: 10px 30px 5px 0;
	}
	
	.archive #entryform.confirm dt {
		width: auto;
		padding-right: 0;
	}
	.archive #entryform dt>em {
		top:12px;
		right: 0;	
	}
	.archive #entryform dd {
		width: auto;
		border: 0;
		padding:0 0 20px 0;
		float: none;
	}
	
	.archive #entryform textarea {
		height: 7em;	
	}
	
	#entryform-snippet li {

		font-size: 10px !important;
	}
	
	.archive #viaemail ul.staff>li {
		display: block;
		width: auto;
	}
}


/* doc
----------------------------------------------------- */

.doc dl,
.ad dl,
.special dl {
	margin: 1em 0;
}

.doc dl dt,
.ad dl dt,
.special dl dt {
	font-weight: bold;
	margin: 1em 0 0 0;
}

.doc dl dd,
.ad dl dd,
.special dl dd {
	margin: 0;
}

/* banner xl
----------------------------------------------------- */

.bnr-xl {
	position: relative;
	width: 958px;
	height: 390px;
	/*-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,.05);
	-moz-box-shadow: 0px 1px 2px rgba(0,0,0,.05);
	box-shadow: 0px 1px 2px rgba(0,0,0,.05);*/
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin-bottom: 10px;
	font-size: 0;
	overflow: hidden;
	background: #fff url(../images/ajax-loader-bs.gif) no-repeat center center;
}

.bnr-xl.done {
	background-image: none;
}

.bnr-xl.bs .bnr-xl-bs {
	position: absolute;
	height: 390px;
	width: 958px;
	top:0;
	right: 0px;
	
}


/* chocobanana
----------------------------------------------------- */
.chocobanana .photo {
	position: relative;
	margin: 1.5em 0 1.5em 0;
	text-align: center;
	z-index: 0;
}
.chocobanana.pc .photo {
	margin-right: -10px;
}

.chocobanana.photo:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	overflow: hidden;
}
.chocobanana.photo {display: inline-block;}
* html .chocobanana.photo {height: 1%;}
.chocobanana.photo {display: block;}



.chocobanana.photo img,
.chocobanana.photo a img {
	
	border: solid 1px #e5e5e5;
}

.chocobanana.pc .photo img {
	margin-right: 10px;
}

#cbview {
	position: relative;
	font-size: 0;
	width: 958px;
	height: 390px;
	background-color:#ec1a29;
	-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,.075);
	-moz-box-shadow: 0px 1px 2px rgba(0,0,0,.075);
	box-shadow: 0px 1px 2px rgba(0,0,0,.075);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin: 0;
	padding: 0;
	background-image: url(../images/cb/cbview-bg.gif);
	background-repeat: no-repeat;
}

#cbview-blog {
	position: absolute;
	z-index: 1;
	display: block;
	width: 150px;
	height: 43px;
	top: 7px;
	right:-10px;
	background-image: url(../images/cb/cbview-blog.png);
	font-size: 0;
	line-height: 0;
	text-indent: 130%;
	overflow: hidden;
}

#cbview-photos {
	position: absolute;
	z-index: 0;
	top: 0;
	left: 352px;
	width: 596px;
	height: 390px;
	background-color: #fff;
	background-position: center center;
	background-repeat: no-repeat;
}

#cbview-photos.loading {
	background-image: url(../images/ajax-loader-ws.gif);
}

#cbview-photos img {
	display: none;
	position: absolute;
	top:0;
	left: 0;
	-moz-user-drag: none;
	-webkit-user-drag: none;
	user-drag: none;
}
.chocobanana h3 {
	font-size: 22px;
	color: #eb2431;
}

.chocobanana .vol h3,
.chocobanana .vol h3 a {
	color: #333;

}

.chocobanana .vol h3 a:hover {
	color: #ec1a29;
	text-decoration: none;
}
.chocobanana h3 .n {
	display: block;
	margin-top: -0.5em;
	margin-bottom: 0.25em;
	font-size: 16px;
}

section.vol {
	padding:0px 0 0px 0;
	margin: 20px 0 0px 0;
	border-top: solid 10px #eb2431;
}

article > section.vol:last-child {
	border-bottom:0 !important;
	padding-bottom: 0;
	margin-bottom: 0;
}


em.stat {
	position: relative;
	display: inline-block;
	background-color: #cc0033;
	color:white;
	font-size: 14px;
	line-height: 14px;
	padding: 2px 2px 2px 1px;
	margin-left: 8px;
	vertical-align:top;
	margin-top: .25em;
	font-family: arial;
	text-transform: uppercase;
	font-style: normal;

}



em.stat:before {
	content: "";
	display: block;
	position: absolute;
	width: 0;
	height: 0;
	top:0;
	left: -9px;
	border-top:solid 9px transparent;
	border-bottom:solid 9px transparent;
	border-right:solid 9px #cc0033;
}

em.stat.new {
	color: #ffffff;
}


em.stat.inprogress {
	background-color: #ffcc00;
	color: #420;
}


em.stat.inprogress:before {
	border-right-color: #ffcc00;
}


em.stat.done {
	background-color: #663300;
}


em.stat.done:before {
	border-right-color: #663300;
}

em.dl {
	position: relative;
	color: #cc0033;
	font-weight: bold;
	font-style: normal;
	font-size: 18px;
	padding-right: 34px;
}

em.dl:before {
	content: "";
	position: absolute;
	top:-2px;
	right: 0;
	display: inline-block;
	width: 30px;
	height: 30px;
	background:url(../images/icon-dl-30.png) 0 0 no-repeat;
}

strong.em {
	color: #cc0033;
	
}

@media screen and (max-device-width:767px) {
	
	#cover a:hover:before,
	.cap a:hover:before,
	#pages a:hover:before {
		display: none;
	}

	.buy-text .btn {
		font-size: 16px !important;
		padding: 0 0 0 5px !important;
		line-height: 2em;
		height: 2em;
		-webkit-box-sizing: content-box;
		-moz-box-sizing: content-box;
		box-sizing: content-box;
		width: 6em !important;

		white-space: nowrap;
	}
	
	.buy dt.btn {
		min-width: 0 !important;
		width: auto !important;
		display: inline-block !important;
		margin: 0 !important;
		padding: 7px !important;
	}
	
	.buy-text.nobnr .btn {
		text-align: center;
	}
	
	
	.buy-bnrs {
		top:36px;
	}
	
	.readme,
	.terms,
	.brdr {
		padding: 10px;
	}
	

	
	.chocobanana #cov,
	.chocobanana #cbview {
		display: none;
	}

	.chocobanana .photo {
		margin-right: 0 !important;
	}
	
	.chocobanana .photo img {
		width: 100%;
		margin: 0 !important;
	}

	.chocobanana .photo img {
		float: none;
		display: inline;
	}

}

/* wdvote
----------------------------------------------------- */

#bnr-vote {
	position: relative;
	border: solid 1px #e5e5e5;
	background: white url(../images/wdvote.gif) no-repeat 5px 7px;
	padding-top: 29px;
}

 
.backgroundsize #bnr-vote {
	background-image: url(../images/h2-wdvote.png);
	background-size: 72px 16px;
}


#bnr-vote>a {
	display: block;
	position: absolute;
	top:12px;
	right: 8px;
	z-index: 10;
}

#bnr-vote>a:after {
	content: "過去の投票結果 \00BB";
	font-size: 12px;
	line-height: 1;
}

.wdvote #bnr-vote>a:after {
	display: none;
}

#bnr-vote .vote {
	border-top: solid 1px #f4f4f4;
	padding: 10px !important;
}

#bnr-vote .vote,
#bnr-vote .vote li {
	font-size: 12px;
	line-height: 1.4;
}

#bnr-vote .vote li {
	text-indent: -1.5em;
	margin-left: 1.5em;
}

#content .vote {
	padding-bottom: 1em;
	margin: 1.5em 0;
	border-bottom: solid 1px #eee;
}

#content .vote:last-child {
	border-bottom: 0;
}

.vote p {
	margin: 0;
	line-height: 1.6;

}

#content .vote p {
	font-weight: bold;
}

.vote p .month {
	font-weight: normal;
	color: #999;
}
.vote .answers {
	margin: 1em 0;
}

.vote ul {
	list-style-type: none;
	padding: 0;
	margin: 1em 0 0.5em 0;
}

.vote li {
	display: block;
	margin-bottom: 13px !important;
}

.vote label * {
	line-height: 1.4;
	vertical-align: middle;
}

.vote .radio {
	margin: 0 4px 0 2px;
}

.vote .btn {
	font-size: 12px;
	cursor: pointer !important;
	margin-right: .5em;
}

.vote .btn#btn-result,
.vote .btn#btn-back {
	background-color: #fff;
	color: #36c;
	box-shadow: none;
	padding-left: 0;
	padding-right: 0;
}

.vote .btn#btn-result:hover,
.vote .btn#btn-back:hover {
	text-decoration: underline;
}

.vote .answer {
	position: relative;
	line-height: 1.3;
}

.vote .key {
	display: block;
	padding-right: 3.5em;
}

.vote .val {
	position: absolute;
	right: 0;
	top:0;
	display: none;
}

.vote .bar-container,
.vote .bar {
	display: block;
	height: 10px;
}

.vote .bar-container {
	width: 100%;
	background-color: #eee;
	margin: 0.25em 0 1em 0;
	overflow: hidden;
}

.vote .bar {
	width: 0%;
	background-color: #00b0ec;
}

/* wdlib
----------------------------------------------------- */
.wdlib #gheader {
	position: relative;
	width: 938px;
	height: 230px;
	border: 10px solid #00aeeb;
	margin-bottom: 10px;

	background: #00aeeb url(../images/lib/gheader-bg.png) no-repeat -10px -10px;
	background-size: 356px 250px;
}

.backgroundsize .wdlib #gheader {
	background-image: url(../images/lib/gheader-bg@2x.png);
}

.wdlib #wdlib-bnrs {
	position: absolute;
	top:0;
	right: 0;
	width: 598px;
	height: 230px;
	background-color: #fff;
	overflow: hidden;
	border-radius: 10px;
}

.wdlib #wdlib-bnrs a {
	position: absolute;
	display: none;
}

.wdlib #wdlib-bnrs img {
	width: 592px;
	height: 230px;	
}

.wdlib #wdlib-bnrs.loading {
	background-position: center center;
	background-repeat: no-repeat;
	background-image: url(../images/ajax-loader-ws.gif);
}

/* special
----------------------------------------------------- */

#content-header {
	position: relative;
	margin-bottom: 12px;
	height: 388px;
	border: solid 1px #eee;
	background-color: #fff;
	padding: 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

/* widget
----------------------------------------------------- */

.widget p.iframe {
	line-height: 1.2;
}

.widget article textarea {
	font-size: 14px;
}


/*----------------------------------------------------*/ 
/* mainvisual
------------------------------------------------------*/ 


#contents #mainvisual.top {
	display: block;	
}

#mainvisual_wrap {
	margin: 0 auto 10px auto;
	max-width: 958px;
	padding: 0;
}


#mainvisual {
	width: 100%;
	height: 0;
	padding-top: 40%;
	background-color: #fff;
	margin: 0;
	position:relative;
	overflow: hidden;
	border-radius: 4px;
	box-shadow: 0 0 2px rgba(0,0,0,.15);
}

#mainvisual.loaded {
	height: auto;
	padding-top: 0;
}

#mainvisual_content {
	visibility: hidden;
}

#mainvisual .carousel .entry {
	padding: 0 !important;
	line-height: 0;
}

#mainvisual .carousel .entry a {
	text-decoration: none;	
}

#mainvisual .carousel {
	position: absolute;
	top:0;
}

#mainvisual.loaded .carousel {
	position: relative;	

}

#mainvisual .carousel > div {
	float:left;
	width: 100%;
	height: auto;
	position:relative;
}

#mainvisual .carousel > div img {
	width: 100%;
	height: auto;
}

#mainvisual .carousel > div a:hover img{
	filter:100;
	-moz-opacity:1;
	opacity:1;
	-webkit-transition:none;
	-moz-transition:none;
	transition:none;
}

#mainvisual .carousel .info {
	display: none;	
}

.sp_contents #mainvisual .carousel .info {
	display: block;	
}


#mainvisual .carousel .info {
	position: relative;
	bottom: 0;
	left: 0;
	right: 0;
	min-height: 4.2em;
	padding: 10px 10px 20px 10px;
	border-top:solid 1px #f3f3f3;
	background-color: #fff;
}


#mainvisual .carousel .info {
	color: #000;
	text-decoration: none;
}

#mainvisual .carousel .info dl {
	overflow:hidden;
	margin: 0;
	text-decoration: none;
}

#mainvisual .carousel .info dt {
	font-weight:bold;
	font-size: 21px;
	font-size:2.1rem;
	line-height:1.5;
}

#mainvisual .carousel .info dd {
	font-size: 14px;
	font-size: 1.4rem;
	line-height:1.5;
	margin: 0;
}

#mainvisual .prev,
#mainvisual .next {
	display:none;
	position:absolute;
	width:40px;
	height:40px;
	top:50%;
	margin-top:-20px;/*-85px;*/
	cursor:pointer;
	z-index: 99;
}

#mainvisual .prev {
	left:5px;
}

#mainvisual .next {
	right:5px;
}

#mainvisual .prev.disabled,
#mainvisual .next.disabled,
.sp_contents #mainvisual .prev,
.sp_contents #mainvisual .next {
	display:none !important;
}

#mainvisual .prev:before,
#mainvisual .next:before {
	position: absolute;
	width: 100%;
	height: 100%;
	font-family: FontAwesome;
	font-size: 64px;
	line-height: 34px;
	text-align: center;
	color: rgba(238, 238, 238, 0.95);
	text-shadow: 0 0 2px rgba(0,0,0,.25);
	
}

#mainvisual .prev:before {
	content: "\f104";
}

#mainvisual .next:before {
	content: "\f105";
}

#mainvisual .pager {
	position: absolute;
	padding: 0;
	background-color: transparent;
	font-size: 0;
	line-height: 0;
	position: absolute;
	bottom: 10px;
	width: 100%;
	text-align: center;
	padding: 0;
}

#mainvisual .pager a {
	display: inline-block;
	padding: 0;
	border: 0;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	min-width: 0;
	background-color: rgba(204, 204, 204, 0.87);
	margin: 0 10px;	
}

#mainvisual .pager a.selected {
	background-color: #32ace7 !important;
}