/*
こんにちは
Theme Name: MAU ART & DESIGN GLOSSARY Theme
Theme URI: http://underscores.me/
Author: y
Description: theme for aspace
Version: 1.0
License: GNU General Public License
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Theme is based on Underscores http://underscores.me/, (C) 2012-2013 Automattic, Inc.

Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
and Blueprint http://www.blueprintcss.org/
*/

/* =Reset
-------------------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
body, html {
	line-height:1;
	position: relative;
	text-align: left;
	font-family: 'PT Sans', 'YuGothic', 'Yu Gothic','游ゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo',sans-serif;
	font-style: normal;
	font-weight: 400;
	background-color: #cecfc9;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
}

body .ja{
	font-family: 'YuGothic', 'Yu Gothic','游ゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo',sans-serif;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
	display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}


input, select {
    vertical-align:middle;
}

ol, ul, dl{list-style: none;}


/* =FONT
-------------------------------------------------------------- */
a{color: #1d1d1d;text-decoration: none;}
a:hover{color: #efefef;text-decoration: none;}


a.borderlink{
	color: #fff;
	font-weight: 700;
	border-bottom: #fff 1px solid;
	font-size: 12px;
	padding-bottom: 2px;
	letter-spacing: 0.05em;
}
a.borderlink:hover{
	color: #cecfc9;
	border-bottom: #cecfc9 1px solid;
	padding-bottom: 0;
}


/* =COMMON
-------------------------------------------------------------- */
html.pc .sp{display: none;}
html.sp .pc{display: none;}

body{opacity: 0;}

/* width */
.leftbox{
	position: fixed;
	left: 0;
	top: 0;
	z-index: 900;
	background-color: #cecfc9;
}
.rightbox{
	float: right;
	background-color: #fff;
	position: relative;
	z-index: 500;
	height: 100%;
}
.pc .rightbox{min-height: 500px;}

.rightbox .rightbox-in{
	
}

.main{
	width: 100%;
	overflow: hidden;
}
.width1{
	min-width: 200px;
	width: 25%;
}
.width2{
	min-width: 400px;
	width: 50%;
}
.width3{
	min-width: 600px;
	width: 75%;
}


/* sp */
.sp .leftbox{
	position: relative;
	width: 100%;
	height: auto;
}
.sp .rightbox{
	float: none;
	width: 100%;
	height: auto;
}
.sp .main{
	min-width: inherit;
	width: 100%;
	overflow: hidden;
}
.sp .width1,
.sp .width2,
.sp .width3{
	min-width: inherit;
	width: 100%;
}



/* =Pagenation
-------------------------------------------------------------- */
.pagination .pagination-total{
	color: #cecfc9;
	font-size: 13px;
	letter-spacing: 0.05em;
}
.pagination .pagination-nums{
	display: block;
	padding: 5px 0 0 0;
}
.pagination .pagination-nums span{
	color: #cecfc9;
	font-weight: 400;
	font-size: 20px;
	padding: 0 10px 0 0;
	line-height: 110%;
}
.pagination .pagination-nums a{
	color: #cecfc9;
	font-weight: 700;
	font-size: 20px;
	padding: 0 10px 0 0;
	line-height: 110%;
	text-decoration: underline;
}
.pagination .pagination-nums a:hover{
	color: #575853;
	text-decoration: underline;
}

/* =Result num
-------------------------------------------------------------- */
.items-total{
	position: fixed;
	left: 25%;
	top: 50%;
	height: 25px;
	margin: -50px 0 0 0;
	color: #cecfc9;
	letter-spacing: 0.05em;
	z-index: 0;
	pointer-events: none;
	
	transform-origin: 0 100%;
	-moz-transform-origin: 0 100%;
	-webkit-transform-origin: 0 100%;
	-webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);

}
.items-total strong{
	font-size: 20px;
	padding: 0 4px 0 0;
}

/* sp */
.sp .items-total{
	position: relative;
	top: 0;
	left: 0;
	margin: 0 0 0 0;
	text-align: left;
	height: auto;
	padding: 10px 15px 0 15px;
	
	transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-webkit-transform-origin: 0 0;
	-webkit-transform: rotate(0);
  -moz-transform: rotate(0);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);
}



/* =HEADER
-------------------------------------------------------------- */
#header{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 1000;
}


.home #header .header-title{display: none;}

#header .header-title{
	position: absolute;
	left: 30px;
	top: 16px;
	z-index: 1001;
}

@media screen and (max-width: 800px) {
	#header .header-title img{
		width: 280px;
		height: auto;
	}
}


#header .header-menu{
	left: 50%;
	width: 50%;
	position: absolute;
	margin-top: -50px;
}
.search #header .header-menu,
.page #header .header-menu{
	left: 25%;
	width: 75%;
}
.error404 #header .header-menu{
	left: 50%;
	width: 50%;
}


#header .header-menu-searchbox{
	width: 100%;
	overflow: hidden;
	background-color: #cecfc9;
	padding: 10px 0 10px 0;
}

#header .header-menu-searchbox .header-menu-searchbox-form{
	overflow: hidden;
	float: right;
	padding: 0 30px 0 0;
}

#header .header-menu-searchbox .header-menu-searchbox-form input#s{
	display: block;
	padding: 0 5px;
	margin: 0 5px 0 0;
	width: 230px;
	height: 28px;
	border: #fff 1px solid;
	background-color: #d6d6d6;
	color: #fff;
	font-weight: bold;
	float: left;
}
#header .header-menu-searchbox .header-menu-searchbox-form input#s:focus{
	border: #d6d6d6 1px solid;
	background-color: #fff;
	color: #191919;
	outline: none;
}
#header .header-menu-searchbox .header-menu-searchbox-form input#submit{
	display: block;
	height: 30px;
	line-height: 24px;
	border: #fff 3px solid;
	background: none;
	color: #fff;
	padding: 0 8px;
	margin: 0;
	font-weight: 700;
	cursor: pointer;
	float: left;
}
#header .header-menu-searchbox .header-menu-searchbox-form input#submit:hover{
	border: #fff 3px solid;
	color: #d6d6d6;
	background-color: #fff;
}

#header .header-menu-nav{}

#header .header-menu-nav ul{
	overflow: hidden;
	text-align: center;
	padding: 16px 0 16px 0;
}

@media screen and (max-width: 800px) {
	#header .header-menu-nav ul{
		text-align: right;
		padding: 16px 20px 16px 0;
	}
}
@media screen and (max-width: 650px) {
	#header .header-menu-nav ul{
		text-align: center;
		padding: 16px 0 16px 0;
	}
}

#header .header-menu-nav ul:hover{
	background-color: RGBa(255, 255, 255, 0.8);
}
#header .header-menu-nav ul.white:hover{
	background-color: RGBa(1, 1, 1, 0.1);
}

