@charset "utf-8";
html {
font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN',Meiryo,sans-serif;
-ms-text-size-adjust: 100%; /* 2 */
-webkit-text-size-adjust: 100%; /* 2 */
}
body {
margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
display: block;
}
audio,
canvas,
progress,
video {
display: inline-block; /* 1 */
vertical-align: baseline; /* 2 */
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden],
template {
display: none;
}
a {
background-color: transparent;
}
a:active,
a:hover {
outline: 0;
}
abbr[title] {
border-bottom: 1px dotted;
}
b,
strong {
font-weight: bold;
}
dfn {
font-style: italic;
}
h1 {
font-size: 2em;
margin: 0.67em 0;
}
mark {
background: #ff0;
color: #000;
}
small {
font-size: 80%;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
img {
border: 0;
}
svg:not(:root) {
overflow: hidden;
}
figure {
margin: 1em 40px;
}
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
pre {
overflow: auto;
}
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
color: inherit; /* 1 */
font: inherit; /* 2 */
margin: 0; /* 3 */
}
button {
overflow: visible;
}
button,
select {
text-transform: none;
}
button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button; /* 2 */
cursor: pointer; /* 3 */
}
button[disabled],
html input[disabled] {
cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
input {
line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
input[type="search"] {
-webkit-appearance: textfield; /* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
legend {
border: 0; /* 1 */
padding: 0; /* 2 */
}
textarea {
overflow: auto;
}
optgroup {
font-weight: bold;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
* {
margin: 0;
padding: 0;
}
h1 {
font-size: 2em;
font-weight: bold;
color: #390;
line-height: 1.5;
margin-bottom: 1em;
}
img {
max-width: 100%;
height: auto;
vertical-align: top;
display: block;
}
.imgcap, .imgcapr {
padding : 0;
margin : 0.5em 1em 1em 1em;
font-size : 0.75em;
text-align : center;
}
.imgcap img, .imgcapr img {
margin: 0 auto;
}
ul, li {
list-style-type: none;
}
.sqrstyle li {
list-style-type: square;
list-style-position:inside;
}
dl {
clear: both;
margin: 1em 0;
}
dt {
color: #9c0;
font-weight: bold;
}
dt a {
color:#690;
}
dd {
line-height:1.5;
margin-bottom: 1em;
}
#headbox {
margin: 0 auto;
}
header {
float: left;
width: 100%;
}
header img {
margin: 16px auto;
float: none;
}
div#hgp1{
margin: 2px 4px 0.5em 4px;
min-width: 290px;
}
p,pre {
margin: 0 0 1em 0;
font-size: 1em;
line-height: 1.5;
color: #333;
}
pre {
font-size:0.875em;
}
.continue {
margin-bottom: 0;
}
.small {
font-size: 0.75em;
margin-bottom: 1.33em;
color: #36F;
}
.red {
color: red;
}
.sub {
color: #36F;
}
.notdisp {
display:none;
}
header p {
font-size: 0.75em;
margin: 0;
}
h2 {
clear: both;
}
h2,h3,h4,h5 {
font-size: 1.125em;
font-weight: bold;
line-height: 1.5;
color: green;
}
h2 {
font-size: 1.2em;
}
h3 {
color: #9c0;
}
#smenu {
float: right;
margin: 2px 0;
min-width: 313px;
}
#smenu form {
float: left;
margin: 0;
font-size: 0.5em;
line-height: 1;
}
#smenu select {
width: auto;
border-width: 1px;
padding: 0;
}
#smenu input {
border-width: 1px;
padding: 1px;
}
#smenu ul {
margin : 0 1px;
padding : 0;
list-style-type : none;
float : left;
}
#smenu ul li {
margin : 0 1px;
padding : 4px 1px;
border : 1px solid #999;
border-color: #CCC #666 #666 #CCC;
background-color : #EEE;
float : left;
}
#smenu ul li a {
margin : 0;
text-decoration : none;
display : block;
position : relative;
font-size : 0.5em;
line-height: 1;
}
#smenu ul li a:hover {
color: #FC3;
}
#smenu#submit {
margin: 0;
padding: 1px;
}
nav {
float: left;
background-color: #363;
width: 100%;
}
nav ul li a,
nav ul li,
nav ul { 
position: relative;
}
nav ul {
float: none;
margin:0;
background-color: #363;
text-align: center;
z-index:999999990;
}
nav ul li {
display: inline-block;
margin:0;
padding-right: 3px;
}
nav ul li.last {
padding-right: 0;
}
nav ul li a,
nav ul li span {
display: block;
background-color: #363;
color : #EEE;
line-height: 1.6;
padding:0.4em 0 0 0;
font-size : 0.5em;
font-weight : bold;
text-decoration : none;
white-space: nowrap;
overflow: hidden;
	cursor:pointer;
}
nav ul li a:hover {
color: #FC0;
}
nav ul li a.nohref {
color : #FC3;
}
nav ul ul {
display: none;
position: relative;
border-top: 1px solid #363;
margin: 0;
padding: 0;
}
nav ul > li li {
clear: both;
margin: 0;
}
nav ul li:hover {
postion: relative;
}
nav ul li:hover > ul {
display: block;
position: absolute;
top:1.2em;
left: 0;
border-width:1px 0 0 0;
}
nav ul li:hover > ul li {
clear: both;
display: block;
font-size: 0.75em;
padding-right: 0;
width: 18em;
height: auto;
background-color: #fff;
border: 1px solid #363;
border-top-width: 0;
text-align: left; /*right;*/
opacity: 1;
z-index: 3;
}
nav ul li:hover > ul li a {
position: relative;
	position: static;
display: block;
width: auto;
padding: 0 1em;
line-height: 2;
color: #060;
background-color: #fff;
white-space: nowrap;
}
nav ul li:hover > ul li a:hover {
color: #F60;
background-color: #dfd;
}
#contents {
clear: both;
overflow: hidden;
margin: 0 auto;
padding: 0 0.5em
}
#main {
margin: 1em auto;
width: 100%;
border-bottom: 1px solid #333;
}
#pkz {
font-size: 0.625em;
font-weight: bold;
text-align: left;
}
#main h1 {
display: inline-block;
}
#main ul, #main ol {
margin-bottom: 1em;
}
.lfloat li {
display: inline-block;
}
.lfloat li,
.lfloatbimg li,
.lfloatnimg li{
font-size: 0.75em;
font-weight: bold;
line-height: 1.5;
margin: 1em;
text-align: center;
}
.lfloatbimg li,
.lfloatnimg li{
display: block;
padding: 0 1em;
}
.lfloatnimg li img,
.lfloatbimg li img{
margin-left: auto;
margin-right: auto;
margin-bottom: 0.5em;
}
.lfloatbimg li img{
height: 300px;
width: auto;
}
aside {
font-size: 0.75em;
}
aside ul {
border: 1px solid #333;
border-bottom-width: 0;
width: 23em;
margin: 0.5em 1em;
list-style: none;
}
aside li {
width: 100%;
border-bottom: 1px solid #333;
}
aside li span,
aside li a {
display: block;
width: auto;
height: 100%;
padding: 0.25em 1em;
line-height: 1.5;
color: #333;
}
aside li a {
background-color: #dfd;
text-decoration: none;
}
aside li a:hover {
color: red;
background-color: white;
}
aside li a.bunnr{text-align:center;font-weight:bold;color:blue;background-color:white;}
.toPageTop {
float:right;
display:box;
border:2px solid green;
border-width:0 2px 2px 0;
border-radius:5px;
background-color:#ccc;
padding: 4px 4px 2px 4px;
color:#363;
font-size:0.815em;
text-decoration:none;
line-height:1;
}
footer {
margin: 1em 0;
font-size: 0.75em;
}
footer ul {
color: white;
background-color: black;
text-align: center;
}
footer li {
display: inline-block;
margin: 0.5em;
}
footer li a {
color: white;
text-decoration: none;
}
footer li a:hover {
color: red;
}
footer address {
text-align: right;
font-style: normal;
line-height: 1.3;
padding: 0.5em 1em;
}
.clr {
clear: both;
}
.noclr {
clear:none;
}
.fleft {
float:left;
}
.frite {
float:right;
}
.kyakuchu {
font-size: 80%;
}
.kyakuchu dd,.kyakuchu h2 {
margin-bottom: 0;
}
.btn {
border: 2px solid #333;
border-color: #ccc #333 #333 #ccc;
border-radius: 4px;
background-color: #eee;
padding: 0 0.5em;
margin-right: 1em;
}
.flatbtn {
border: 1px solid #333;
border-radius: 4px;
background-color: #eee;
padding: 0 0.5em;
margin-right: 1em;
margin-left: 1em;
}
a.btn,
a.flatbtn {
text-decoration:none;
}
hr {
clear: both;
margin: 1em 0;
}
.index ul {
margin-left:1em;
list-style-type:none;
}
#main table {
border: 0px solid #333;
border-top-width: 1px;
border-left-width: 1px;
border-spacing: 0;
overflow: scroll;
}
#main td,#main th {
border: 0px solid #333;
border-right-width: 1px;
border-bottom-width: 1px;
font-size: 0.75em;
padding: 0 0.5em;
}
#main td {
text-align: right;
}
#main th {
text-align: left;
}
.nob {
white-spacing: nowrap;
}
#main br {
clear: both;
}
#main .fleft {
float: left;
width: 40%;
min-width: 256px;
}
#main .frite {
float: right;
width: 40%;
min-width: 256px;
}

