@charset "Shift_JIS";

/* �v�f���Z�b�g */
body {
  margin: 0;
  padding: 0;
  text-align: center;
  font-size: 75%;
  font-family: "���C���I", Meiryo, "�q���M�m�p�S Pro W3", "Hiragino Kaku Gothic Pro", "�l�r �o�S�V�b�N", "Osaka",
    sans-serif;
  color: #000000; /* �W�������F */
  min-width: 980px;
}
/* Safari�p�n�b�N �����T�C�Y���� */
/*\*/
html:first-child body {
  font-size: 70%;
}
/* end */

img {
  border-top: 0;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
}

/*--------------------------------------------------------
  ���C�A�E�g�ݒ�
--------------------------------------------------------*/

#hpb-inner {
  width: 980px;
  margin-left: auto;
  margin-right: auto;
  clear: both;
  position: relative;
}

#hpb-main {
  width: 100%;
  text-align: left;
  padding-right: 10px;
  padding-bottom: 20px;
  margin-top: 100px;
}

#hpb-main h1 {
  font-size: 22px;
  color: #000;
  font-weight: bold;
  position: relative;
  left: 0;
}

.hpb-layoutset-01 #hpb-main {
  padding-top: 310px;
}
.hpb-layoutset-02 #hpb-main {
  padding-top: 10px;
}

#hpb-aside {
  width: 268px;
  float: right;
  text-align: left;
  padding-top: 470px;
  padding-bottom: 20px;
}

.hpb-layoutset-02 #hpb-aside {
  padding-top: 185px;
}

#hpb-footer {
  clear: both;
}

#hpb-nav {
  width: 980px;
  height: 28px;
  overflow: hidden;
  position: absolute;
  left: 0px;
  top: -80px;
}

/*--------------------------------------------------------
  �f�U�C���ݒ�
--------------------------------------------------------*/
/* �^�C�g�� */

.hpb-layoutset-01 #hpb-title {
  width: 980px;
  height: 341px;
  text-indent: -9999px;
  overflow: hidden;
  background-image: url(top_mainimg_1C1_01.png);
  background-position: top left;
  background-repeat: no-repeat;
  position: absolute;
  top: -40px;
  left: 0;
}

.hpb-layoutset-02 #hpb-title {
  width: 980px;
  height: 98px;
  background-image: url(titleBg_1C1.png);
  background-position: top left;
  background-repeat: no-repeat;
  position: absolute;
  top: 72px;
  left: 0;
}

/* �w�i�ݒ� */
.hpb-layoutset-01 {
  background-image: url(bg_1C1_01.png);
  background-position: top left;
  background-repeat: repeat-x;
}

/* �i�r�Q�[�V���� */

#hpb-nav ul {
  margin-top: 0px;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
  padding-top: 0;
  padding-right: 0;
  padding-left: 10px;
  padding-bottom: 0;
  list-style-type: none;
  text-align: left;
}

#hpb-nav ul::after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

#hpb-nav li {
  display: inline-block;
  font-size: 11px;
  margin-right: 32px;
}

#hpb-nav li a {
  display: block;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 4px;
  border-bottom-width: 3px;
  border-bottom-style: solid;
  border-bottom-color: #585858;
}
#hpb-nav li a:hover {
  border-bottom-color: #288bd7;
}

/* =======================================================
  ���X�|���V�u���ݒ�
======================================================= */
@media screen and (max-width: 480px) {
  body {
    min-width: 100%;
  }

  /*--------------------------------------------------------
	  ���C�A�E�g�ݒ�
	--------------------------------------------------------*/
  #hpb-inner {
    width: 100%;
  }
  #hpb-main {
    width: 96%;
    float: none;
    padding-right: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
  }
  .hpb-layoutset-01 #hpb-main {
    padding-top: 0;
  }
  .hpb-layoutset-02 #hpb-main {
    padding-top: 2em;
  }
  #hpb-aside {
    width: 96%;
    float: none;
    text-align: left;
    padding-top: 0;
    margin-left: auto;
    margin-right: auto;
  }
  .hpb-layoutset-02 #hpb-aside {
    padding-top: 0;
  }
  #hpb-nav {
    width: 100%;
    height: auto;
    border-top-width: 1px;
    border-top-color: #c8c8c8;
    border-top-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: #c8c8c8;
    border-bottom-style: solid;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
  }

  /*--------------------------------------------------------
	  �f�U�C���ݒ�
	--------------------------------------------------------*/
  /* �^�C�g�� */
  .hpb-layoutset-01 #hpb-title {
    width: 100%;
    height: 150px;
    overflow: hidden;
    background-size: contain;
    position: relative;
    top: 0;
    left: 0;
  }
  .hpb-layoutset-02 #hpb-title {
    width: 100%;
    background-size: cover;
    position: relative;
    top: 0;
    left: 0;
  }

  /* �w�i�ݒ� */
  .hpb-layoutset-01 {
    background-image: none;
  }
  .hpb-layoutset-02 {
    background-image: none;
  }

  /* �i�r�Q�[�V���� */
  #hpb-nav ul {
    display: none;
    padding-left: 0;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #585858;
  }
  #hpb-nav ul.toggled-on {
    display: block;
    padding-left: 0;
  }
  #hpb-nav li {
    display: block;
    font-size: 11px;
    margin-right: 0;
  }
  #hpb-nav li a {
    display: block;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom-width: 1px;
  }
  #hpb-nav li a:hover {
    border-bottom-color: #585858;
  }
}