#header .header-menu-nav ul li{
	display: inline-block;
}
#header .header-menu-nav ul li.eng a{
	font-size: 17px;
	font-weight: 700;
	color: #cecfc9;
}
#header .header-menu-nav ul li.ja a{
	font-size: 15px;
	font-weight: bold;
	color: #cecfc9;
}
#header .header-menu-nav ul li a:hover{
	color:#90908c;
}
#header .header-menu-nav ul li a{
	border-left: #f0f1ef 1px solid;
	padding: 0 0 0 8px;
	margin: 0 0 0 8px;
	display: inline-block;
}
#header .header-menu-nav ul li:first-child a{
	border-left: none;
	padding: 0;
	margin: 0;
}
/* white for index */
#header .header-menu-nav ul.white li.eng a,
#header .header-menu-nav ul.white li.ja a{
	color: #fff;
}
#header .header-menu-nav ul.white li.eng a:hover,
#header .header-menu-nav ul.white li.ja a:hover{
	color:#90908c;
}


/* sp */
.sp #header{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 1000;
}
.sp #header .header-title{
	display: none;
}
.sp #header .header-menu,
.sp .search #header .header-menu,
.sp .page #header .header-menu,
.sp .error404 #header .header-menu{
	left: 0%;
	width: 100%;
	position: absolute;
	margin-top: -50px;
	background: url(images/common/bg1.png?1) left top repeat;
}
.sp #header .header-menu-nav ul{
	padding: 10px 0 10px 0;
}
.sp #header .header-menu-nav ul li.eng a{
	font-size: 14px;
}
.sp #header .header-menu-nav ul li.ja a{
	font-size: 13px;
}
.sp #header .header-menu-nav ul li a{
	padding: 0 0 0 8px;
	margin: 0 0 0 8px;
	height: 14px;
}
.sp #header .header-menu-nav ul li:first-child a{margin: 0 0 0 0;}

.sp #header .header-menu-searchbox{
	width: auto;
	padding: 10px 10px 10px 10px;
}
.sp #header .header-menu-searchbox .header-menu-searchbox-form{
	padding: 0;
	width: 100%;
}
.sp #header .header-menu-searchbox .header-menu-searchbox-form input#s{
	width: 70%;
	height: 28px;
	margin: 0;
	-webkit-appearance: none;
	border-radius: 0;
}
.sp #header .header-menu-searchbox .header-menu-searchbox-form input#submit{
	height: 30px;
	float: right;
	width: 25%;
	-webkit-appearance: none;
	border-radius: 0;
}


.home .sp-title{display: none;}
.sp-title{
	display: block;
	width: 100%;
	text-align: center;
	padding: 60px 0 0 0;
}
.sp-title img{display: inline;opacity: 0.6;width: 80%;height: auto;}


/* =FOOTER
-------------------------------------------------------------- */
/* width */
.home #footer .footer-in,
.single #footer .footer-in{
	width: 50%;
	position: absolute;
	top: 0;
	right: 0;
}
.page #footer .footer-in,
.search #footer .footer-in{
	width: 75%;
	position: absolute;
	top: 0;
	right: 0;
}

#footer{
	width: 100%;
	position: relative;
}
#footer .footer-in .above{
	background-color: #d8d9d4;
	height: 60px;
	padding: 0 30px;
	position: relative;
}
#footer .footer-in .above ul{
	overflow: hidden;
}
#footer .footer-in .above ul li{
	height: 60px;
	float: left;
}
#footer .footer-in .above ul li a{
	display: inline-block;
	margin: 22px 15px;
}
#footer .footer-in .above ul li:first-child a{margin: 22px 15px 22px 0;}
#footer .footer-in .above ul li a:hover{color: #90908c;border-bottom-color: #90908c;}

#footer .footer-in .above .pagetop{
	position: absolute;
	right: 30px;
	top: 0;
	width: 60px;
	height: 60px;
}
#footer .footer-in .above .pagetop a{
	display: block;
	text-indent: -3333px;
	overflow: hidden;
	outline: none;
	width: 60px;
	height: 60px;
	background: #e2e2df url(images/common/footer_top.png) center center no-repeat;
	background-size: 32px 18px;
}
#footer .footer-in .above .pagetop a:hover{background-color: #90908c;}

#footer .footer-in .middle-f{
	background-color: #cecfc9;
	height: 60px;
	padding: 0 30px 0 28px;
	overflow: hidden;
}
#footer .footer-in .middle-f .maulink{
	overflow: hidden;
	float: left;
}
#footer .footer-in .middle-f .maulink li{float: left;padding: 17px 0 17px 0;}
#footer .footer-in .middle-f .maulink li:first-child{padding: 17px 20px 17px 0;}
#footer .footer-in .middle-f .maulink li .global{
	display: block;
	text-indent: -3333px;
	overflow: hidden;
	outline: none;
	width: 140px;
	height: 26px;
	background: url(images/common/footer_globalize.png) left top no-repeat;
	background-size: 140px 26px;
}
#footer .footer-in .middle-f .maulink li .global:hover{background-image: url(images/common/footer_globalize_over.png);}

#footer .footer-in .middle-f .maulink li .mau{
	display: block;
	text-indent: -3333px;
	overflow: hidden;
	outline: none;
	width: 88px;
	height: 26px;
	background: url(images/common/footer_mau.png) left 1px no-repeat;
	background-size: 86px auto;
}
#footer .footer-in .middle-f .maulink li .mau:hover{background-image:url(images/common/footer_mau_over.png)}

#footer .footer-in .middle-f .maulink li a{
	
}

#footer .footer-in .middle-f .snslink{
	float: right;
	overflow: hidden;
	padding: 18px 0 0 0;
}
#footer .footer-in .middle-f .snslink li{
	display: inline-block;
	float: left;
}
#footer .footer-in .middle-f .snslink li a{
	display: inline-block;
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	height: 24px;
	border: #fff 1px solid;
	padding: 0 8px;
	line-height: 24px;
	position: relative;
	
	transition-property: opacity;
  transition-duration:0.1s;
  transition-timing-function:linear;
  transition-delay: 0;
}
#footer .footer-in .middle-f .snslink li:first-child a{
	margin-right: -1px;
}
#footer .footer-in .middle-f .snslink li a:hover{
	color: #90908c;
	border: #90908c 1px solid;
	z-index: 10;
}

#footer .footer-in .bottom{
	border-top: #d8d9d4 1px solid;
	background-color: #cecfc9;
	padding: 12px 30px 10px 0;
	overflow: hidden;
	text-align: right;
}
#footer .footer-in .bottom .copyright .text{
	float: right;
	font-size: 11px;
	line-height: 130%;
	font-weight: 700;
	color: #FFF;
}


/* sp */
.sp .home #footer .footer-in,
.sp .single #footer .footer-in,
.sp .page #footer .footer-in,
.sp .search #footer .footer-in{
	width: 100%;
	position: absolute;
	top: 0;
	right: 0;
}
.sp #footer .footer-in .above{
	padding: 0 15px;
}
.sp #footer .footer-in .above .pagetop{
	right: 15px;
}
.sp #footer .footer-in .above .pagetop a:hover{background-color: #e2e2df;}