nav {text-align:center;}
.dropbtn {
background-color: #363;
color:white;
padding:0.5em;
border:none;
cursor:pointer;
font-size:0.815em;
font-weight:bold;
}
.dropdown a{
color:white;
padding:0.5em;
border:none;
font-size:0.815em;
font-weight:bold;
text-decoration: none;
}
.dropdown a:hover{
background-color: #f33;
text-decoration:underline;
}
.dropdown {
position:relative;
display:inline-block;
}
.dropdown-content {
display:none;
position:absolute;
background-color:#cfc;
min-width:200px;
box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2);
z-index:999999990;
}
.dropdown-content a{
color:#333;
padding:0.5em 0.75em;
font-size:0.75em;
font-weight: normal;
text-decoration:none;
text-align:left;
white-space: nowrap;
display:block;
}
.dropdown-content a.top_list{
font-weight:bold;
font-size:0.815em;
color:white;
background-color: #693;
}
.dropdown-content a:hover{background-color:white;}
.dropdown-content a.top_list:hover{color:#333;}
.dropdown:hover .dropdown-content {
display:block;
}
.dropdown:hover .dropbtn{
background-color:#f33;
}

.drop2 .dropdown-content{display:none;left:120px;margin-top:-32px;}
.dropdown:hover .drop2 .dropdown-content{display:none;}
.dropdown:hover .drop2:hover .dropdown-content{display:block;}

@media screen and (min-width: 420px){
.imgcap {
float : left;
margin-right: 1.5em;
}
.imgcapr {
float : right;
margin-left: 1.5em;
}
}
@media screen and (min-width: 516px){
header img {
float: left;
}
nav ul {
text-align: right;
}
nav ul li,
nav ul li.last {
padding-right: 1.5em;
}
nav ul li a{
font-size:0.75em;
}
#main {
padding-top: 0.5em;
}
h1 {
float: left;
line-height: 1;
margin-top: 0;
margin-left: 0.5em;
margin-bottom: 1em;
}
#pkz {
margin-top: 0;
margin-bottom: 1em;
float: left;
}
dl {
clear: none;
}
.lfloatnimg li,.lfloatbimg li{
display: inline-block;
}
}
@media screen and (min-width: 712px){
div#hgp1{
margin-left: 333px;
}
#contents {
margin: 0 auto;
}
#main {
margin: 1em 0;
margin-left: 2%;
width: 76%;
float: right;
border-bottom: 0;
}
aside {
width: 18%;
}
aside ul {
margin: 0.5em 0;
width: 100%;
}
footer {
clear: right;
}
.substart {
clear: left;
}
.substart,.subnext {
width: 40%;
margin: 0 3% 0 7%;
float: left;
}
}
@media print {
html, body {
font-size: 80%;
}
#contents {
margin-left: 10%;
}
.imgcap {
float : left;
margin-right: 1.5em;
}
.imgcapr {
float : right;
margin-left: 1.5em;
}
}
@media screen and (min-width: 960px) {
header img {
margin-bottom: 6px;
}
#contents {
width: auto;
max-width: 1024px;
}
#headbox, nav ul {
max-width: 1048px;
}
}
/* cgidx */
#photomenu {
margin: 5px 0 16px 10px;
height:108px;
}
#photomenu a, #photomenu div {
display: inline;
margin: 5px 1px;
padding: 4px auto;
width: 84px;
float: left;
border: 1px solid green;
text-align: center;
font-size: 8px;
font-weight: bold;
color: #333;
background-color: #ff9;
text-decoration: none;
}
#photomenu a.here,
#photomenu a.firstcolhere,
#photomenu a.lastcolhere {
background-color: white;
border-style: none;
color: green;
}
#photomenu a img {
margin : 5px auto;
}
#photomenu a:hover {
background-color: #ff0;
color: red;
}
#photomenu a.here:hover,
#photomenu a.firstcolhere:hover,
#photomenu a.lastcolhere:hover {
background-color: white;
color: green;
text-decoration: none;
}
.sub_img {
margin-left:1em;
float:right;
width:150px;
height:auto;
}
.smallndx li,
.submenu li {
display: inline-block;
font-size: 0.75em;
margin: 0 0.75em;
}
div.ca1 {
width : 100%;
margin: 12px 0;
text-align : center;
padding: 0;
}
.ca1 p{
font-size: 0.75em;
margin-top:0.5em;
font-weight:bold;
}
.ca1 img {
margin : 0 auto;
}
.ca2 {
margin : 8px 12px;
padding : 0;
}
div.ca2r {
display: none;
}
.ca2l h3, .ca2l h2, .ca2l p,
.ca2l h3 a, .ca2l h2 a {
margin: 0;
padding: 0.5em 0.5em 0 0;
font-size : 1em;
border : 0;
}
.ca2l p {
font-size : 0.75em;
}
.ca2l h3, .ca2l h2 {
clear: none;
}
.ca2l h3 a, .ca2l h2 a {
font-weight: bolder;
color: #333;
}
.ca2l h3 a:hover, .ca2l h2 a:hover {
color: #C03;
}
.ca2l dl {
margin: 0;
padding: 0;
}
.ca2l dd, .ca2l dt {
display: block;
margin: 0;
padding: 0 0.5em 0 0;
font-size : 0.75em;
}
.ca2l dt {
float: left;
color: green;
font-weight: bold;
}
.fl2 {
text-align:center;
margin:0.5em auto;
min-width:100px;
max-width:160px;
}
.fl3 {
margin:8px auto;
width:226px;
height:270px;
}
a.fl3{display:block;}
.fl2 h2, .f12 h3 {
font-size:0.75em;
clear:none;
overflow:none;
}
.fl3 h2{margin-top:0.5em;font-size:1em;clear:none;overflow:none;}
.fl2 img,.fl3 img {
margin-left:auto;
margin-right:auto;
}
.fl2 a,a.fl3 {
text-decoration:none;
}
.fl2 a:hover h2,a.fl3:hover h2,a.fl3:hover p{
color:red;
}
.fl3 a{display:block;}
/*.fl3 p{font-size:0.75em;margin-bottom:0;margin-left:48px;}*/
.fl3 p{font-size:0.75em;margin-bottom:0;margin-left:auto;margin-right:auto;}
.fl3 p.price{font-size:0.875em;font-weight:bold;}
.synopsis p{color:#363;font-size:0.875em;}
.synopsis strong{color:#c00;}
div.synopsis{margin-bottom:1.5em;}
.synopsis hr,.greendot{color:green;border-style:dotted;}
aside li {
line-height:1;
/*text-align:right;*/
}
/*
aside ul,aside li {
border-width:0;
}
aside li a,aside li a:hover {
background-color:transparent;
}
*/
#main table,
#maind tr,
#main td {
border-width:0;
}
#main td {
text-align:center;
}
div#directp {
margin: 2em 1em 0 0;
float:right;
font-size:0.625em;
font-weight:bold
}
.ml320 strong,
.ml240 strong,
.ml220 strong,
.ml190 strong,
.ml140 strong{
color:red;
}
@media print {
div.ca1 {
float : left;
width : 170px;
}
.ca2 {
margin-left:180px;
}
.ca2l dd,
.ca2l dt {
float:left;
}
.ca2l dl {
display: inline-block;
}
}
#photomenu, .hidable {
display:none;
}
@media screen and (min-width: 516px){
#photomenu, .hidable {
display:block;
}
.w300 {
width:300px;
}
.ml320 {
margin-left:320px;
}
.ml240 {
margin-left:240px;
}
.ml220 {
margin-left:220px;
}
.ml190 {
margin-left:190px;
}
.ml140 {
margin-left:140px;
}
div.ca1 {
float : left;
width : 170px;
}
.ca2 {
margin-left:180px;
}
.ca2l dd {
float: left;
}
.fl2 {
margin:0.5em;
min-height:120px;
max-height:180px;
float:left;
}
.fl3 {
margin:8px 12px;
float:left;
}
}
@media screen and (min-width: 712px){
div.ca2r {
display: block;
margin: 0;
padding : 0;
text-align: center;
width : 60px;
float : right;
}
.ca2r img {
margin: 20px auto;
padding : 0;
}
}

/* add2 */
section{
clear:both;
}
.begin{
width:100%;
}
.main_description{
width:95%;
margin:0;
padding:0 0 0 20px;
}
.main_description h1{
color:yellowgreen;
font-size:1.5em;
line-height: 1.5;
margin:0;
padding:0;
}
.main_description p{
margin:0 0 16px 0;
padding:0;
clear:left;
}
.main_description strong{
color:#f40;
}
.main_picture{
position:relative;
margin:0 0 1em 0;
width:100%;
background-color: #EEE;
text-align: center;
}
.main_picture img{
display:inline-block;
vertical-align: middle;
margin:16px 0;
max-width:90%;
max-height:300px;
}
.main_picture p{
position:absolute;
top:75%;
width:100%;
height:25%;
background-color:gray;
color:lightyellow;
opacity: 0.5;
}
@media screen and (min-width:516px) {
.main_description{
width:50%;
float:left;
}
.main_picture{
width:45%;
float:left;
}
}