body{ font-family: 'Cormorant Garamond', serif;}

@media screen and (max-width: 479px) {
  .menu{float: right; height: 100vh; width: 30vw; margin-top: 30px;}
  .menu ul{ margin-top: 0px; padding: 0; list-style: none; height: 100vh;}
  .menu li a{ display: block; padding: 0px 5px; text-decoration: none;
        margin: 5px 0px; text-align: right; font-size: 100%;}
  .oya{ height: 100vh; width:70vw;}
}

@media screen and (min-width: 480px) {
.menu { float: right;  height: 100vh; width: 20vw;  margin-top: 30px;}
.menu ul{ margin-top: 0px; padding: 0; list-style: none; height: 100vh;}
.menu li{ display: inline; padding: 0; margin: 0; height: 100vh;}
.menu li a{ display: block; padding: 3px 10px; text-decoration: none;
margin: 2px 0px; text-align: right; font-size: 120%; }
.oya{width: 70vw; height: 100vh;}
}



a:link {/*未訪問のリンク*/ color:black;}
a:visited {/*訪問後のリンク*/color:gray;}

.image-link{ float: left; width: 200px; margin-left: 3%;}
.image-link img{ margin-top: 30px; margin-bottom: 10px;}

.sample1 { overflow: hidden; position: relative;/* 相対位置指定 */}
.sample1 .mask { width: 100%; height: 50%;
  margin-top: 30px;
	position: absolute;	/* 絶対位置指定 */
	top: 0; left: 0;
	opacity: 0;	/* マスクを表示しない */
	background-color:	rgba(255,255,255,0.3);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition:	all 0.2s ease;}
.sample1:hover .mask { opacity:		1;	/* マスクを表示する */}

.info{ float: left; font-size: 70%; width:100%; height: 150px; line-height: 140%;}

.lb-loader,.lightbox{text-align:center;line-height:0}

body:after{ content:url(../img/close.png) url(../img/loading.gif) url(../img/prev.png) url(../img/next.png);display:none}

.lb-dataContainer:after,.lb-outerContainer:after{content:"";clear:both}

body.lb-disable-scrolling{overflow:hidden}

.lightboxOverlay{ position:absolute;
  top:0; left:0;
  z-index:9999;
  background-color:#000;
  filter:alpha(Opacity=80);
  opacity:.8;
  display:none}

.lightbox{ position:absolute;
  left:0;
  width:100%;
  z-index:10000;
  font-weight:200 }

.lightbox .lb-image{ display:block;
  height:auto;
  max-width:inherit; max-height:none;
  border-radius:3px; border:4px solid #fff }

.lightbox a img{border:none}

.lb-outerContainer{ position:relative;
  width:250px; height:250px;
  margin:0 auto;
  border-radius:4px;
  background-color:#fff}

.lb-loader,.lb-nav{ position:absolute; left:0}
.lb-outerContainer:after{display:table}
.lb-loader{top:43%;height:25%;width:100%}
.lb-cancel{display:block;
  width:32px; height:32px;
  margin:0 auto;
  background:url(../img/loading.gif) no-repeat }
.lb-nav{top:0; height:100%; width:100%; z-index:10}
.lb-container>.nav{left:0}
.lb-nav a{ outline:0;
  background-image:url(data:img/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==)}
.lb-next,.lb-prev{ height:100%; cursor:pointer; display:block}
.lb-nav a.lb-prev{ width:34%; left:0; float:left;
  background:url(../img/prev.png) left 48% no-repeat;filter:alpha(Opacity=0);
  opacity:0;
  -webkit-transition:opacity .6s;-moz-transition:opacity .6s;-o-transition:opacity .6s;transition:opacity .6s}
.lb-nav a.lb-prev:hover{filter:alpha(Opacity=100);opacity:1}
.lb-nav a.lb-next{  width:64%;  right:0; float:right;
  background:url(../img/next.png) right 48% no-repeat;filter:alpha(Opacity=0);
  opacity:0;-webkit-transition:opacity .6s;-moz-transition:opacity .6s;-o-transition:opacity .6s;
  transition:opacity .6s}
.lb-nav a.lb-next:hover{ filter:alpha(Opacity=100); opacity:1}
.lb-dataContainer{ margin:0 auto;padding-top:5px; width:100%;
  -moz-border-radius-bottomleft:4px;
  -webkit-border-bottom-left-radius:4px;
  border-bottom-left-radius:4px;
  -moz-border-radius-bottomright:4px;
  -webkit-border-bottom-right-radius:4px;
  border-bottom-right-radius:4px}
.lb-dataContainer:after{display:table}
.lb-data{padding:0 4px;color:#ccc}
.lb-data .lb-details{width:85%;float:left;text-align:left;line-height:1.1em}
.lb-data .lb-caption{font-size:13px;font-weight:300;line-height:1em}
.lb-data .lb-caption a{color:#4ae}
.lb-data .lb-number{display:block;clear:left;padding-bottom:1em;font-size:12px;color:#999}
.lb-data .lb-close{display:block;float:right;width:30px;height:30px;background:url(../img/close.png) top right no-repeat;text-align:right;outline:0;filter:alpha(Opacity=70);opacity:.7;-webkit-transition:opacity .2s;-moz-transition:opacity .2s;-o-transition:opacity .2s;transition:opacity .2s}
.lb-data .lb-close:hover{cursor:pointer;filter:alpha(Opacity=100);opacity:1}

#pageTop{ position: fixed; right: 10px; bottom: 10px;}