.sp #footer .footer-in .middle-f{
	padding: 0 15px 0 15px;
	height: auto;
}
.sp #footer .footer-in .middle-f .maulink li{float: none;padding: 0 0 15px 0;}
.sp #footer .footer-in .middle-f .maulink li:first-child{padding: 16px 0 13px 0;}
.sp #footer .footer-in .middle-f .maulink li .global{
	width: 112px;
	height: 21px;
	background-size: 112px 21px;
}
.sp #footer .footer-in .middle-f .maulink li .mau{
	width: 70px;
	height: 21px;
	background-size: 70px 21px;
}

.sp #footer .footer-in .middle-f .snslink{
	padding: 15px 0 0 0;
}

.sp #footer .footer-in .bottom{
	padding: 12px 0 15px 0;
	text-align: center;
}
.sp #footer .footer-in .bottom .copyright .text{
	float: none;
}



/* =Item List
-------------------------------------------------------------- */
.postnum{
	color: #cecfc9;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.02em;
	padding: 0 0 12px 0;
}
.postnum strong{
	font-weight: 700;
	font-size: 20px;
}

.items-container{
	overflow: hidden;
}

.items100 .item{
	float: left;
	width: 130px;
	height: 130px;
}
.items168 .item{
	float: left;
	width: 198px;
	height: 198px;
}

.item a{
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
	background-color: none;
	
	transition-property:  background-color;
  transition-duration:0.1s;
  transition-timing-function:linear;
  transition-delay: 0;
	
}
.item a:hover{background-color: #cecfc9;}
.item a .name{
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 8px 0 7px 0;
	z-index: 10;
	visibility: hidden;
	background-color: RGBa(144, 144, 140, 0.8);
	display: block;
	width: 100%;
}
.item a:hover .name{
	visibility: visible;
}
.item a .name span{
	display: block;
	padding: 0 10px;
}
.item a .name span.eng{
	font-weight: 700;
	font-size: 14px;
	color: #fff;
	line-height: 120%;
	padding-bottom: 3px;
}
.item a .name span.ja{
	font-weight: normal;
	font-size: 11px;
	color: #fff;
	line-height: 140%;
}

.items100 .item a .img{
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -50px 0 0 -50px;
	border: #f1f0f6 1px solid;
}

.items168 .item a .img{
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -84px 0 0 -84px;
	border: #f1f0f6 1px solid;
}

.item a:hover .img{border: #cecfc9 1px solid;}
.items100 .item a .img img{
	display: block;
	width: 98px;
	height: 98px;
}
.items168 .item a .img img{
	display: block;
	width: 168px;
	height: 168px;
}
.item a:hover .img img{
	-webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray; /* IE 6-9 */
  opacity: 0.6;
}


/* sp */
.sp .postnum{padding: 0 0 0 0;}
.sp .item a .name{
	visibility: visible;
	background-color: transparent;
}
.sp .item a .name span.eng{
	font-size: 13px;
	color: #191919;
}
.sp .item a .name span.ja{
	font-size: 10px;
	color: #80817a;
}

/* スマホは1サイズ */
.sp .items168 .item{
	float: left;
	width: 130px;
	height: 130px;
}
.sp .items168 .item a .img{
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -50px 0 0 -50px;
	border: #f1f0f6 1px solid;
}
.sp .items168 .item a .img img{
	width: 98px;
	height: 98px;
}






/* =NOT FOUND
-------------------------------------------------------------- */
#notfoundpage{
	background-color: #fff;
	padding: 100px 0 200px 0;
}
.notfoundpage-massage{
	border-top: #cecfc9 3px solid;
	margin: 0 30px 0 30px;
}
.notfoundpage-massage h1{
	padding: 28px 0 0 0;
	font-size: 35px;
	font-style: italic;
	font-weight: 400;
	letter-spacing: 0.05em;
	color: #cecfc9;
}
.notfoundpage-massage p{
	font-size: 15px;
	line-height: 150%;
	font-weight: 400;
	letter-spacing: 0.05em;
	color: #cecfc9;
}





/* =INDEX
-------------------------------------------------------------- */
#indexpage .leftbox{
	background-color: #c3c4bf;
	height: 100%;
}
#indexpage .leftbox .indexpage-logo{
	background-color: #cecfc9;
	padding: 0 70px;
	height: 295px;
	display: table-cell;
	vertical-align: middle;
	border: none;
}
#indexpage .leftbox .indexpage-logo img{
	width: 100%;
	height: auto;
}
#indexpage .leftbox .textbox{
	margin: 0;
	position: relative;
	padding: 45px 30px 0 30px;
}
#indexpage .leftbox .textbox .indexpage-read{
	font-weight: 400;
	font-size: 18px;
	line-height: 160%;
	color: #40403d;
	text-align: justify;
	text-indent: 3em;
}


#indexpage .rightbox{
	padding: 0 0 60px 0;
}
#indexpage .rightbox,
#indexpage .rightbox .indexpage-photo,
#indexpage .rightbox .indexpage-photo ul{
	position: relative;
}
#indexpage .rightbox .indexpage-photo{
	overflow: hidden;
	
	transition-property: margin;
  transition-duration: 0.2s;
  transition-timing-function: ease-out;
  transition-delay: 0;
}


#indexpage .rightbox .indexpage-photo:hover{
	margin: -15px 0 0 0;
}

#indexpage .rightbox .indexpage-photo ul li{
	position: absolute;
	left: 0;
	top: 0;
	
	opacity: 0;
}
#indexpage .rightbox .indexpage-photo ul li img{
	display: block;
}

#indexpage .rightbox .indexpage-items{
	padding: 30px 15px 0 30px;
}


/* sp */
.sp #indexpage .leftbox{
	height: auto;
}
.sp #indexpage .leftbox .indexpage-logo{
	background-color: #cecfc9;
	padding: 90px 0 50px 0;
	height: auto;
	width: 100%;
	display: block;
	text-align: center;
	border: none;
}
.sp #indexpage .leftbox .indexpage-logo img{
	width: 280px;
	height: auto;
	display: inline;
}


.sp #indexpage .rightbox,
.sp #indexpage .rightbox .indexpage-photo,
.sp #indexpage .rightbox .indexpage-photo ul{
	position: relative;
}
.sp #indexpage .rightbox .indexpage-photo ul{height: 260px;}
.sp #indexpage .rightbox .indexpage-photo{overflow: hidden;}
.sp #indexpage .rightbox .indexpage-photo ul li{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 230px;
	opacity: 0;
}
.sp #indexpage .rightbox .indexpage-photo ul li img{
	display: block;
	width: 100%;
	height: auto;
}

.sp #indexpage .rightbox .indexpage-items{
	padding: 25px 10px 0 10px;
	overflow: hidden;
}





