@charset "utf-8";

/* setup
------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}

/* Base
------------------------------------------*/

html {
  -webkit-font-smoothing: antialiased;    
}

body{
  position:relative;
  letter-spacing:normal;
  vertical-align:baseline;
  -webkit-font-smoothing: antialiased;
}

blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

th{ font-weight:normal; }

p,li,dd {
  text-align:justify;
	text-justify:inter-ideograph;
}

ul li { list-style-type:none; }

ol li { 
  list-style-position:outside;
	margin-left:1.5em;
}

em{
  text-decoration:none;
	font-style:normal;
  font-weight:normal;
}

br { letter-spacing:0; }

img, a img { border:0; }

img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
  -ms-interpolation-mode: bicubic;
}

figure { margin: 1em 0; }

figure img { display: block; }

/* 汎用クラス
------------------------------------------*/

/*隠し要素*/
.hide{
  font-size:0%;
  line-height:0%;
  text-indent:-99999em;
  overflow:hidden;
  height:0px;
  padding:0;
  margin:0;
}

/*リンク半調*/
a.alpha:hover img{
  filter:alpha(opacity=50);
  opacity: 0.5;
  -ms-filter: "alpha(opacity=50)";
  -moz-opacity:0.5;
  -khtml-opacity: 0.5;
}

/*リンク透明*/
a.trans:hover img{
  filter:alpha(opacity=0);
  opacity: 0;
  -ms-filter: "alpha(opacity=0)";
  -moz-opacity:0;
  -khtml-opacity: 0;
}

/*クリアフィックス*/
.clear:after{
  content:"";
  display:block;
  clear:both;
}
*+html .clear { zoom:1; }

/* INGRID
   Here are the building blocks of Ingrid
--------------------------------------------------------*/

.ingrid {
  margin: 0 -1em; /* Can be set in em, % or px */
  padding: 0; /* Remove if you already reset paddings */
  clear: both;
  list-style: none; /* Works with ul & ol */
  letter-spacing: -0.31em;
  word-spacing: -0.43em;
}

.unit,
.field-unit {
  margin: 0; /* Remove if you already reset margins */
  display: inline-block;
  letter-spacing: normal;
  word-spacing: normal;
  vertical-align: top;
}

.field-unit  {
  display: block;
} 

/* GUTTERS 
   Gutter set directly on units (thanks border-box)
--------------------------------------------------------*/

.unit,
.field-unit {
  padding: 0 1em; /* Can be set in em, % or px (must match .ingrid negative margins) */
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/* OLDIE 
   Some IE7 patching (optional)
--------------------------------------------------------*/

.ingrid {
  *letter-spacing: normal;
  *zoom: 1;
}

.unit {
  *display: inline;
}

.unit,
.field-unit {
  *margin-right: -1px;
  *padding: 0;
  *zoom: 1;
}

/* UNITS 
   These divider classes are set on .ingrid container
--------------------------------------------------------*/

.in-halves    >   .unit   { width: 50%; } 
.in-thirds    >   .unit   { width: 33.33333%; } 
.in-fourths   >   .unit   { width: 25%; } 
.in-fifths    >   .unit   { width: 20%; } 
.in-sixths    >   .unit   { width: 16.66666%; }
.in-sevenths  >   .unit   { width: 14.28571%; }

/* SPATIALS
   The span-x classes are set on individual .units
--------------------------------------------------------*/

/* Spatial units in thirds */
.in-thirds    >   .span-two   { width: 66.66666%; }

/* Spatial units in fourths */
.in-fourths   >   .span-two   { width: 50%; }
.in-fourths   >   .span-three { width: 75%; }

/* Spatial units in fifths */
.in-fifths    >   .span-two   { width: 40%; }
.in-fifths    >   .span-three { width: 60%; }
.in-fifths    >   .span-four  { width: 80%; }

/* Spatial units in sixths */
.in-sixths    >   .span-two   { width: 33.33333%; }
.in-sixths    >   .span-three { width: 50%; }
.in-sixths    >   .span-four  { width: 66.66666%; }
.in-sixths    >   .span-five  { width: 83.33333%; }

/* Spatial units in sevenths */
.in-sevenths  >   .span-two   { width: 28.57142%; }
.in-sevenths  >   .span-three { width: 42.85714%; }
.in-sevenths  >   .span-four  { width: 57.14285%; }
.in-sevenths  >   .span-five  { width: 71.42857%; }
.in-sevenths  >   .span-six   { width: 85.71428%; }
