@charset "UTF-8";


/*========================================


	common.css
	Recent Edit | 2012
	

========================================*/

/* ●基本-------------------- */

body {
	font-size: 12px;
	line-height: 1.8;
	background-color:#eee;
	background-image:url(../imgs/bg03.jpg);
	background-position: top center;
	margin-bottom:0;
	margin-left:0;
	margin-right:0;
	margin-top:0;
	color:#323227;
}	

a:link {
	text-decoration: none;
	color: #CD2828;
}
a:visited {
	text-decoration: none;
	color: #CD2828;
}
a:hover {
	text-decoration: underline;
	color: #aaa;
}
a:active {
	text-decoration: none;
}
input {outline:0;}

/* ●スクリプト-------------------- */
#windowFade {
position:absolute; /* ie6 */
position:fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #fff;
z-index:1000;
}

/* ●mason-------------------- */

#container { margin:0 auto;}

.box224,
.box464,
.box704 {
  width: 224px;
  float: left;
  margin:10px 0px;
  padding:50px 8px 8px;
  background: url(../imgs/wire8.gif) no-repeat top center;
  background-size: 20px 52px;
}

.box464 {width: 464px;}
.box704 {width: 704px;}

.boxin {
  background:#fff;
  padding:8px;
  text-align:center;
  -webkit-box-shadow: 0 1px 6px -2px #555;
     -moz-box-shadow: 0 1px 6px -2px #555;
          box-shadow: 0 1px 6px -2px #555;
  -webkit-border-radius: 1px;/* Safari,Google Chrome用 */
     -moz-border-radius: 1px;/* Firefox用 */
	      border-radius: 1px;/* CSS3草案 */
		  }
/*.boxin img {border:1px solid #ddd;}*/
.box224.boxin {width: 224px;}
.box464.boxin {width: 464px;}
.box704.boxin {width: 704px;}

.boxintxt {
  background:#fff;
  padding:15px;
  text-align:left;
  font-size:85%;
  -webkit-box-shadow: 0 1px 6px -2px #555;
     -moz-box-shadow: 0 1px 6px -2px #555;
          box-shadow: 0 1px 6px -2px #555;
  -webkit-border-radius: 1px;/* Safari,Google Chrome用 */
     -moz-border-radius: 1px;/* Firefox用 */
	      border-radius: 1px;/* CSS3草案 */
		  }

.img2nd {padding-top:8px;}

/*枠背景*/
.bgred { background-color: #DF3C21;}
.bgpink { background-color: #F4D6D8;}
.bgyellow { background-color: #EDE500;}
.bglgy { background-color: #E6E6C9;}
.bglgy2 { background-color: #f5f5f5;}
.bgdgy { background-color: #766C5C;}
.bglbu { background-color: #7FB4C0;}
.bggrn { background-color: #90B570;}
.bglgrn { background-color: #C2E1BD;}

.bgnone { background:none;
  -webkit-box-shadow:none;
     -moz-box-shadow:none;
          box-shadow:none;
		  padding:8px;}

table.expl {
width:95%;
line-height:1.7;
font-size:10px;
border-collapse: collapse;
margin:12px;
}
	table.expl th {
	padding-right:5px;
	width:40px;
	vertical-align:top;
    }
    table.expl td {
	padding-left:0px;
    }

.icon {
	width:40px;
	height:40px;
	display: block;
	background-size:40px 40px;
	background-repeat:no-repeat;}
	
.pic {background-image:url(../imgs/icon_pic.gif);}
.web {background-image:url(../imgs/icon_web.gif);}
.logo {background-image:url(../imgs/icon_logo.gif);}
.cara {background-image:url(../imgs/icon_cara.gif);}
.kkk {background-image:url(../imgs/icon_pb.gif);}
.pos {background-image:url(../imgs/icon_pos.gif);}
.pro {background-image:url(../imgs/icon_pro.gif);}
.info {background-image:url(../imgs/icon_info.gif);}
.blog {background-image:url(../imgs/icon_blog.gif);}
.prof {background-image:url(../imgs/icon_prof.gif);}

.totop{ cursor:pointer;}

/* ●headnavi-------------------- */
#headnavi {width:100%; background-image:url(../imgs/bg01.jpg); height:32px; position: relative; border-bottom:1px solid #443;}
#headnavi ul { margin:0; padding:0; position:absolute; top:7px; right:8%;}
#headnavi ul li { list-style:none; float:right; margin-left:10px; font-size:10px; color:#eee; letter-spacing:.1em; font-family: futura,Times New Roman; text-shadow: 0px -1px 0px #222;}
#headnavi ul li a {color:#eee;}
#headnavi ul li a:hover {color:#ddd;}
/* ●head-------------------- */
#head {width:100%; background-image:url(../imgs/bg02.jpg); position: relative; border-bottom:1px solid #ddd; border-top:1px solid #f2f2f2; height:100px; margin-bottom:25px;
  -webkit-box-shadow: 0 4px 5px -2px #e5e5e5;
     -moz-box-shadow: 0 4px 5px -2px #e5e5e5;
          box-shadow: 0 4px 5px -2px #e5e5e5;}
#head #logo { position:absolute; top:26px; left:8%;}
.head_exp {font-size:11px; position:absolute; top:12px; right:8%;}
.head_caution {font-size:10px; position:absolute; top:26px; right:8%; font-size:10px}

/* ●時計-------------------- */
.update {font-family: futura,Times New Roman; text-align:center; font-size:10px; line-height:1; padding:5px; border:1px solid #eee; color:#a73; background-image:url(../imgs/bg02.jpg); margin:8px 0 0;}
#clock {
        	position: relative;
        	width: 208px;
        	height: 208px;
			display:block;
        	background: url(../imgs/clockface.gif) no-repeat;
        	background-size: 208px 208px;
        	list-style: none;
			margin:0;
        	}
        #sec, #min, #hour {
        	position: absolute;
        	width: 30px;
        	height: 208px;
        	top: 0px;
        	left: 89px;
        	}
        #sec {
        	background: url(../imgs/sechand.png);
        	background-size: 30px 208px;
        	z-index: 3;
           	}
        #min {
        	background: url(../imgs/minhand.png);
        	background-size: 30px 208px;
        	z-index: 2;
           	}
        #hour {
        	background: url(../imgs/hourhand.png);
        	background-size: 30px 208px;
        	z-index: 1;
           	}

/* ●foot-------------------- */
#foot {width:100%; background-image:url(../imgs/bg02.jpg); border-bottom:1px solid #bbb; border-top:1px solid #ccc; height:100px;}
#foot #cr { text-align:center; font-size:10px;}

/* ●ipadたて-------------------- */
@media screen and (orientation:portrait) {
/* 記入 */
}

/* ●ipadよこ-------------------- */
@media screen and (orientation:landscape) {
}


/* ●retinaなら-------------------- */
@media only screen and (-webkit-min-device-pixel-ratio: 2),(-webkit-min-device-pixel-ratio: 1.5) {
.box224,
.box464,
.box704 {
  background: url(../imgs/wire.gif) no-repeat top center;
}
}

/* Infinite Scroll loader */
#infscr-loading {
  text-align: center;
  z-index: 100;
  position: fixed;
  right: 5%;
  bottom: 40px;
  width: 200px;
  padding: 10px;
  background: #fff;
  opacity: 0.8;
  color: #333;
  -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
          border-radius: 5px;
}