/* =A to Z
-------------------------------------------------------------- */
#atozpage .leftbox{
	height: 100%;
}
#atozpage .leftbox .atozpage-menu{
	padding: 50px 30px 0 30px;
	background: url(images/common/point01.png) center top no-repeat;
	background-size: 20px 20px;
}

#atozpage .leftbox .atozpage-menu .atozpage-menu-in{
	background: url(images/common/point01.png) center bottom no-repeat;
	background-size: 20px 20px;
	padding: 0 0 30px 0;
}
#atozpage .leftbox .atozpage-menu .atozpage-menu-nav{
	overflow: hidden;
}
#atozpage .leftbox .atozpage-menu .atozpage-menu-nav li{
	float: left;
	width: 40px;
	height: 50px;
	text-align: center;
}
#atozpage .leftbox .atozpage-menu .atozpage-menu-nav li a{
	font-family: 'Source Code Pro';
	font-weight: 400;
	font-size: 35px;
	color: #fff;
	display: block;
}
#atozpage .leftbox .atozpage-menu .atozpage-menu-nav li span{
	font-family: 'Source Code Pro';
	font-weight: 300;
	font-size: 35px;
	color: #e7e8e5;
	display: block;
}
.pc_small #atozpage .leftbox .atozpage-menu .atozpage-menu-nav li{
	height: 40px;
}
.pc_small #atozpage .leftbox .atozpage-menu .atozpage-menu-nav li a,
.pc_small #atozpage .leftbox .atozpage-menu .atozpage-menu-nav li span{
	font-size: 25px;
}

#atozpage .leftbox .atozpage-menu .atozpage-menu-nav li.current a{color: #191919;pointer-events: none;}
#atozpage .leftbox .atozpage-menu .atozpage-menu-nav li a:hover{color: #90908c;}
#atozpage .leftbox .atozpage-menu .atozpage-menu-nav li.current a:hover{color: #191919;}


/* right */
#atozpage .rightbox .atozpage-results{
	margin: 100px 30px 100px 30px;
}
#atozpage .rightbox .atozpage-results .atozpage-result{display: none;}
#atozpage .rightbox .atozpage-results .showed{display: block;}

#atozpage .rightbox .atozpage-result-key{
	pointer-events: none;
	text-align: center;
	font-family: 'Source Code Pro';
	font-weight: 600;
	font-size: 120px;
	color: #c3c4bf;
	
}
#atozpage .rightbox .atozpage-result-key span{
	font-family: 'Source Code Pro';
	font-weight: 400;
	font-size: 100px;
	color: #c3c4bf;
}


/* sp */
.sp #atozpage .leftbox{
	height: auto;
}
.sp #atozpage .leftbox .atozpage-menu{
	padding: 20px 15px 10px 15px;
	background: none;
}

.sp #atozpage .leftbox .atozpage-menu .atozpage-menu-in{
	background: none;
	padding: 0 0 0 0;
}
.sp #atozpage .leftbox .atozpage-menu .atozpage-menu-nav li{
	float: left;
	width: 30px;
	height: 35px;
	text-align: center;
}
.sp #atozpage .leftbox .atozpage-menu .atozpage-menu-nav li a{
	font-family: 'Source Code Pro';
	font-weight: 400;
	font-size: 20px;
	color: #fff;
	display: block;
}
.sp #atozpage .leftbox .atozpage-menu .atozpage-menu-nav li.current a{color: #191919;pointer-events: none;}
.sp #atozpage .leftbox .atozpage-menu .atozpage-menu-nav li span{
	font-family: 'Source Code Pro';
	font-weight: 300;
	font-size: 20px;
	color: #e7e8e5;
	display: block;
}
.sp #atozpage .rightbox{
	padding: 0 0 30px 0;
}
.sp #atozpage .rightbox .atozpage-results{
	margin: 0 15px;
}
.sp #atozpage .rightbox .atozpage-results .atozpage-result{display: none;}
.sp #atozpage .rightbox .atozpage-results .showed{display: block;}

.sp #atozpage .rightbox .atozpage-result-key{
	font-size: 100px;
	}
.sp #atozpage .rightbox .atozpage-result-key span{
	font-size: 60px;
}




/* =あいうえお
-------------------------------------------------------------- */
#aiueopage .leftbox{
	height: 100%;
}
#aiueopage .leftbox .aiueopage-menu{
	padding: 50px 30px 0 30px;
	background: url(images/common/point01.png) center top no-repeat;
	background-size: 20px 20px;
}

#aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in{
	background: url(images/common/point01.png) center bottom no-repeat;
	background-size: 20px 20px;
	padding: 0 0 20px 0;
}

#aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav{
	overflow: hidden;
}
#aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul{
	float: right;
	width: 40px;
	padding: 0 0 20px 0;
}
#aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li{
}
#aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li span{
	width: 40px;
	height: 30px;
	display: block;
	text-align: center;
	font-size: 20px;
	font-weight: normal;
	color: #e7e8e5;
}
#aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li a{
	width: 40px;
	height: 30px;
	display: block;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	color: #fff;
}

.pc_small #aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li span,
.pc_small #aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li a{
	font-size: 16px;
	height: 24px;
}

#aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li.current a{color: #191919;pointer-events: none;}
#aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li a:hover{color: #90908c;}
#aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li.current a:hover{color: #191919;}


/* right */
#aiueopage .rightbox .aiueopage-results{
	margin: 100px 30px 100px 30px;
}
#aiueopage .rightbox .aiueopage-results .aiueopage-result{display: none;}
#aiueopage .rightbox .aiueopage-results .showed{display: block;}
#aiueopage .rightbox .aiueopage-result-key{
	pointer-events: none;
	text-align: center;
	font-weight: bold;
	font-size: 90px;
	color: #c3c4bf;
}
#aiueopage .rightbox .aiueopage-result-key span{
	font-family: 'Source Code Pro';
	font-weight: 400;
	font-size: 50px;
	font-style: italic;
	color: #c3c4bf;
	margin: 0 0 0 -5px;
}


/* sp */
.sp #aiueopage .leftbox{
	height: auto;
}
.sp #aiueopage .leftbox .aiueopage-menu{
	padding: 20px 10px 10px 10px;
	background: none;
}

.sp #aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in{
	background: none;
	padding: 0 0 0 0;
}
.sp #aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul{
	width: 30px;
	padding: 0 0 0 0;
}
.sp #aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li span{
	width: 30px;
	height: 30px;
	font-size: 14px;
}
.sp #aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li a{
	width: 30px;
	height: 30px;
	font-size: 14px;
}
.sp #aiueopage .leftbox .aiueopage-menu .aiueopage-menu-in .aiueopage-menu-nav ul li.current a{color: #191919;}

.sp #aiueopage .rightbox{
	padding: 0 0 30px 0;
}
.sp #aiueopage .rightbox .aiueopage-results{
	margin: 0 15px;
}
.sp #aiueopage .rightbox .aiueopage-results .aiueopage-result{display: none;}
.sp #aiueopage .rightbox .aiueopage-results .showed{display: block;}

