@charset "utf-8";
/* CSS Document */


/* 共通内容 */

body {
	/*background-image:url(images/bg.png);
	background-repeat:repeat;
	background-position:top left;*/
	background-color:#f7f7f7;
	font-family: 'Roboto', 'YuGothic', 'Yu Gothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
	color:#666666;
	font-size:13px;
	}

a {
	color:#666666;
	text-decoration:none;
	}

.img-block {
  width: 278px;
  height: 223px;
  overflow: hidden;
}
.img-block img {
  -webkit-transition:0.5s ease;
  	-moz-transition:0.5s ease;
  	transition:0.5s ease;
}
.img-block img:hover {
  -moz-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
}

#loader {
    width: 36px;
    height: 36px;
    display: none;
    position: fixed;
    _position: absolute; /* IE6対策 */
    top: 50%;
    left: 50%;
    z-index: 100;
}
 
#fade {
    width: 100%;
    height: 100%;
    display: none;
    background-color: #FFFFFF;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 50;
}

.pagetop {
 display: none;
 position: fixed;
 bottom: 20px;
 right: 20px;
 z-index:1000;
 font-size: 34px;
}
.pagetop a {
 display: block;
 color: #8195a0;
 text-decoration: none;
 -webkit-transition:0.4s ease;
  -moz-transition:0.4s ease;
  transition:0.4s ease;
}

.pagetop a:hover {
 opacity:0.7;
}



.faSize {
	font-weight:normal;
	font-size:150% !important;
	line-height:1.0 !important;
	margin-right:11px;
	/*vertical-align:middle;*/
	}

ul.sns {
	margin-top:15px;
	}

ul.sns li {
	display:inline-block;
	color:#8195a0;
	}

ul.sns li a {
	color:#8195a0;
	}


h1.mainTitle {
	text-align:center;
	font-family: 'Open Sans Condensed', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
	font-size:40px;
	font-weight:300;
	color:#666666;
	border-bottom:1px solid #EAEAEA;
	padding:10px 0px;
	letter-spacing:1px;
	}

h1.mainTitle a {
	-webkit-transition:0.5s ease;
  	-moz-transition:0.5s ease;
  	transition:0.5s ease;
	}

h1.mainTitle a:hover {
	opacity:0.5;
	}

#navigation {
	width:100%;
	text-align:center;
	margin-top:30px;
	z-index:1000;
	}

.fixed{
	position:fixed;
	padding:10px 0px;
	background-color: rgba(129,149,160,0.65);
	color:#FFF;
	margin-top:0px !important;
	transition: 0.5s;
}

.fixed a{
	color:#FFF !important;
	padding:0px;
}

.fixed ul.navi li a:hover{
	background-color: rgba(0,0,255,0);
	text-decoration:underline;
}


ul.navi {
	margin-left:18px;

	}

ul.navi li {
	display:inline-block;
	font-family: 'Open Sans Condensed', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
	font-size:16px;
	margin-right:18px;
	letter-spacing:1px;
	}

ul.navi li a {
	-webkit-transition:0.3s ease;
  	-moz-transition:0.3s ease;
  	transition:0.3s ease;
	padding:2px 12px;
	}

ul.navi li a:hover {
	background-color:#8195a0;
	color:#FFF;
	
	}

div.mainContents{
	margin: auto;
	width:100%;
	padding:30px 0px 0px;	
}

div.mainContents2{
	margin: auto;
	width:100%;
	padding:30px 0px 0px;	
}

div.grid{
	background-color: #FFF;
	float: left;
	max-width: 278px;
	width:100%;
	margin: 5px;
	padding: 10px;
	border:1px solid #efefef;
}

div.grid hover{
	background-color: #CCCCCC;
	
}

div.grid img{
	max-width:278px;
	width:100%;
}


h2.hpTitle {
	font-size:14px;
	margin:15px auto 10px;
	border-top:1px solid #eeeeee;
	padding-top:10px;
	}

p.siteUrl {
	font-size:90%;
	margin-top:5px;
	font-family: 'Exo 2', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
	color:#E44261;

}

div.siteLink {
	cursor:pointer;
	background-color:#FFF;
	}

/*プロフィール*/

div.profileUnit {
	max-width:500px;
	border-top:1px solid #EAEAEA;
	border-bottom:1px solid #EAEAEA;
	margin:0px auto;
	padding:15px 10px;
	}

h2.contentsTitle {
	font-family: 'Open Sans Condensed', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
	font-size:180%;
	font-weight:normal;
	letter-spacing:1px;
	}

h3.profileName {
	font-family: 'Open Sans Condensed', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
	font-size:150%;
	font-weight:normal;
	margin-top:20px;
	}

p.prfTxt {
	margin-top:10px;
	line-height:1.7em;
	}

p.prfTxt a {
	color:#E44261;
	text-decoration:underline;
	}

#footer {
	clear:both;
	}

div.footerArea {
	text-align:center;
	padding:20px 0px;
	font-size:95%;
	}

@media only screen and (max-width: 480px) {
	div.grid{
	margin: 0px;
	margin-bottom:10px;
	
}

}