div.menu nav ul li a {
	position: relative;
	background-color: #fff;
}
/*
div.menu nav ul li.blog a {
	margin-right: 0;
}
*/
div.menu nav ul li.dvd a {
	margin-right: 0;
}

div.menu nav ul li a {
	display: inline-block;
	/* border-radius:10px 10px 10px 10px; */
	box-sizing: border-box;
}


/*	pc
============================== */
@media all and (min-width: 768px) {
	div.menu {
		/* padding: 30px; */
		position: relative;
		margin-bottom: 15px;
		height: 890px;
	}
	div.menu nav ul li a {
		overflow: hidden;
		text-indent: 110%;
		white-space: nowrap;
		/* float: left; */
		margin-right: 10px;
		margin-bottom: 10px;
		background-repeat: no-repeat;
		background-position: center;
		position: absolute;
	}
	div.menu nav ul li:not(.hitokoto) a {
		box-shadow:0px 0px 10px 3px rgba(0,0,0,0.1);
}
	div.menu nav ul li.story a { left: 310px; top: 0; }
	div.menu nav ul li.intro a {left: 690px;top: 0;}
	div.menu nav ul li.original a { left: 840px; top: 0; }
	div.menu nav ul li.cast a { left: 690px; top: 124px; }
	div.menu nav ul li.staff a { left: 840px; top: 124px; }
	div.menu nav ul li.chart a { left: 0; top: 249px; }
	div.menu nav ul li.report a {left: 495px; top: 0;}
	div.menu nav ul li.message a {right: 0;top: 249px;}
	div.menu nav ul li.talk a { left: 0; top: 379px; }
	div.menu nav ul li.interview a { left: 495px; top: 379px; }
	div.menu nav ul li.gallery a { left: 0; top: 509px; }
	div.menu nav ul li.present a { left: 330px; top: 509px; }
	/*div.menu nav ul li.blog a { right: 0; top: 509px; }*/
	div.menu nav ul li.dvd a { right: 0; top: 509px; }
	div.menu nav ul li.ishop a { left: 0; top: 639px; }
	div.menu nav ul li.tbsfree a { left: 495px; top: 639px; }
	div.menu nav ul li.paravi a { right: 0; top: 639px; }
	div.menu nav ul li.hitokoto a { left: 248px; top: 769px; }
	div.menu nav ul li.stamp a { left: 248px; top: 639px; }
	div.menu nav ul li.intro a,
	div.menu nav ul li.original a,
	div.menu nav ul li.cast a,
	div.menu nav ul li.staff a {
		padding: 5px;
		background-size: 135%;
	}
	div.menu nav ul li.intro a span,
	div.menu nav ul li.original a span,
	div.menu nav ul li.cast a span,
	div.menu nav ul li.staff a  span {
		display: block;
		width: 100%;
		height: 100%;
		border: 1px solid #fff;
		box-sizing: border-box;
	}

	div.menu nav ul li.basemanu_btn a {
		width: 140px;
		height: 115px;
	}
	div.menu nav ul li.story_btn a {
		width: 370px;
		height: 240px;
		background-size: 370px 240px;
	}
	div.menu nav ul li.n2_btn a {
		width: 485px;
		height: 120px;
		background-size: 485px 120px;
	}
	div.menu nav ul li.n3_btn a {
		width: 320px;
		height: 120px;
		background-size: 320px 120px;
	}
	div.menu nav ul li.n4_btn a {
		width: 237px;
		height: 120px;
		background-size: 237px 120px;
	}
	div.menu nav ul li:nth-child(3) a,
	div.menu nav ul li:nth-child(5) a,
	div.menu nav ul li:nth-child(8) a,
	div.menu nav ul li:nth-child(11) a,
	div.menu nav ul li:nth-child(14) a,
	div.menu nav ul li:nth-child(17) a,
	/*div.menu nav ul li.blog,*/
	div.menu nav ul li.dvd
	 {
		margin-right: 0;
	}
	/*div.menu nav ul li.invite {
		margin: 0 auto;
		width:  472px;
	}*/
}
/*	smp
============================== */
@media all and (max-width: 767px) {
	div.menu nav ul li.intro a span,
	div.menu nav ul li.original a span,
	div.menu nav ul li.cast a span,
	div.menu nav ul li.staff a span {
		padding: 5px;
		box-sizing: border-box;
	}
	div.menu nav ul li.intro a > span > b,
	div.menu nav ul li.original a > span > b,
	div.menu nav ul li.cast a > span > b,
	div.menu nav ul li.staff a > span > b {
		display: block;
		width: 100%;
		height: 100%;
		border: 1px solid #fff;
		box-sizing: border-box;
	}

	div.menu {
		padding: 0 10px;
	}
	div.menu nav ul li {
		float: left;
		margin-bottom: 2%;
	}
	div.menu nav ul li:not(.hitokoto) a {
		box-shadow:0px 1px 3px 1px #a3a3a3;
	}

	div.menu nav ul li a span {
		overflow: hidden;
		text-indent: 110%;
		white-space: nowrap;
	}
	div.menu nav ul li.basemanu_btn,
	div.menu nav ul li.n4_btn {
		width: 49%
	}
	div.menu nav ul li.intro,
	div.menu nav ul li.cast,
	div.menu nav ul li.report,
	div.menu nav ul li.ishop,
	div.menu nav ul li.tbsfree {
		margin-right: 2%;
	}
	div.menu nav ul li.story_btn,
	div.menu nav ul li.n2_btn,
	div.menu nav ul li.n3_btn {
		width: 100%
	}
	div.menu nav ul li.basemanu_btn a {
		display: block;
		background-size: 100%;
		background-position: center;
		background-repeat:  no-repeat;
		height:0;
		/* 縦÷横 */
		padding-top: 56.1643835616438%;
		position: relative;
	}
	div.menu nav ul li.basemanu_btn a span {
		display: block;
		position:absolute;
		left:0;
		top:0;
		width:100%;
		height: 100%;
	}
	div.menu nav ul li.story_btn a {
		display: block;
		background-size:cover;
		height:0;
		/* 縦÷横 */
		padding-top: 64.8648648648649%;
		position: relative;
	}
	div.menu nav ul li.story_btn a span {
		display: block;
		position:absolute;
		left:0;
		top:0;
		width:100%;
		height: 100%;
	}
	div.menu nav ul li.n4_btn a {
		display: block;
		background-size:cover;
		height:0;
		/* 縦÷横 */
		padding-top: 50.6329113924051%;
		position: relative;
	}
	div.menu nav ul li.n4_btn a span {
		display: block;
		position:absolute;
		left:0;
		top:0;
		width:100%;
		height: 100%;
	}
	div.menu nav ul li.n3_btn a {
		display: block;
		background-size:cover;
		height:0;
		/* 縦÷横 */
		padding-top: 37.5%;
		position: relative;
	}
	div.menu nav ul li.n3_btn a span {
		display: block;
		position:absolute;
		left:0;
		top:0;
		width:100%;
		height: 100%;
	}
	div.menu nav ul li.n2_btn a {
		display: block;
		background-size:cover;
		height:0;
		/* 縦÷横 */
		padding-top: 24.7422680412371%;
		position: relative;
	}
	div.menu nav ul li.n2_btn a span {
		display: block;
		position:absolute;
		left:0;
		top:0;
		width:100%;
		height: 100%;
	}
}