.sp #aiueopage .rightbox .aiueopage-result-key{
	font-size: 50px;
	}
.sp #aiueopage .rightbox .aiueopage-result-key span{
	font-size: 30px;
}




/* =CATEOGRY
-------------------------------------------------------------- */
#catpage .leftbox{
	height: 100%;
}
#catpage .leftbox .catpage-menu{
	padding: 40px 30px 0 30px;
	background: url(images/common/point01.png) center top no-repeat;
	background-size: 20px 20px;
}

#catpage .leftbox .catpage-menu .catpage-menu-in{
	background: url(images/common/point01.png) center bottom no-repeat;
	background-size: 20px 20px;
	padding: 0 0 60px 0;
}
#catpage .leftbox .catpage-menu .catpage-menu-in form{
	vertical-align:baseline;
	background:transparent;
}
#catpage .leftbox .catpage-menu .input-rapper{
	padding: 0 0 20px 0;
	border-bottom: #fff 1px dotted;
}
	
#catpage .leftbox .catpage-menu h1{
	font-size: 18px;
	font-weight: 400;
	letter-spacing: 0.05em;
	color: #fff;
	padding: 0 0 5px 0;
}

#catpage .leftbox .catpage-menu .catpage-menu-categories,
#catpage .leftbox .catpage-menu .catpage-menu-categories li{
	width: 100%;
	overflow: hidden;
}
#catpage .leftbox .catpage-menu .catpage-menu-categories li{
	margin: 0 0 10px 0;
	position: relative;
}
#catpage .leftbox .catpage-menu .catpage-menu-categories-select-text{
	display: block;
	width: 100%;
	padding-left: 20px;
	height: 40px;
	border:none;
	border-left: #fff 10px solid;
	font-size: 13px;
	line-height: 40px;
	font-style: italic;
	background: #fff url(images/common/arrow_pulldown.png) left center no-repeat;
	background-size: 15px 15px;
	cursor: pointer;
}
#catpage .leftbox .catpage-menu .catpage-menu-categories-select{
	display: block;
	width: 100%;
	height: 40px;
	-webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;
  border-radius:0;
  
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
#catpage .leftbox .catpage-menu .disable{
	color: #ccc;
	pointer-events: none;
	cursor: default;
}


#catpage .leftbox .catpage-menu .catpage-menu-categories-select option{
	display: block;
	height: 40px;
	border: none;
	font-size: 13px;
}

#catpage .leftbox .catpage-menu input#submit{
	display: block;
	width: 100%;
	height: 40px;
	line-height: 34px;
	border: #fff 3px solid;
	background: none;
	color: #fff;
	padding: 0 8px;
	margin: 30px 0 0 0;
	font-size: 17px;
	font-weight: 700;
	cursor: pointer;
	
	-webkit-box-sizing: border-box;
	-khtml-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
#catpage .leftbox .catpage-menu input#submit:hover{
	border: #fff 3px solid;
	color: #d6d6d6;
	background-color: #fff;
}



/* right */
#catpage .rightbox .catpage-results{
	margin: 100px 20px 100px 20px;
}

#catpage .rightbox .catpage-results .noresult .catpage-results-alert{
	border-top: #cecfc9 3px solid;
	font-size: 30px;
	font-style: italic;
	font-weight: 400;
	color: #cecfc9;
	margin: 0 10px 50px 10px;
	padding: 50px 0 0 0;
}
#catpage .rightbox .catpage-results .noresult .catpage-results-categoriesname{
	border-top: #d8d9d4 1px solid;
	padding: 0 0 15px 0;
	margin: 0 10px;
}
#catpage .rightbox .catpage-results .noresult h2{
	
}
#catpage .rightbox .catpage-results .noresult h2 a{
	display: block;
	font-size: 16px;
	margin: 15px 0 0 5px;
	color: #90908c;
}
#catpage .rightbox .catpage-results .noresult h2 a:hover{color: #cecfc9;}

#catpage .rightbox .catpage-results .noresult ul{
	padding: 0 0 0 15px;
	overflow: hidden;
}
#catpage .rightbox .catpage-results .noresult ul li{
	display: inline-block;
	background-color: #d8d9d4;
	color: #fff;
	margin: 10px 10px 0 0;
	font-size: 15px;
	cursor: pointer;
}
#catpage .rightbox .catpage-results .noresult ul li:hover{
	background-color: #90908c;
	color: #fff;
}
#catpage .rightbox .catpage-results .noresult ul li a{
	color: #40403d;
	font-size: 14px;
	padding: 5px 10px 5px 10px;
	display: block;
}
#catpage .rightbox .catpage-results .noresult ul li:hover a{
	color: #fff;
}

/* result */
#catpage .rightbox .catpage-results .searchpage-result a{
	display: block;
	padding: 0 10px 0 10px;
	margin: -1px 0 0 0;
	
	transition-property: background-color;
  transition-duration: 0.2s;
  transition-timing-function: ease-out;
  transition-delay: 0;
}
#catpage .rightbox .catpage-results .searchpage-result a:hover{
	background-color: #cecfc9;
	color: #fff;
}

#catpage .rightbox .catpage-results .searchpage-result a .result-table{
	overflow: hidden;
	margin: 0 10px;
	border-bottom: #e7e8e5 1px solid;
}
#catpage .rightbox .catpage-results .searchpage-result a:hover .result-table{border-bottom: #cecfc9 1px solid;}

#catpage .rightbox .catpage-results .searchpage-result:first-child a .result-table{
	border-top: #cecfc9 3px solid;
}
#catpage .rightbox .catpage-results .searchpage-result a .result-table .img{
	width: 15%;
	float: left;
	padding: 30px 0 25px 0;
}
#catpage .rightbox .catpage-results .searchpage-result a .result-table .titles{
	width: 30%;
	float: left;
	padding: 30px 0 25px 0;
}
#catpage .rightbox .catpage-results .searchpage-result a .result-table .texts{
	width: 55%;
	float: left;
	padding: 30px 0 25px 0;
}

#catpage .rightbox .catpage-results .searchpage-result a .result-table .img img{
	border: #f1f0f6 1px solid;
}
#catpage .rightbox .catpage-results .searchpage-result a:hover .result-table .img img{
	border: #fff 1px solid;

	-webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray; /* IE 6-9 */
  opacity: 0.6;
	
	transition-property: grayscale;
  transition-duration: 0.2s;
  transition-timing-function: ease-out;
  transition-delay: 0;
}

#catpage .rightbox .catpage-results .searchpage-result a .result-table .titles .en{
	font-size: 17px;
	line-height: 120%;
	font-weight: 700;
	letter-spacing: 0.05em;
	padding: 0 10px 7px 0;
}
#catpage .rightbox .catpage-results .searchpage-result a .result-table .titles .kana{
	font-size: 13px;
	font-weight: normal;
	line-height: 140%;
	padding: 0 10px 3px 0;
}
#catpage .rightbox .catpage-results .searchpage-result a .result-table .titles .yomi{
	font-size: 12px;
	line-height: 120%;
	font-weight: 400;
	font-style: italic;
	letter-spacing: 0.05em;
	color: #cecfc9;
	padding: 0 10px 0 0;
}
#catpage .rightbox .catpage-results .searchpage-result a:hover .result-table .titles .yomi{color: #fff;}

