/*
Theme Name: light design office
Theme URI: //hj-d.net/
Description: light design office
Version: 1.0
Author: hondajunko
Author URI: //hj-d.net/
Tags: simple, clean, gallery
*/


html, body, div, span, applet, object, iframe, strong,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, legend, caption, 
tbody, tfoot, thead, table, label, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	list-style:none;
	}

body{
	font-family:"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","ＭＳ 明朝","MS Mincho",Serif;
	font-size:12px;
	letter-spacing:0.1em;
	color:#666666;
	background-image:url(https://gallery.hj-d.net/wp-content/uploads/2018/12/pat.png);
}

a{
	color:#666666;
	text-decoration:none;
}

a:hover{
	color:#F69;
}

.clear{
	clear: both;
	line-height:0;
}

#wrapper{
	width:100%;
}

#header{
	width:100%;
	text-align:center;
	padding-top:30px;
}

#header h1{
	font-size:18px;
	font-family: 'Homemade Apple', cursive;
	margin-bottom:30px;
	font-weight:normal;
}

#header h1 a{
color:#666666;
}

#header h1 a:hover{
	color:#666666;
}

#header ul{
	margin:0 auto;
	text-align:center;
	margin-bottom:20px;
}

#header li{
display: -moz-inline-box;
  display: inline-block;
  /display: inline;
  /zoom: 1;
  cursor: pointer;

}

#header li a{
	display:block;
	text-align:center;
	padding:0 30px;
	cursor: pointer;
}

#header li.about{
     cursor: pointer;
     }

#about{
	margin-top:5px;
	text-align:left;
     padding: 30px 60px;
     border-top: 2px #ccc solid;
      border-bottom: 2px #ccc solid;
     display:none;
     }

.f_250{
	line-height:250%;
}

#content{
	margin-top:30px;
	margin-left:25px;
	margin-right:25px;
	text-align:center;
}

#content a{

}

.bwWrapper{
    position:relative;
    display:block;
}


#content img:hover{
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
-o-transform: scale(1.05);
-ms-transform: scale(1.05);
transform: scale(1.05);
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
transition: all 0.3s linear;
-webkit-filter: grayscale(0%);
filter: none;
}

#content img{
-webkit-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
-ms-transition: all 0.1s linear;
transition: all 0.1s linear;
-webkit-transition: all .5s ease;
-ms-transition: all .5s ease;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
}

.image-source-link {
	color: #98C3D1;
}

.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
	opacity: 0.001;
	-webkit-backface-visibility: hidden;
	/* ideally, transition speed should match zoom duration */
	-webkit-transition: all 0.3s ease-out; 
	-moz-transition: all 0.3s ease-out; 
	-o-transition: all 0.3s ease-out; 
	transition: all 0.3s ease-out;
}

.mfp-with-zoom.mfp-ready .mfp-container {
		opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
		opacity: 0.8;
}

.mfp-with-zoom.mfp-removing .mfp-container, 
.mfp-with-zoom.mfp-removing.mfp-bg {
	opacity: 0;
}


.centered { margin: 0 auto; }
#container{
/*	
    border:1px solid #dadada;
	*/
}
.box {
    margin: 5px;
    padding: 5px;
	float: left;
	    position:relative;
    display:block;
}

.col2 { width: 170px; /*height:180px; overflow:hidden;*/}
.col4 { width: 370px; /*height:380px; overflow:hidden;*/}
.col6 { width: 570px; /*height:580px; overflow:hidden;*/}
.col120 { width: 120px; /*height:180px; overflow:hidden;*/}



#single_thum{
	clear:both;
	width:auto;
	margin:60px auto 10px;
	padding:10px;
	border:#CCC 1px dotted;
}

#single_thum a{

}

#single_thum img:hover{
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
-o-transform: scale(1.05);
-ms-transform: scale(1.05);
transform: scale(1.05);
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
transition: all 0.3s linear;
-webkit-filter: grayscale(0%);
filter: none;
}

#single_thum img{
-webkit-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
-ms-transition: all 0.1s linear;
transition: all 0.1s linear;
-webkit-transition: all .5s ease;
-ms-transition: all .5s ease;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);

}

#single_thum .box {
    margin: 5px;
	/*
    float: left;
	*/
}

#single_thum .col120 { width: 100px; /*height:180px; overflow:hidden;*/}

/*
#page-nav{
	clear:both;
  text-align: center;
  z-index: 100;
  position: fixed;
  left: 45%;
  bottom: 40px;
  width: 200px;
  padding: 10px;
  background: #000; 
  opacity: 0.8;
  color: #FFF;
  -webkit-border-radius: 10px;
     -moz-border-radius: 10px;
          border-radius: 10px;
}
*/


#main{
	margin-top:30px;
	margin-left:50px;
	margin-right:50px;
	clear:both;
}

.entry{
	width:100%;
	margin:0 auto;
}

.entry_main img{
	width:100%;
	height:auto;
}

.entry h2{
	margin:15px 0;
}


#contactform{
	margin-top:150px;
	padding:40px;
    border-top: 2px #ccc solid;
    border-bottom: 2px #ccc solid;
	text-align:center;
	line-height:200%;
}

#contactform p{
	line-height:300%;
}





#footer{
	margin-top:30px;
	clear:both;
	margin-bottom:30px;
	text-align:center;
	
}


#toTop{
    background:#333;
    border-radius:10px;
    color:#fff;
    position:fixed;
    bottom:15px;
    right:15px;
    }
#toTop a{
    padding:12px 15px;
	display:block;
    }
#toTop a:hover{
	color:#FFF;
    }