@charset "UTF-8";

/* =====================
	CSSリセット
======================= */
*,
*:before,
*:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

* {
	margin:0;
	padding:0;
}

ul {
	list-style:none;
}

br {
	letter-spacing:0;
}

img {
	max-width:100%;
	height:auto;
	border:none;
	vertical-align:top;
}

/* clearfix */
.clearfix:before,
.clearfix:after {
	content: " ";
	display: table;
}

.clearfix:after {
	display: block;
	height: 0;
	font-size:0;
	clear: both;
	visibility:hidden;
}

.clearfix {
	display: inline-block;
}

.clearfix {
*zoom: 1;
}

/* Hides from IE Mac \*/
* html .clearfix {
	height: 1%;
}

.clearfix {
	display:block;
}

/* End Hack */

/* Small screens (default) */
html,body {
    font-size: 100%;
	height: 100%;
	-webkit-text-size-adjust: 100%;
    
}

.container {
	width:94%;
	max-width:890px;
	margin:0 auto -40px;
	min-height: 100%;
	height: auto !important;
	height: 100%;
    
}


/* ~~ フッター ~~ */
#push,
#footer {
	text-align:center;
	height:40px;
}


#footer p {
	font-size:10px;
	color: #CCC;
}

/* =====================
	ギャラリー
======================= */
#contents {
　　 width:100%;
    margin:2% auto;
    
}


#contents ul {
	margin:0 -10px -10px 0;
}

#contents li {
	float:left;
	width:160px;
	height:205px;
	margin:0 10px 10px 0;
}

#contents li img,
#edcontents li img{
        -webkit-transition: 0.3s ease;  
       -moz-transition: 0.3s ease;  
         -o-transition: 0.3s ease;  
            transition: 0.3s ease;
}

#contents li img:hover,
#edcontents li img:hover {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* IE */
	filter: alpha(opacity=80); /* IE */
	-moz-opacity:0.8; /* Firefox(old) */
	-khtml-opacity: 0.8; /* Safari(old) */
	opacity: 0.8;
}
}

/* =====================
	タブレット向け
======================= */
@media screen and (min-width: 601px) and (max-width: 800px) {

#contents ul {
	margin:0;
}

#contents li {
	width:22%;
	height:auto;
	margin:0 2% 2% 0;
}

#contents li:nth-child(4n) {
	margin-right:0;
}

#contents li img {
	width:100%;
	height:auto;
}
/* タブレット向けここまで*/ }

/* =====================
	スマホ向け
======================= */
@media screen and (max-width: 600px) {

#contents {
	width:90%;
	margin:5% auto;
}

#contents ul {
	margin:0;
}

#contents li {
	width:30%;
	height:auto;
	margin:0 3% 3% 0;
}

#contents li:nth-child(3n) {
	margin-right:0;
}

#contents li img {
	width:100%;
	height:auto;
}
/* スマホ向けここまで */ }

/* =====================
	エディトリアルギャラリー
======================= */

#edcontents {
　　 width:100%;
    margin:2% auto;
}


#edcontents ul {
	margin:0 -10px -10px 0;
}

#edcontents li {
	float:left;
	width:290px;
	height:205px;
	margin:0 10px 10px 0;
	text-align: center;
}

/* =====================
	エディトリアルタブレット向け
======================= */
@media screen and (min-width: 601px) and (max-width: 800px) {

#edcontents ul {
	margin:0;
}

#edcontents li {
	width:32%;
	height:auto;
	margin:0 2% 2% 0;
}

#edcontents li:nth-child(3n) {
	margin-right:0;
}

#edcontents li img {
	width:100%;
	height:auto;
}
/* タブレット向けここまで*/ }

/* =====================
	スエディトリアルマホ向け
======================= */
@media screen and (max-width: 600px) {

#edcontents {
	width:90%;
	margin:5% auto;
}

#edcontents ul {
	margin:0;
}

#edcontents li {
	width:45%;
	height:auto;
	margin:0 3% 3% 0;
}

#edcontents li:nth-child(2n) {
	margin-right:0;
}

#edcontents li img {
	width:100%;
	height:auto;
}
/* スマホ向けここまで */ }

/*上のメニュー*/
/* common and top level styles */

.column.six {
	 float: left;
     width:80px;
     height:125px;
	 padding: 1% 0;
}

.column.six img {
	width: 80px;
}

.column.nine {
	float: left;
	width: 90%;
}


#logo a img{
     width:80px;
     height:115px;
　　　transition: 0.3s ease;/* CSS3 */
    -webkit-transition: 0.3s ease;/* for Safari and Chrome */
    -moz-transition: 0.3s ease;/* for Firefox */
    -o-transition: 0.3s ease;/* when Opera Presto 2.3 or later is released */
    -ms-transition: 0.3s ease;/* Linux browsers */
}

#logo a:hover img{
 opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

#nav span {
	display: none;
}

#nav,
#nav ul {
	list-style: none outside none;
	margin: 0;
	padding: 0;
}