#catpage .rightbox .catpage-results .searchpage-result a .result-table .texts .text{
	font-size: 14px;
	line-height: 130%;
	font-weight: 400;
	letter-spacing: 0.05em;	
}




/*sp*/
.sp #catpage .leftbox{
	height: auto;
}
.sp #catpage .leftbox .catpage-menu{
	padding: 15px 15px 20px 15px;
	background: none;
}

.sp #catpage .leftbox .catpage-menu .catpage-menu-in{
	background: none;
	padding: 0 0 0 0;
}
.sp #catpage .leftbox .catpage-menu .input-rapper {padding: 0 0 5px 0;}
.sp #catpage .leftbox .catpage-menu input#submit{
	-webkit-appearance: none;
	border-radius: 0;
	margin: 15px 0 0 0;
}


.sp #catpage .rightbox .catpage-results{
	margin: 10px 0px 0px 0px;
	padding: 0 0 30px 0;
}

.sp #catpage .rightbox .catpage-results .noresult .catpage-results-alert{
}
.sp #catpage .rightbox .catpage-results .noresult ul{
}
.sp #catpage .rightbox .catpage-results .noresult ul li{
}
.sp #catpage .rightbox .catpage-results .noresult ul li a{
}
.sp #catpage .rightbox .catpage-results .searchpage-result a{
	padding: 0 15px 0 15px;
}
.sp #catpage .rightbox .catpage-results .searchpage-result a:hover{
	background-color: inherit;
}

.sp #catpage .rightbox .catpage-results .searchpage-result a .result-table{
	margin: 0 0 0 0;
}


.sp #catpage .rightbox .catpage-results .searchpage-result a .result-table .img{
	width: 20%;
	float: left;
	padding: 15px 0 8px 0;
}
.sp #catpage .rightbox .catpage-results .searchpage-result a .result-table .titles{
	width: 72%;
	float: right;
	padding: 15px 0 8px 0;
}
.sp #catpage .rightbox .catpage-results .searchpage-result a .result-table .texts{
	width: 100%;
	clear: both;
	float: none;
	padding: 0 0 15px 0;
}
.sp #catpage .rightbox .catpage-results a .result-table .texts .text{
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
}

.sp #catpage .rightbox .catpage-results .searchpage-result a .result-table .img img{
	width: 100%;
	height: auto;
}

.sp #catpage .rightbox .catpage-results .searchpage-result a .result-table .titles .en{
	padding: 5px 0px 4px 0;
}
.sp #catpage .rightbox .catpage-results .searchpage-result a .result-table .titles .kana{
	font-size: 12px;
	padding: 0 0 2px 0;
}










/* =SEARCH
-------------------------------------------------------------- */
#searchpage .leftbox{
	height: 100%;
}
#searchpage .leftbox .searchpage-menu{
	padding: 50px 30px 0 30px;
	background: url(images/common/point01.png) center top no-repeat;
	background-size: 20px 20px;
}

#searchpage .leftbox .searchpage-menu .searchpage-menu-in{
	background: url(images/common/point01.png) center bottom no-repeat;
	background-size: 20px 20px;
	padding: 0 0 50px 0;
}

#searchpage .leftbox .searchpage-menu h1{
	font-size: 18px;
	font-weight: 400;
	letter-spacing: 0.05em;
	color: #fff;
	padding: 0 0 5px 0;
}
#searchpage .leftbox .searchpage-menu .input-rapper{
	border-bottom: #fff 1px dotted;
}
#searchpage .leftbox .searchpage-menu input#s2{
	display: block;
	padding: 0 5px;
	margin: 0 0 30px 0;
	width: 100%;
	height: 38px;
	border: #fff 1px solid;
	background-color: #d6d6d6;
	color: #222;
	font-weight: normal;
	font-size: 15px;
	font-style: italic;
	letter-spacing: 0.05em;
	
	-webkit-box-sizing: border-box;
	-khtml-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
#searchpage .leftbox .searchpage-menu input#s2:focus{
	border: #d6d6d6 1px solid;
	background-color: #fff;
	color: #191919;
	font-style: normal;
	outline: none;
}
#searchpage .leftbox .searchpage-menu input#submit2{
	display: block;
	width: 100%;
	height: 40px;
	line-height: 34px;
	border: #fff 3px solid;
	background: none;
	color: #fff;
	padding: 0 8px;
	margin: 30px 0 0 0;
	font-size: 17px;
	font-weight: 700;
	cursor: pointer;
	
	-webkit-box-sizing: border-box;
	-khtml-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
#searchpage .leftbox .searchpage-menu input#submit2:hover{
	border: #fff 3px solid;
	color: #d6d6d6;
	background-color: #fff;
}

/* right */
#searchpage .rightbox .searchpage-results{
	margin: 100px 20px 70px 20px;
}

#searchpage .rightbox .searchpage-results .searchpage-result{
	
}
#searchpage .rightbox .searchpage-results .searchpage-result:hover{
	
}
#searchpage .rightbox .searchpage-results .searchpage-result a{
	display: block;
	padding: 0 10px 0 10px;
	margin: -1px 0 0 0;
	
	transition-property: background-color;
  transition-duration: 0.2s;
  transition-timing-function: ease-out;
  transition-delay: 0;
}
#searchpage .rightbox .searchpage-results .searchpage-result a:hover{
	background-color: #cecfc9;
	color: #fff;
}

#searchpage .rightbox .searchpage-results .searchpage-result a .result-table{
	overflow: hidden;
	margin: 0 10px;
	border-bottom: #e7e8e5 1px solid;
}
#searchpage .rightbox .searchpage-results .searchpage-result a:hover .result-table{border-bottom: #cecfc9 1px solid;}

#searchpage .rightbox .searchpage-results .searchpage-result:first-child a .result-table{
	border-top: #cecfc9 3px solid;
}
#searchpage .rightbox .searchpage-results .searchpage-result a .result-table .img{
	width: 15%;
	float: left;
	padding: 30px 0 25px 0;
}
#searchpage .rightbox .searchpage-results .searchpage-result a .result-table .titles{
	width: 30%;
	float: left;
	padding: 30px 0 25px 0;
}
#searchpage .rightbox .searchpage-results .searchpage-result a .result-table .texts{
	width: 55%;
	float: left;
	padding: 30px 0 25px 0;
}

