/*****************************************************************************************
 *
 * 1. common parts
 * 
 *****************************************************************************************/
/* elements ******************************************************************************/
* {
  font-size: 13px;
  font-weight: normal;
  list-style: none;
  margin: 0px;
  padding: 0px;
  text-decoration: none;
  line-height: 1.5em;
  font-family: "Tahoma","Verdana","Arial","sans-serif";
  color: #333333; }

a {
  text-decoration: none;
  color: #196BAD; }
  a * {
    color: #196BAD; }
  a:hover {
    text-decoration: underline; }

img {
  border: none; }

em {
  color: #ff0000;
  font-weight: bold; }

.plus {
  color: #0000ff;
  font-weight: bold; }

.minus {
  color: #ff0000;
  font-weight: bold; }

.gray {
  color: #ccc; }

.red {
  color: #f00; }

.hidden {
  display: none; }

.textleft {
  text-align: left; }

.textright {
  text-align: right; }

.textcenter {
  text-align: center; }

.not_select * {
  color: #ccc; }

.japan_time {
  font-weight: bold; }

.caution {
  font-weight: bold;
  color: #f00; }

.bold {
  font-weight: bold; }

table {
  border-collapse: collapse;
  border-left: 1px solid #999;
  border-top: 1px solid #999;
  margin-bottom: 20px; }

td, th {
  border-right: 1px solid #999;
  border-bottom: 1px solid #999;
  padding: 5px 10px;
  word-wrap: break-word;
  word-break: break-all; }

table p {
  margin: 0;
  padding: 0; }

th {
  background: #efefef;
  font-weight: bold;
  text-align: left; }

tr.border {
  border-top: 3px solid #999; }

td.right, th.right {
  text-align: right; }

td.center, th.center {
  text-align: center; }

.w10 {
  width: 10px !important; }

.w20 {
  width: 20px !important; }

.w30 {
  width: 30px !important; }

.w40 {
  width: 40px !important; }

.w50 {
  width: 50px !important; }

.w60 {
  width: 60px !important; }

.w70 {
  width: 70px !important; }

.w80 {
  width: 80px !important; }

.w90 {
  width: 90px !important; }

.w100 {
  width: 100px !important; }

.w110 {
  width: 110px !important; }

.w120 {
  width: 120px !important; }

.w130 {
  width: 130px !important; }

.w140 {
  width: 140px !important; }

.w150 {
  width: 150px !important; }

.w160 {
  width: 160px !important; }

.w170 {
  width: 170px !important; }

.w180 {
  width: 180px !important; }

@media (max-width: 480px) {
  /* iPhone */
  .honda .tab .tab4 {
    display: none; }

  .tab {
    border-bottom: 1px solid #656565; }
    .tab li {
      float: left;
      width: 50%; }
      .tab li a {
        padding: 5px 10px;
        display: block;
        border-top: 1px solid #656565;
        display: block; }
      .tab li:nth-child(2n+1) a {
        border-right: 1px solid #656565; }
    .tab:after {
      clear: both;
      content: " ";
      display: block; }

  .tablist li {
    display: none; }
    .tablist li.tab4 {
      display: block; }
    .tablist li.taball {
      display: block; }

  .tab li.select {
    background: #656565; }
    .tab li.select * {
      color: #fff; } }
@media (min-width: 481px) {
  /* PC */
  .honda .tab .tab4 {
    display: none; }

  .tab {
    border-bottom: 1px solid #999;
    margin-bottom: 10px;
    padding-left: 10px; }
    .tab li {
      float: left;
      margin-right: 5px;
      border-top: 1px solid #999;
      border-right: 1px solid #999;
      border-left: 1px solid #999; }
      .tab li a {
        padding: 5px 10px;
        display: block; }
    .tab:after {
      clear: both;
      content: " ";
      display: block; }

  .tablist li {
    display: none; }
    .tablist li.tab4 {
      display: block; }
    .tablist li.taball {
      display: block; }

  .tab li.select {
    background: #656565; }
    .tab li.select * {
      color: #fff; } }
/*****************************************************************************************
 *
 * 2. contents
 *
 *****************************************************************************************/
/** *****************************************************************************************/
/* over 1200px or not ***********************************************************************/
/** *****************************************************************************************/
@media (min-width: 1201px) {
  /* over 1200px */
  header section, nav section, footer section {
    width: 1200px;
    margin: 0 auto; }

  #content {
    width: 1200px; }

  article, aside {
    width: 100%; } }
/** *****************************************************************************************/
@media (max-width: 1200px) {
  /* under 1200px */
  header section, nav section, footer section {
    width: 100%;
    margin: 0 auto; }

  #image_wrap #image {
    width: 100%;
    margin: 0 auto; }
    #image_wrap #image img {
      width: 100%; } }
/** *****************************************************************************************/
/** End *************************************************************************************/
/** *****************************************************************************************/
/** *****************************************************************************************/
/* iPhone or not ****************************************************************************/
/** *****************************************************************************************/
@media (max-width: 480px) {
  /* iPhone */
  /* h1 */
  header h1 {
    letter-spacing: 0.1em;
    padding: 10px;
    display: block;
    background: #fff;
    box-sizing: border-box;
    position: fixed;
    top: 0;
    border-bottom: 5px solid #999;
    z-index: 999; }
    header h1 a.logo {
      margin: 0;
      padding: 0;
      width: 60%;
      display: inline-block; }
      header h1 a.logo img {
        width: 100%; }
    header h1 span {
      display: inline-block;
      margin: 0;
      padding: 0;
      width: 18%; }
      header h1 span img {
        width: 80%; }
  header #header_sns {
    padding: 0 10px; }
  header #eigyo_calendar {
    margin-top: 80px;
    padding: 0 10px; }
  header #header_info {
    padding: 5px 10px;
    background: none; }

  /* h2 */
  h2 {
    padding: 10px 0 10px 10px;
    font-size: 133%;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
    color: #fff;
    background: #8c8c8c;
    /* Old browsers */
    background: -moz-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8c8c8c), color-stop(50%, #707070), color-stop(51%, #676767), color-stop(100%, #787878));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8c8c8c', endColorstr='#787878',GradientType=0 );
    /* IE6-9 */ }
    h2 span {
      display: block;
      letter-spacing: 0em;
      font-size: 50%; }

  footer h2 {
    background: none; }

  /* h3 */
  h3 {
    padding: 5px 0 5px 5px;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
    border-bottom: 1px solid #656565; }

  .change_image_size {
    margin-left: 0; }
    .change_image_size p {
      display: block;
      margin-bottom: 10px;
      border-top: 1px solid #787878; }
      .change_image_size p a {
        display: block;
        width: 100%;
        padding: 10px 0;
        border-bottom: 1px solid #787878; }

  /* navi */
  nav li {
    width: 50%; }
    nav li:first-child {
      width: 100%; }
    nav li a {
      border-top: 1px solid #656565;
      display: block; }
    nav li:nth-child(2n) a {
      border-right: 1px solid #656565; }
    nav li a:hover {
      background: #656565;
      color: #fff;
      text-decoration: none; }

  article, aside {
    width: 100%; } }
/** *****************************************************************************************/
@media (min-width: 481px) {
  /* PC */
  /* h1 */
  header section {
    position: relative; }
  header h1 {
    padding-left: 10px;
    letter-spacing: 0.1em;
    float: left;
    line-height: 0;
    margin-top: 5px; }
    header h1 span {
      display: none; }
    header h1 img {
      width: 480px; }
  header #header_sns {
    clear: both;
    padding-left: 20px;
    position: relative;
    overflow: hidden; }
    header #header_sns .fb-like {
      width: 100px;
      top: -5px;
      display: inline-block; }
  header #eigyo_calendar {
    position: absolute;
    right: 0;
    top: 5px; }
  header #header_info {
    float: left;
    padding: 0 10px 10px; }

  /* h2 */
  h2 {
    padding: 10px 0 10px 10px;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
    color: #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: #8c8c8c;
    /* Old browsers */
    background: -moz-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8c8c8c), color-stop(50%, #707070), color-stop(51%, #676767), color-stop(100%, #787878));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8c8c8c', endColorstr='#787878',GradientType=0 );
    /* IE6-9 */ }
    h2 span {
      margin-left: 20px;
      letter-spacing: 0em;
      font-size: 50%; }

  aside span {
    margin-left: 0px;
    display: block; }

  /* h3 */
  h3 {
    padding: 5px 0 5px 5px;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
    border-bottom: 1px solid #656565; }

  h4 {
    margin-left: 10px;
    margin-bottom: 5px;
    font-weight: bold; }

  footer h2 {
    background: #656565; }

  /* navi */
  nav {
    margin-left: 5px; }
    nav li {
      margin-right: 5px; }
      nav li a {
        background: none;
        -moz-border-radius-topleft: 5px;
        -webkit-border-top-left-radius: 5px;
        -khtml-border-radius-topleft: 5px;
        border-top-left-radius: 5px;
        -moz-border-radius-topright: 5px;
        -webkit-border-top-right-radius: 5px;
        -khtml-border-radius-topright: 5px;
        border-top-right-radius: 5px; }
        nav li a:hover {
          text-decoration: none;
          background: #8c8c8c;
          color: #fff; }

  #content {
    margin: 0 auto; }
    #content:after {
      clear: both;
      content: " ";
      display: block; } }
/** *****************************************************************************************/
/** End *************************************************************************************/
/** *****************************************************************************************/
/* html / body ***************************************************************************/
html {
  height: 100%; }

body {
  background: #fff; }

/* header ********************************************************************************/
header {
  width: 100%;
  padding-top: 0px;
  border-top: 6px solid #656565; }
  header:after {
    clear: both;
    content: " ";
    display: block; }
  header h1 * {
    font-size: 150%; }

/* navi **********************************************************************************/
nav li {
  display: block;
  float: left; }
  nav li a {
    display: block;
    padding: 10px 10px; }
nav:after {
  display: block;
  content: " ";
  clear: both; }

/* image wrap ****************************************************************************/
#image_wrap {
  margin-top: 10px;
  position: relative;
  left: 50%;
  margin-left: -50%;
  width: 100%; }

/* pankuzu *******************************************************************************/
@media (min-width: 481px) {
  .pankuzu {
    margin: 5px 0;
    clear: both; }
    .pankuzu ul {
      padding: 0 10px; }
    .pankuzu li {
      float: left;
      margin-right: 10px; }
      .pankuzu li:not(:first-child):before {
        content: ">";
        margin-right: 10px; }
      .pankuzu li:first-child:before {
        content: ""; }
    .pankuzu ul:after {
      clear: both;
      content: " ";
      display: block; } }
@media (max-width: 480px) {
  .pankuzu {
    margin: 5px 0;
    clear: both; }
    .pankuzu ul {
      border-top: 1px solid #656565; }
    .pankuzu li {
      float: left;
      width: 100%;
      border-bottom: 1px solid #656565; }
      .pankuzu li:last-child {
        padding: 10px 0; }
        .pankuzu li:last-child:before {
          content: " - "; }
      .pankuzu li a {
        display: block;
        padding: 10px 10px; }
    .pankuzu ul:after {
      clear: both;
      content: " ";
      display: block; } }
/* article *******************************************************************************/
article section {
  margin-bottom: 20px; }
article p {
  padding-left: 10px; }
article .gototop {
  text-align: right;
  padding-right: 50px; }

/* aside *********************************************************************************/
aside section {
  margin-bottom: 20px; }
aside p {
  padding-left: 10px; }
aside ul li {
  list-style: inside disc;
  padding-left: 10px; }

/* footer ********************************************************************************/
footer {
  width: 100%;
  margin-top: 50px;
  padding: 20px 0 30px;
  background: #656565; }
  footer *, footer a {
    color: #fff; }
  footer li {
    margin-bottom: 10px;
    float: left;
    margin-right: 20px; }
  footer ul {
    padding-left: 10px; }
    footer ul:after {
      clear: both;
      content: " ";
      display: block; }
  footer p {
    margin-top: 30px;
    font-size: 12px;
    padding-left: 10px; }

/*****************************************************************************************
 *
 * 3. system parts
 *
 *****************************************************************************************/
/** list items *****************************************************************************/
ul.list span, ul.list a {
  margin-left: 10px; }
ul.list li {
  border-bottom: 1px dashed #8888ea;
  padding: 5px 0; }

table.list {
  border-left: 1px solid #8888ea;
  border-top: 1px solid #8888ea;
  border-collapse: collapse;
  width: 100%; }
  table.list .w5 {
    width: 5%; }
  table.list .w10 {
    width: 10%; }
  table.list .w15 {
    width: 15%; }
  table.list .w20 {
    width: 20%; }
  table.list .w23 {
    width: 23%; }
  table.list .w25 {
    width: 25%; }
  table.list .w30 {
    width: 30%; }
  table.list .w33 {
    width: 33%; }
  table.list .w44 {
    width: 44%; }
  table.list .w50 {
    width: 50%; }
  table.list .w67 {
    width: 67%; }
  table.list .w75 {
    width: 75%; }
  table.list td {
    border-right: 1px solid #8888ea;
    border-bottom: 1px solid #8888ea;
    padding: 3px 5px;
    text-align: left; }
  table.list th {
    border-right: 1px solid #8888ea;
    border-bottom: 1px solid #8888ea;
    padding: 3px 5px;
    text-align: left;
    background: #eeeeff; }

.tabmenu li {
  display: block;
  float: left;
  border-left: 1px solid #8888ea;
  border-top: 1px solid #8888ea; }
  .tabmenu li:last-child {
    border-right: 1px solid #8888ea; }
.tabmenu a {
  display: block;
  padding: 5px 10px 3px;
  text-decoration: none; }
  .tabmenu a:hover {
    background: #eeeeff; }
.tabmenu .select a {
  background: #eeeeff; }
.tabmenu:after {
  clear: both;
  content: " ";
  display: block; }

/** input form ***************************************************************************/
input[type=text], [type=textbox], input[type=password] {
  width: 95%;
  padding: 3px;
  margin: 5px 5px 5px 0;
  border: 1px solid #656565;
  background: #FFFFD8;
  border-radius: 5px;
  /* CSS3 */
  -webkit-border-radius: 5px;
  /* Safari,Google Chrome */
  -moz-border-radius: 5px;
  /* Firefox */ }
  @media (max-width: 480px) {
    input[type=text], [type=textbox], input[type=password] {
      font-size: 16px; } }

textarea {
  display: block;
  width: 95%;
  height: 4.5em;
  padding: 3px;
  margin: 5px 0;
  border: 1px solid #656565;
  background: #FFFFD8;
  border-radius: 5px;
  /* CSS3 */
  -webkit-border-radius: 5px;
  /* Safari,Google Chrome */
  -moz-border-radius: 5px;
  /* Firefox */ }
  @media (max-width: 480px) {
    textarea {
      font-size: 16px; } }

input[type=submit], input[type=button], input[type=reset] {
  margin-top: 10px;
  padding: 2px 10px;
  border-radius: 5px;
  /* CSS3 */
  -webkit-border-radius: 5px;
  /* Safari,Google Chrome */
  -moz-border-radius: 5px;
  /* Firefox */ }
  input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover {
    opacity: 0.5; }

select {
  border: 1px solid #656565;
  padding: 2px 5px 2px 5px;
  border-radius: 5px;
  /* CSS3 */
  -webkit-border-radius: 5px;
  /* Safari,Google Chrome */
  -moz-border-radius: 5px;
  /* Firefox */ }

label {
  margin-right: 10px; }
  label input {
    vertical-align: middle; }

input.short {
  width: 100px; }
input.medium {
  width: 50%; }
input.middle {
  width: 200px; }

.labellist label {
  float: left;
  display: block; }
.labellist:after {
  clear: both;
  content: " ";
  display: block; }

/** menu */
ul.submenu {
  margin-bottom: 10px; }
  ul.submenu:after {
    clear: both;
    content: "";
    display: block; }
  ul.submenu li {
    float: left;
    border-right: 1px solid #656565;
    padding: 0px 10px;
    font-weight: bold; }

/** facebook page widget */
footer div.fb_iframe_widget {
  width: 100% !important; }
  footer div.fb_iframe_widget iframe[style], footer div.fb_iframe_widget span {
    width: 100% !important; }

.footer_right {
  overflow: hidden;
  margin-bottom: 20px; }

/** *****************************************************************************************/
/** Split Div *******************************************************************************/
/** *****************************************************************************************/
@media (min-width: 481px) {
  /* PC */
  /** 2 divided DIV **/
  div.split2 h3, div.split3 h3, div.split4 h3 {
    margin-right: 5px;
    margin-bottom: 5px;
    padding: 3px 5px;
    color: #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: #acacac;
    /* Old browsers */
    background: -moz-linear-gradient(top, #acacac 0%, #909090 50%, #878787 51%, #989898 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #acacac), color-stop(50%, #909090), color-stop(51%, #878787), color-stop(100%, #989898));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #acacac 0%, #909090 50%, #878787 51%, #989898 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #acacac 0%, #909090 50%, #878787 51%, #989898 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #acacac 0%, #909090 50%, #878787 51%, #989898 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #acacac 0%, #909090 50%, #878787 51%, #989898 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#acacac', endColorstr='#989898',GradientType=0 );
    /* IE6-9 */ }
  div.split2 img, div.split3 img, div.split4 img {
    max-width: 100%; }
  div.split2 div, div.split3 div, div.split4 div {
    padding: 5px 0 5px 1%; }
  div.split2:after {
    clear: both;
    content: "";
    display: block; }
  div.split2 .left {
    float: left;
    width: 49%; }
  div.split2 .right {
    float: right;
    width: 49%; }
  div.split3:after {
    clear: both;
    content: "";
    display: block; }
  div.split3 .left {
    float: left;
    width: 33%;
    margin-left: 1%; }
  div.split3 .center, div.split3 .right {
    float: left;
    width: 33%; }
  div.split4:after {
    clear: both;
    content: "";
    display: block; }
  div.split4 .left, div.split4 .lcenter {
    float: left;
    width: 24%; }
  div.split4 .rcenter {
    float: left;
    width: 25%; }
  div.split4 .right {
    float: right;
    width: 25%; }

  /** 3 divided DIV **/
  /** 4 divided DIV **/
  .footer_wrap {
    width: 100%;
    max-width: 1200px; }
    .footer_wrap:after {
      clear: both;
      content: " ";
      display: block; }

  .footer_left {
    float: left;
    width: 30%; }

  .footer_right {
    float: right;
    width: 70%; } }
/** *****************************************************************************************/
.price_caution {
  background: #ffd9d9; }
  .price_caution div {
    max-width: 1200px;
    margin: 0 auto; }
  .price_caution h1 {
    font-size: x-large;
    font-weight: bold; }

/** *****************************************************************************************/
@media (max-width: 480px) {
  /* iPhone */
  div.split2 h3, div.split3 h3, div.split4 h3 {
    padding: 3px 5px;
    color: #fff;
    background: #8c8c8c;
    /* Old browsers */
    background: -moz-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8c8c8c), color-stop(50%, #707070), color-stop(51%, #676767), color-stop(100%, #787878));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #8c8c8c 0%, #707070 50%, #676767 51%, #787878 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8c8c8c', endColorstr='#787878',GradientType=0 );
    /* IE6-9 */ }
  div.split2 div, div.split3 div, div.split4 div {
    padding: 5px; }
  div.split2 img, div.split3 img, div.split4 img {
    max-width: 95%; } }
/** *****************************************************************************************/
/** End Split Div ***************************************************************************/
/** *****************************************************************************************/