#nav {
	float: left;
	margin-left: 1%;
	margin-right: 1%;
	margin-top: 8%;
	position: relative;
	width: 98%;
     z-index:3;
}

#nav > li {
	border-bottom: 5px solid transparent;
	float: left;
	text-align: left;
	margin-right: 3px;
	border-right: solid 1px #000000;
    
}

#nav li a {
	overflow: hidden;
	display: block;
    
    
}

#nav > li > a {
	text-indent: 100%;
	white-space: nowrap;
	height: 29px;
	background: url(../images/menu04.png) no-repeat top left;
}

#nav li.active > a {
	background-color: #333333;
	color: #FFFFFF;
}

#nav li.menu2 > a {
	background-position: -11px 0;
	width: 81px;
}

#nav li.menu3 > a {
	background-position: -101px 0;
	width: 203px;
}

#nav li.menu4 > a {
	background-position: -311px 0;
	width: 118px;
}

#nav li.menu5 > a {
	background-position: -437px 0;
	width: 122px;
}

#nav li.menu6 > a {
	background-position: -570px 0;
	width: 209px;
}

#nav > li.menu2:hover > a,
#nav li.menu2 > a:hover {
	background-position: -11px -27px;
	width: 81px;
}

#nav > li.menu3:hover > a,
#nav li.menu3 > a:hover {
	background-position: -101px -27px;
	width: 203px;
}

#nav > li.menu4:hover > a,
#nav li.menu4 > a:hover {
	background-position: -311px -27px;
	width: 118px;
}

#nav > li.menu5:hover > a,
#nav li.menu5 > a:hover {
	background-position: -437px -27px;
	width: 122px;
}

#nav > li.menu6:hover > a,
#nav li.menu6 > a:hover {
	background-position: -570px -27px;
	width: 209px;
}

#nav ul.subs {
	background-color: #FFFFFF;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
	color: #333333;
	display: none;
	left: 0;
	padding: 1% 2% 2% 2%;
	position: absolute;
	top: 34px;
	width: 98%;
    
}

/* submenu */
#nav li:hover ul.subs {
	display: block;
    
    }

#nav ul.subs > li {
	float: none;
	padding: 0 1%;
	vertical-align: top;
	width: 80%;
}

#nav ul.subs > li a {
	display: block;
	height: 21px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background: url(../images/menu04.png) no-repeat top left;
}

#nav ul.subs > li li {
	border-bottom: solid 1px #000000;
	float: none;
	padding-left: 8px;
	padding: 5px 0;
}

/* サブメニューBOOKS */
#nav li.menu2 ul.subs li.book0 > a {
	background-position: -11px -4px;
	width: 81px;
}

#nav li.menu2 ul.subs li.book0 li.book1 a {
	background-position: -10px -58px;
	width: 118px;
}

#nav li.menu2 ul.subs li.book0 li.book2 a {
	background-position: -413px -58px;
	width: 124px;
}

#nav li.menu2 ul.subs li.book0 li.book3 a {
	background-position: -554px -58px;
	width: 107px;
}

#nav li.menu2 ul.subs li.book0 li.book4 a {
	background-position: -670px -58px;
	width: 191px;
}

#nav li.menu2 ul.subs li.book0 li.book5 a {
	background-position: -150px -58px;
	width: 208px;
}

#nav li.menu2 ul.subs li.book0 > a:hover {
	background-position: -11px -32px;
	width: 81px;
}

#nav li.menu2 ul.subs li.book0 li.book1 a:hover {
	background-position: -10px -80px;
	width: 118px;
}

#nav li.menu2 ul.subs li.book0 li.book2 a:hover {
	background-position: -413px -80px;
	width: 124px;
}

#nav li.menu2 ul.subs li.book0 li.book3 a:hover {
	background-position: -554px -80px;
	width: 107px;
}

#nav li.menu2 ul.subs li.book0 li.book4 a:hover {
	background-position: -670px -80px;
	width: 191px;
}

#nav li.menu2 ul.subs li.book0 li.book5 a:hover {
	background-position: -150px -80px;
	width: 208px;
}

/* サブメニューentertainment */
#nav li.menu3 ul.subs li.enter0 > a {
	background-position: -101px -5px;
	width: 203px;
}

#nav li.menu3 ul.subs li.enter0 li.enter1 a {
	background-position: -871px -58px;
	width: 110px;
}

#nav li.menu3 ul.subs li.enter0 li.enter2 a {
	background-position: -989px -58px;
	width: 210px;
}

#nav li.menu3 ul.subs li.enter0 > a:hover {
	background-position: -101px -32px;
	width: 203px;
}

#nav li.menu3 ul.subs li.enter0 li.enter1 a:hover {
	background-position: -871px -80px;
	width: 110px;
}

#nav li.menu3 ul.subs li.enter0 li.enter2 a:hover {
	background-position: -989px -80px;
	width: 210px;
}

/* サブメニューpackage */
#nav li.menu4 ul.subs li.pac0 > a {
	background-position: -311px -5px;
	width: 118px;
}