/*	report up date
============================== */
/*	Web Fonts */
@font-face {
	font-family: 'Dosis-Bold';
	src: url('/um/library/fonts/Dosis/Dosis-Bold.ttf') format("truetype");
}
@font-face {
	font-family: 'CrimsonText-Regular';
	src: url('/um/library/fonts/Crimson_Text/CrimsonText-Regular.ttf') format("truetype");
}


div.menu nav ul li.report a span.up,
div.ft_menu nav ul li.report a span.up {
	position: absolute;
	color: #fff;
	text-shadow:0px 2px 5px #000,0px -2px 5px #000,2px 0px 5px #000,-2px 0px 5px #000;
	letter-spacing: 0.06em;
	font-family: 'CrimsonText-Regular', 'sans serif';
}
@media all and (min-width: 768px) {
	div.menu nav ul li.report a,
	div.ft_menu nav ul li.report a {
		overflow: unset;
		white-space: normal;
		text-indent: unset;
		position:  absolute;
		position: relative;
	}

	div.menu nav ul li.report a span.up,
	div.ft_menu nav ul li.report a span.up {
		left: 5%;
		bottom: 14px;
		margin-left: -1.7em;
		font-size: 17px;
		text-align: center;
		margin:  0 auto;
		width: 237px;
		display: block;
		padding-top: 41px;
	}
}
@media all and (max-width: 767px) {
	div.menu nav ul li.report a span.up,
	div.ft_menu nav ul li.report a span.up {
		overflow: unset;
		text-indent: unset;
		white-space: normal;
		width: 100%;
		height: unset;
		left: 23.77193%;
		top: 52.428571%;
		font-size: 4.3vw;
	}
}





/*	lower menu
============================== */
/*///////////////// nav ////////////////*/
.hd_menu nav ul.menu a{display:block;}

.hd_menu nav ul.menu{margin:0 auto;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-pack:justify;
    -moz-box-pack:justify;
    -webkit-flex-pack:justify;
    -moz-flex-pack:justify;
    -ms-flex-pack:justify;
    -webkit-justify-content:space-between;
    -moz-justify-content:space-between;
    justify-content:space-between;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}

.hd_menu nav ul.menu li {text-indent: -9999px;transition:0.5s ;background-repeat:no-repeat;background-size:contain;}


.hd_menu nav ul.menu li {
	background-color: hsla(0, 0%, 0%, 0.5);
	border-radius: 5px;
}


	#menu01 {background-image:url(../img/hdm_info.png);}
	#menu02 {background-image:url(../img/hdm_intro.png) ;}
	#menu03 {background-image:url(../img/hdm_original.png) ;}
	#menu04 {background-image:url(../img/hdm_story.png) ;}
	#menu05 {background-image:url(../img/hdm_cast.png) ;}
	#menu06 {background-image:url(../img/hdm_staff.png) ;}




/* bt Flashing */
.hd_menu nav ul.menu li:hover {opacity: 1;-webkit-animation: flash 1s;animation: flash 1s;}
@-webkit-keyframes flash {0% {opacity: .6;}100% {opacity: 1;}}
@keyframes flash {0% {opacity: .6;}100% {opacity: 1;}}


@media all and (min-width: 768px) {
.hd_menu nav {background:#224367; background-image: url(../img/flower.jpg);}
.hd_menu nav ul.menu{
    width:940px;
    height:100px;
    margin: 0 auto 30px;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    }
.hd_menu nav ul.menu li a{width:150px;height:80px;}
.hd_menu nav ul.menu li {width:150px;height:80px;}
}
@media all and (max-width: 767px) {
.hd_menu nav {background-color: rgba(19,36,59,0); background-image: url(../img/flower02.jpg);}
.hd_menu nav ul.menu{width:95%;margin:0 auto;padding: 5px 0 0;}
.hd_menu nav ul.menu li{width:32%;margin-bottom:  5px;}
.hd_menu nav ul.menu li:nth-child(-n+3){/* margin-bottom: 5px; */}
.hd_menu nav ul.menu li a{width:100%;height:0;padding-top:53.2%;}
}