﻿@charset "utf-8";

div#content {
padding-bottom: 32px;
}

div#content img.freedial {
margin-top: 6px;
}

div#content h2 {
padding-bottom: 2px;
padding-top: 2px;
background-color: #FFF;
border-bottom: 1px #CCC solid;
border-left-color: #077CC0;
color: #077CC0;
font-size: 1em;
font-weight: bold;
}

/* ------------------------------------------------
  content :: example_title
------------------------------------------------ */
div#content div.example_title {
margin-top: 4px;
padding: 10px 0;
border: 1px #019999 solid;
border-top-width: 2px;
border-bottom: 0 none;
background-color: #D1EDED;
color: #019999;
font-size: 1.2em;
font-weight: bold;
text-align: center;
}

/* ------------------------------------------------
  content :: example
------------------------------------------------ */
div#content div.example {
margin-bottom: 16px;
padding-bottom: 12px;
padding-left: 15px;
padding-top: 8px;
border-top: 0 none;
}

div#content div.example p.catchcopy,
div#content div.example p.bikou {
margin-left: 10px;
width: 684px;
}

div#content div.example p.catchcopy {
font-size: 1.2em;
}

div#content div.example p.catchcopy span {
color: #C30;
}

div#content div.example p.bikou {
margin-bottom: 4px;
font-size: 0.8em;
text-align: right;
}

div#content div.example table{
margin-left: 10px;
border-collapse: collapse;
width: 684px;
}

div#content div.example caption {
text-align: left;
}

div#content div.example th,
div#content div.example td {
padding: 2px 0;
border-bottom: 1px #CCC solid;
border-top: 1px #CCC solid;
font-size: 0.9em;
}

div#content div.example th {
color: #077CC0;
width: 150px;
}

div#content div.example td.price {
font-weight: bold;
text-align: right;
}

div#content div.example td.price strong {
color: #C00;
}

div#content div.example th.arrow,
div#content div.example td.arrow {
border: 0 none;
width: 38px;
}

div#content div.example td.arrow {
padding-right: 0;
background-image: url(image/ar_per01.gif);
background-position: 8px center;
background-repeat: no-repeat;
}

div#content div.example th.difference,
div#content div.example td.difference {
padding-left: 48px;
width: 297px;
}

div#content div.example div.shipping_top,
div#content div.example div.shipping_bottom {
background-position:left top;
background-repeat: no-repeat;
height: 14px;
overflow: hidden;
text-indent: -9998px;
}

div#content div.example div.shipping_top {
background-image: url(image/bg_per01.gif);
}

div#content div.example div.shipping_bottom {
background-image: url(image/bg_per03.gif);
}

div#content div.example div.shipping {
padding: 0 11px;
background-image: url(image/bg_per02.gif);
background-position: left top;
background-repeat: repeat-y;
width: 683px;
}

div#content div.example div.shipping div {
margin-bottom: 8px;
margin-left: 4px;
padding: 6px 0 6px 10px;
background-color: #F2FBFB;
border: 1px #D1EDED solid;
color: #077CC0;
font-weight: bold;
width: 663px;
}

div#content div.example div.shipping ol,
div#content div.example div.shipping li {
margin: 0;
padding: 0;
}

div#content div.example div.shipping ol {
margin-left: 16px;
list-style-type: none;
}

div#content div.example div.shipping li {
padding: 8px 0 8px 32px;
background-position: left center;
background-repeat: no-repeat;
font-size: 0.8em;
width: 619px;
}

div#content div.example div.shipping li.li1,
div#content div.example div.shipping li.li2,
div#content div.example div.shipping li.li3,
div#content div.example div.shipping li.li4 {
border-bottom: 1px #CCCCCC dashed;
font-size: 0.9em;
}

div#content div.example div.shipping li.li1 {
background-image: url(image/bg_per04.gif);
}

div#content div.example div.shipping li.li2 {
background-image: url(image/bg_per05.gif);
}

div#content div.example div.shipping li.li3 {
background-image: url(image/bg_per06.gif);
}

div#content div.example div.shipping li.li4 {
background-image: url(image/bg_per07.gif);
}

div#content div.example div.shipping li strong {
color: #077CC0;
}

/* ------------------------------------------------
  content :: graph
------------------------------------------------ */

#content div.graph{
margin-bottom: 20px;
}


/* ------------------------------------------------
  content :: item
------------------------------------------------ */
div#content div.item {
padding-bottom: 12px;
padding-top: 12px;
border-bottom: 1px #CCC solid;
}

div#content div.item div.text {
float: right;
width: 542px;
}

div#content div.item div.text h3 {
font-size: 1.3em;
font-weight: bold;
}

div#content div.item div.text p {
margin-left: 8px;
padding-left: 16px;
background-image: url(image/ar_per02.gif);
background-position: left center;
background-repeat: no-repeat;
float: left;
}

div#content div.item div.text p.price {
margin-left: 0;
margin-top: 3px;
padding: 22px 0 22px 32px;
background-image: none;
border: 1px #CCC solid;
font-size: 0.8em;
width: 102px;
}

div#content div.item div.text p.price span {
font-size: 1.1em;
font-weight: bold;
}

div#content div.item div.text p.price span.price {
font-size: 1.7em;
}

div#content div.item div.photo {
float: left;
text-align: center;
width: 194px;
}

div#content div.item div.button {
float: right;
width: 368px;
height: 37px;
}

div#content div.item div.button a {
background-image: url(image/btn_order_periodical.gif);
background-position: left top;
background-repeat:no-repeat;
display: block;
width: 332px;
height: 37px;
text-indent: -9998px;
}

div#content div.item div.button a:hover {
background-image: url(image/btn_order_periodical_on.gif);
}


/* ------------------------------------------------
  content :: note
------------------------------------------------ */
div#content div.note {
padding: 28px 106px 0 106px;
}

div#content div.note p {
/*padding-left: 1em;*/
}

div#content div.note p.first_child {
margin-bottom: 4px;
padding-bottom: 4px;
padding-top: 4px;
border-bottom: 1px #CCC solid;
font-size: 0.88em;
}

div#content div.note p img.logo {
padding-bottom: 11px;
padding-right: 8px;
}