#nav li.menu4 ul.subs li.pac0 li.pac1 a {
	background-position: -154px -100px;
	width: 140px;
}

#nav li.menu4 ul.subs li.pac0 li.pac2 a {
	background-position: -459px -100px;
	width: 140px;
}

#nav li.menu4 ul.subs li.pac0 > a:hover {
	background-position: -311px -32px;
	width: 118px;
}

#nav li.menu4 ul.subs li.pac0 li.pac1 a:hover {
	background-position: -9px -100px;
	width: 140px;
}

#nav li.menu4 ul.subs li.pac0 li.pac2 a:hover {
	background-position: -299px -100px;
	width: 140px;
}

/* サブメニューlogotype */

#nav li.menu5 ul.subs li.logo0 li.logo1 a {
	background-position: -624px -100px;
	width: 100px;
}

#nav li.menu5 ul.subs li.logo0 li.logo1 a:hover {
	background-position: -723px -100px;
	width: 100px;
}

/* サブメニューgood-others */
#nav li.menu6 ul.subs li.good0 li.good1 a {
	background-position: -903px -100px;
	width: 150px;
}

#nav li.menu6 ul.subs li.good0 li.good1 a:hover {
	background-position: -1076px -100px;
	width: 150px;
}



/* 1025px以上のサブメニュー幅 */
@media screen and (min-width: 1025px) {

#nav li.menu2 ul.subs {
	width: 760px;
}

#nav li.menu3 ul.subs {
	left: 80px;
	width: 680px;
}

#nav li.menu4 ul.subs {
	left: 286px;
	width: 474px;
}
#nav li.menu5 ul.subs {
	left: 407px;
	width: 354px;
}
#nav li.menu6 ul.subs {
	left: 534px;
	width: 224px;
}


}

/* responsive rules */
@media all and (max-width : 1025px) {

#nav > li {
	float: none;
	border-bottom: 0;
	margin-bottom: 0;
}

#nav ul.subs {
	position: relative;
	top: 0;
}

#nav li:hover ul.subs {
	display: none;
}

#nav li #s1:target + ul.subs,
#nav li #s2:target + ul.subs,
#nav li #s3:target + ul.subs,
#nav li #s4:target + ul.subs,
#nav li #s5:target + ul.subs {
	display: block;
}

#nav ul.subs > li {
	display: block;
	width: auto;
}
}


/* enlarge */
div.enlarge{

float: right;
font-size: 80%;
width: 150px;
padding-top: 5px;
margin-left: auto;
}

/* リスト全体 */

.pagelinks{

float: right;
margin: 0 5% 0 0;

}

.pagelinks ul{
float: right;
}

/* 各項目の装飾 */
.pagelinks ul li {
    display: inline-block;
	width: 35px;           /* 横幅 */
	line-height: 30px;     /* 高さ */
	list-style-type: none;  /* 先頭記号なし */
	margin: 0.1em;          /* 周囲の余白 */
	padding: 0px;           /* 内側の余白 */
	font-family: Arial, sans-serif;/* フォント */
	text-align: center;     /* センタリング */
    
}

/* リンクの装飾 */
.pagelinks ul li.link a{
	display: block;        /* ブロック化 */
	text-decoration: none; /* 下線を消す */
    background-color: white; /* 背景色 */
	color:Black;             /* 文字色 */
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
}


.pagelinks ul li.link a:hover {
	background-color: #e60012; /* 背景色 */
	color: WHITE;          /* 文字色 */
}

/* 現在位置項目の装飾 */
.pagelinks ul li.here,
.pagelinks ul li.space {
 background-color:; /* 背景色 */
 color:#e60012;          /* 文字色 */
 border-color:;     /* 枠線色 */
}

/* nextの装飾 */
.pagelinks ul li.next a {
	display: block;        /* ブロック化 */
    background:url(../images/nexthover.png) no-repeat; 
    width:30px;
    height:30px;

    }

.pagelinks ul li.next:hover a {
background-color: transparent;
width:30px;
height:30px;
}
.pagelinks ul li.next img {
vertical-align:middle;
        -webkit-transition: 0.3s ease-in-out;  
       -moz-transition: 0.3s ease-in-out;  
         -o-transition: 0.3s ease-in-out;  
            transition: 0.3s ease-in-out; 
}

.pagelinks ul li.next:hover img {
visibility: hidden;
opacity: 0;
filter: alpha(opacity=0); 
}


/*logogallery*/

div .logotype01 {
	width:100%;
	margin:0 auto;
	text-align: center;
	padding-top: 7%;
	padding-bottom: 3%;
}

div .logotxt {
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
	width:60%;
	margin:0 auto;
	text-align: center;
	padding: 10px 0px 10px 0px;
}

/* Image style */


div.tothetopfixed {
	position: fixed;
	right: 30px;
	bottom: 25px;
	z-index: 1500;
}	

div.tothetopfixed a {
	display: block;
	height: 35px;  /* Height of image */
	width: 35px; /* Width of image */
}

div.tothetopfixed a:hover img {
	
	opacity:0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
	background: #fff;
	}