@charset "shift_jis";


body  {
  letter-spacing:  1px;
  margin:  0;
  font-family:	'CI', Meiryo, sans-serif;
}

img  {
  margin:  0;
  padding:  0;
  vertical-align: bottom;
}

.clear {
  clear: both;
}

a  {
  text-decoration:  none;
}

a:hover img , a:hover .button  {
  filter:  alpha(opacity=60);        /* ie lt 8 */
  -ms-filter:  "alpha(opacity=60)";  /* ie 8 */
  -moz-opacity:  0.6;                 /* FF lt 1.5, Netscape */
  -khtml-opacity:  0.6;              /* Safari 1.x */
  opacity:  0.6;
  zoom:  1;
  cursor:  pointer;
}

#lead-background  {
  background:  #EAF7D2;
}



@media only screen and (min-width: 641px) {

#header  {
  background:  #333;
  width:  100%;
  padding: 6px 0;
}

#header h1  {
  width:  900px;
  margin:  0 auto;
  color:  #fff;
}

h1  {
  font-size:  14px;
  font-weight:  normal;
  margin: 0;
}

#main-background  {
  background:  #F5F0DF;
  padding: 22px 0;
}

#main  {
  width:  900px;
  margin:  0 auto;
}

#main-left  {
  width:  352px;
  float:  left;
}

h2 , h3  {
  font-size:  20px;
  font-weight:  bold;
  line-height:  140%;
  margin:  15px 0 0 5px;
}

h3  {
  margin-bottom:  30px;
}

#main-right  {
  width:  548px;
  float:  right;
  position:  relative;
}

#attention-item  {
  border:  4px solid #E25654;
}

#item-attention  {
  position: absolute;
  top:  195px;
  left:  458px;
  z-index:  1;
}

#sub-background  {
  background:  #FCF4CC;
  padding: 22px 0 5px;
}

#sub  {
  width:  900px;
  margin:  0 auto;
}

.sub-block  {
  float:  left;
  margin:  0 0 22px;
}

.sub-block img  {
  border:  3px solid #E25654;
  background:  #fff;
  margin: 0 0 10px;
}

.sub-margin  {
  margin:  0 20px 0 0;
}

#lead  {
  width:  900px;
  margin: 0px auto;
  text-align:  center;
  padding:  22px 0px;
  font-size:  20px;
  font-weight:  bold;
  line-height:  140%;
}

#lead p  {
  margin:  0;
}

#lead .button {
  margin: 0px auto;
}

#footer-background  {
  background:  #333;
  width:  100%;
  padding: 6px 0;
}

#footer  {
  width:  900px;
  margin:  0px auto;
  color:  #fff;
  font-size:  12px;
  text-align:  right;
}

#footer a  {
  text-decoration:  underline;
}

#footer a:hover  {
  text-decoration:  none;
  cursor:  pointer;
}

.button {
  background:  #E25654;
  border-radius: 40px;
  color:  #fff;
  width:  285px;
  padding:  10px 0 7px;
  text-align:  center;
  font-size:  15px;
  font-weight:  bold;
  line-height:  120%;
}

}




@media only screen and (max-width: 640px) {

span  {
  display: block;
}

#header  {
  background:  #333;
  font-weight:  normal;
  color:  #fff;
  padding:  6px 0;
}

#header h1  {
  font-size:  14px;
  text-align:  center;
  margin:  0 auto;
}

#main-background  {
  background:  #F5F0DF;
  padding: 10px 0 5px;
}

h2 , h3  {
  font-size:  17px;
  font-weight:  bold;
  line-height:  120%;
  text-align:  center;
}

.button {
  background:  #E25654;
  border-radius: 40px;
  color:  #fff;
  width:  285px;
  padding:  10px 0 7px;
  text-align:  center;
  font-size:  14px;
  font-weight:  bold;
  line-height:  120%;
  margin:  0 auto;
}

#item-attention  {
  display:  none;
}

#main-right #attention-item img  {
  width:  100%;
  margin:  25px 0 20px;
}

#sub-background  {
  background:  #FCF4CC;
  padding:  0 0 25px;
}

.sub-block  {
  width:  280px;
  margin:  0 auto;
}

.sub-block img  {
  margin:  25px 0 10px;
}

#lead  {
  padding:  20px 0;
}

.center  {
  margin:  0px auto;
}

#lead-center  {
  width:  250px;
  margin:  0 auto;
}

#lead p  {
  font-size:  14px;
  font-weight:  bold;
  margin:  0 auto;
  text-align:  center;
}

#footer-background  {
  background:  #333;
  width:  100%;
  padding: 6px 0;
}

#footer  {
  margin:  0px auto;
  color:  #fff;
  font-size:  10px;
  text-align:  center;
}

#footer a  {
  text-decoration:  underline;
}

}