#searchpage .rightbox .searchpage-results .searchpage-result a .result-table .img img{
	border: #f1f0f6 1px solid;
}
#searchpage .rightbox .searchpage-results .searchpage-result a:hover .result-table .img img{
	border: #fff 1px solid;

	-webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray; /* IE 6-9 */
  opacity: 0.6;
	
	transition-property: grayscale;
  transition-duration: 0.2s;
  transition-timing-function: ease-out;
  transition-delay: 0;
}

#searchpage .rightbox .searchpage-results .searchpage-result a .result-table .titles .en{
	font-size: 17px;
	line-height: 120%;
	font-weight: 700;
	letter-spacing: 0.05em;
	padding: 0 10px 7px 0;
}
#searchpage .rightbox .searchpage-results .searchpage-result a .result-table .titles .kana{
	font-size: 13px;
	font-weight: normal;
	line-height: 140%;
	padding: 0 10px 3px 0;
}
#searchpage .rightbox .searchpage-results .searchpage-result a .result-table .titles .yomi{
	font-size: 12px;
	line-height: 120%;
	font-weight: 400;
	font-style: italic;
	letter-spacing: 0.05em;
	color: #cecfc9;
	padding: 0 10px 0 0;
}
#searchpage .rightbox .searchpage-results .searchpage-result a:hover .result-table .titles .yomi{color: #fff;}


#searchpage .rightbox .searchpage-results .searchpage-result a .result-table .texts .text{
	font-size: 14px;
	line-height: 130%;
	font-weight: 400;
	letter-spacing: 0.05em;	
}

/* page */
#searchpage .pagination{
	padding: 30px 0 0 20px;
}


/* no result */
.searchpage-no-result{
	border-top: #cecfc9 3px solid;
	margin: 0 10px 300px 10px;
}
.searchpage-no-result h1{
	padding: 28px 0 0 0;
	font-size: 35px;
	font-style: italic;
	font-weight: 400;
	letter-spacing: 0.05em;
	color: #cecfc9;
}
.searchpage-no-result p{
	font-size: 15px;
	line-height: 150%;
	font-weight: 400;
	letter-spacing: 0.05em;
	color: #cecfc9;
}



/* sp */
.sp .leftbox{
	height: auto;
}
.sp #searchpage .leftbox .searchpage-menu{
	padding: 15px 15px 20px 15px;
	background: none;
}

.sp #searchpage .leftbox .searchpage-menu .searchpage-menu-in{
	background: none;
	padding: 0 0 0 0;
}

.sp #searchpage .leftbox .searchpage-menu h1{
	font-size: 20px;
}
.sp #searchpage .leftbox .searchpage-menu input#s2{
	margin: 0 0 15px 0;
	
	-webkit-appearance: none;
	border-radius: 0;
}
.sp #searchpage .leftbox .searchpage-menu input#submit2{
	margin: 15px 0 0 0;
	
	-webkit-appearance: none;
	border-radius: 0;
}


.sp #searchpage .rightbox .searchpage-results{
	margin: 10px 0 0 0;
	padding: 0 0 50px 0;
}
.sp #searchpage .rightbox .searchpage-results .searchpage-result a{
	padding: 0 15px 0 15px;
}

.sp #searchpage .rightbox .searchpage-results .searchpage-result a .result-table{
	margin: 0 0 0 0;
}
.sp #searchpage .rightbox .searchpage-results .searchpage-result a .result-table .img{
	width: 20%;
	float: left;
	padding: 15px 0 8px 0;
}
.sp #searchpage .rightbox .searchpage-results .searchpage-result a .result-table .titles{
	width: 72%;
	float: right;
	padding: 15px 0 8px 0;
}
.sp #searchpage .rightbox .searchpage-results .searchpage-result a .result-table .texts{
	width: 100%;
	clear: both;
	float: none;
	padding: 0 0 15px 0;
}
.sp #searchpage .rightbox .searchpage-results .searchpage-result a .result-table .texts .text{
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
}

.sp #searchpage .rightbox .searchpage-results .searchpage-result a .result-table .img img{
	width: 100%;
	height: auto;
}

.sp #searchpage .rightbox .searchpage-results .searchpage-result a .result-table .titles .en{
	padding: 5px 0px 4px 0;
}
.sp #searchpage .rightbox .searchpage-results .searchpage-result a .result-table .titles .kana{
	font-size: 12px;
	padding: 0 0 2px 0;
}
















/* =DETAIL
-------------------------------------------------------------- */
#detailpage .leftbox,
#detailpage .leftbox .detailpage-text{
	height: 100%;
}
#detailpage .leftbox .detailpage-header{
	margin: 93px 0 0 0;
	padding: 0 30px;
}
#detailpage .leftbox .detailpage-header .en{
	font-family: 'PT Serif Caption';
	font-weight: 400;
	font-size: 35px;
	color: #191919;
	line-height: 105%;
}
#detailpage .leftbox .detailpage-header .ja{
	margin: 10px 0 0 0;
}
#detailpage .leftbox .detailpage-header .ja .kana{
	font-size: 20px;
	line-height: 30px;
	font-weight: normal;
	color: #fff;
	display: inline-block;
	padding: 0 10px 0 0;
}
#detailpage .leftbox .detailpage-header .ja .yomi{
	font-size: 12px;
	line-height: 30px;
	letter-spacing: 0.1em;
	font-style: italic;
	color: #fff;
	display: inline-block;
	padding: 0 0 5px 0;
	vertical-align: middle;
}

#detailpage .leftbox .detailpage-categories{
	margin: 15px 0 0 0;
	padding: 0 30px;
	overflow: hidden;
}
#detailpage .leftbox .detailpage-categories .detailpage-category{
	overflow: hidden;
	margin: 0 30px 25px 0;
}
#detailpage .leftbox .detailpage-categories .detailpage-category h2{
	color: #fff;
	font-size: 14px;
	line-height: 18px;
	height: 18px;
	font-weight: 700;
	padding: 0;
	margin: 0;
	display: inline-block;
	letter-spacing: 0.02em;
	vertical-align: top;
}
#detailpage .leftbox .detailpage-categories .detailpage-category ul{margin: 0;overflow: hidden;display: inline-block;}
#detailpage .leftbox .detailpage-categories .detailpage-category ul li{
	float: left;
	line-height: 0;
	border-left: #e5e5e2 1px solid;
	padding: 0 0 0 8px;
	margin: 0 0 5px 5px;
}
#detailpage .leftbox .detailpage-categories .detailpage-category ul li a{
	color: #575853;
	font-size: 14px;
	line-height: 130%;
	font-weight: bold;
	letter-spacing: 0.02em;
	vertical-align: middle;
}
#detailpage .leftbox .detailpage-categories .detailpage-category ul li a:hover{
	color: #fff;
}


#detailpage .leftbox .detailpage-texts{
	background-color: #d8d9d4;
	
	overflow: auto;
	
	/* IE */
	scrollbar-base-color: #c3c4bf;
	scrollbar-track-color: #c3c4bf;
}

#detailpage .leftbox .detailpage-texts .detailpage-texts-in{
	margin: 0;
	padding: 30px 30px 0 30px;
	font-size: 16px;
	line-height: 160%;
	color: #40403d;
	text-align: justify;
	
	transition-property: margin;
  transition-duration: 0.2s;
  transition-timing-function: ease-out;
  transition-delay: 0;
}
#detailpage .leftbox .detailpage-texts .detailpage-texts-in:hover{
	margin: -15px 0 0 0;
}

#detailpage .leftbox .detailpage-texts .detailpage-texts-in p{
	text-indent: 3em;
	margin: 0 0 21px 0;
}

#detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren{
	border-top: #cecfc9 3px solid;
	padding: 25px 0 30px 0;
}
#detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren h2{
	color: #fff;
	font-size: 14px;
	line-height: 16px;
	font-weight: 700;
	padding: 0 0 10px 0;
	margin: 0;
	letter-spacing: 0.02em;
	vertical-align: top;
}
#detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren ul{margin: 0;overflow: hidden;}
#detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren ul li{
	float: left;
	line-height: 0;
	border-left: #e5e5e2 1px solid;
	padding: 0 0 0 8px;
	margin: 0 8px 10px 0;
}
#detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren ul li:first-child{border-left:none;: 0;}
#detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren ul li a{
	color: #575853;
	font-size: 14px;
	line-height: 100%;
	font-weight: bold;
	letter-spacing: 0.02em;
}
#detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren ul li a:hover{
	color: #fff;
}



/* right */
#detailpage .rightbox{
	padding: 100px 0 80px 0;
}
#detailpage .rightbox .detailpage-jalink{
	padding: 0 30px;
	text-align: right;
	margin-bottom: 60px;
}
#detailpage .rightbox .detailpage-jalink .outerlink{
	background: url(images/detail/link01.png) right center no-repeat;
	background-size: 12px 9px;
	padding: 2px 20px 1px 0;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.05em;
	color: #575853;
	line-height: 100%;
	text-decoration: underline;
	
	transition-property: opacity;
  transition-duration: 0.1s;
  transition-timing-function: linear;
  transition-delay: 0;
}
#detailpage .rightbox .detailpage-jalink .outerlink:hover{opacity: 0.6;}

#detailpage .rightbox .detailpage-photos{
	padding: 0 30px;
	text-align: center;
}
#detailpage .rightbox .detailpage-photos li{
	margin: 0 auto;
	padding: 0 0 20px 0;
}
#detailpage .rightbox .detailpage-photos li img{
	border: #f1f0f6 1px solid;
	line-height: 100%;
	width: 100%;
	max-width: 498px;
	height: auto;
}

/* img caption 2014.3.10 */
#detailpage .rightbox .detailpage-photos li .imgcap{
	display: block;
	max-width: 498px;
	font-size: 13px;
	line-height: 140%;
	padding: 5px 0 0 0;
	text-align: left;
	margin: 0 auto;
	color: #575853;
}


/* img read 2014.3.18 */
#detailpage .rightbox .detailpage-photos li .imgread{
	display: block;
	max-width: 498px;
	font-size: 15px;
	font-weight: bold;
	line-height: 140%;
	padding: 30px 0 7px 0;
	text-align: left;
	margin: 0 auto;
	color: #575853;
}


/* pc */
.pc #detailpage .moreread{
	display: none;
}


/* sp */
.sp #detailpage .leftbox,
.sp #detailpage .leftbox .detailpage-text{
	height: auto;
}
.sp #detailpage .leftbox .detailpage-header{
	margin: 15px 0 0 0;
	padding: 0 15px;
}
.sp #detailpage .leftbox .detailpage-categories{
	padding: 0 15px;
}
.sp #detailpage .leftbox .detailpage-categories .detailpage-category{
	overflow: hidden;
	margin: 0 30px 30px 0;
}
.sp #detailpage .leftbox .detailpage-categories .detailpage-category ul{display: block;}
.sp #detailpage .leftbox .detailpage-categories .detailpage-category ul li{
	float: none;
	border-left: none;
	padding: 7px 0 0 10px;
	margin: 0 0 0 0;
}
.sp #detailpage .leftbox .detailpage-categories .detailpage-category ul li a{
	font-size: 15px;
	display: block;
	padding: 3px;
}



.sp #detailpage .leftbox .detailpage-texts .detailpage-texts-in{
	margin: 0;
	padding: 30px 15px 5px 15px;
}

.sp #detailpage .leftbox .detailpage-texts .detailpage-texts-in .hidetext{
	height: 150px;
	overflow: hidden;
}

.sp #detailpage .leftbox .detailpage-texts .detailpage-texts-in .moreread{
	text-indent: 0;
	margin: 0;
	padding: 15px 0 13px 0;
}
.sp #detailpage .leftbox .detailpage-texts .detailpage-texts-in .moreread a{
	display: block;
	background-color: #fff;
	padding: 10px;
	font-weight: 700;
	font-size: 14px;
	text-align: center;
	color: #1d1d1d;
}


.sp #detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren{
	padding: 25px 0 20px 0;
}
.sp #detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren h2{
	padding: 0 0 0 0;
}
.sp #detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren ul li{
	float: none;
	border-left: none;
	padding: 7px 0 0 10px;
	margin: 0 0 0 0;
}
.sp #detailpage .leftbox .detailpage-texts .detailpage-texts-in .detailpage-kanren ul li a{
	font-size: 15px;
	display: block;
	padding: 3px;
}


.sp #detailpage .rightbox{
	padding: 15px 0 40px 0;
}
.sp #detailpage .rightbox .detailpage-jalink{
	padding: 0 15px;
	margin-bottom: 18px;
}





/*
 * CSS Styles that are needed by jScrollPane for it to operate correctly.
 *
 * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane
 * may not operate correctly without them.
 */

.jspContainer
{
	overflow: hidden;
	position: relative;
}

.jspPane
{
	position: absolute;
}

.jspVerticalBar
{
	position: absolute;
	top: 0;
	right: 0;
	width: 6px;
	height: 100%;
}

.jspHorizontalBar
{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 16px;
}

.jspVerticalBar *,
.jspHorizontalBar *
{
	margin: 0;
	padding: 0;
}

.jspCap
{
	display: none;
}

.jspHorizontalBar .jspCap
{
	float: left;
}

.jspTrack
{
	background: #d8d9d4;
	position: relative;
}

.jspDrag
{
	background: #e3e3e0;/*#90908c;*/
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
	
	-o-border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
}

.jspDrag:hover{
	background: #90908c;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag
{
	float: left;
	height: 100%;
}

.jspArrow
{
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled
{
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow
{
	height: 16px;
}

.jspHorizontalBar .jspArrow
{
	width: 16px;
	float: left;
	height: 100%;
}

.jspVerticalBar .jspArrow:focus
{
	outline: none;
}

.jspCorner
{
	background: #eeeef4;
	float: left;
	height: 100%;
}

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner
{
	margin: 0 -3px 0 0;
}