@charset "utf-8";

/* Index -----------------------------

    -  Font Size Conversion

    1. 960 following
    2. smaller than 980
    3. smaller than 960
    4. smaller than 870
    5. smaller than 768
    6. smaller than 640
    7. smaller than 600
    8. smaller than 512
    9. smaller than 480
   10. smaller than 360

   (C) IWAMI Printing inc. ----------- */

/* Font Size Conversion --------------

	PX    %         PX    %
	 8 -  50	 9 -  56
	10 -  63	11 -  69
	12 -  75	13 -  81
	14 -  88	15 -  94
	16 - 100 (Base Font Size)
	18 - 113	20 - 125
	22 - 138	24 - 150

   ----------------------------------- */



/* -----------------------------------
    1. 960 following
   ----------------------------------- */



/* ----------------------------------- */



@media screen and (max-width: 980px) {
/* -----------------------------------
    2. smaller than 980
   ----------------------------------- */
/* home ----- */
#home #main #maps ul li .info .photo,
#home #main #maps ul li .info .txt {
  float: none;
}

#home #main #maps ul li .info .photo {
  text-align: center;
  margin-bottom: .5em;
  width: 100%;
}

#home #main #maps ul li .info .txt .rp {
  display: none;
}


/* ----------------------------------- */
}


@media screen and (max-width: 960px) {
/* -----------------------------------
    3. smaller than 960
   ----------------------------------- */
header nav ul li {
  margin-left: 20px;
}

/* facility ----- */
#facility #main .box01 dl dd ul li {
  width: 17em;
}


/* ----------------------------------- */
}


@media screen and (max-width: 870px) {
/* -----------------------------------
    4. smaller than 870
   ----------------------------------- */
#rpmparts,
#rpmparts a,
#rpmparts a span {
  display: block;
}

/* nav ----- */
header nav {
  background-color: #fff;
  border-left: 1px solid #999;
  height: 100%;
  margin: 0;
  padding: 0 60px 0 20px;
  position: fixed;
  right: -230px;
  top: 0;
  width: 150px;
  z-index: 1;
}


header nav ul {
  margin-top: 75px;
}

header nav ul li {
  float: none;
  margin: 0 0 20px 0;
}

header nav ul li a {
  border-bottom: 3px solid transparent;
  color: #333;
  display: block;
  text-decoration: none;
  padding-bottom: 10px;
}

header nav ul li div {
  display: none;
}

/* facility ----- */
#facility #main .box01 dl dd ul li {
  margin-left: 1.5em;
}

/* footer ----- */
footer {
  border-top: 5px solid #ddd;
}

footer #nav {
  display: none;
}

/* contact ----- */
#contact #main .box01 dl dd {
  padding-left: 8em;
}

#contact #main .box01 dl dd ul {
  padding-left: 1em;
}

#contact #main #renrakusaki dl dd {
  padding-left: 0;
}

#contact #main #renrakusaki dl dd ul {
  padding-left: 0;
}

#contact #main .box01 dl .name ul li:first-child,
#contact #main .box01 dl .kana ul li:first-child {
  margin-right: 2em;
}

#contact #main .box01 dl .name ul li input,
#contact #main .box01 dl .kana ul li input {
  width: 6em;
}


/* ----------------------------------- */
}


@media screen and (max-width: 768px) {
/* -----------------------------------
    5. smaller than 768
   ----------------------------------- */
/* home ----- */
#home #main #maps ul li .info .txt .rp {
  display: block;
}

/* company ----- */
#company #main .box01 dl dd table tr {
  display: block;
}

#company #main .box01 dl dd table tr th {
  display: list-item;
  list-style: none;
  margin-top: 10px;
}

#company #main .box01 dl dd table tr td {
  padding-left: 1em;
}

#company #main .box01 dl dd table tr .num {
  width: 4.5em;
}

#company #main .box01 dl .ulstyle02 ul li {
  width: 100%;
}

/* facility ----- */
#facility #main .box01 dl dd ul li {
  margin-left: 5em;
  width: 100%;
}


/* ----------------------------------- */
}


@media screen and (max-width: 640px) {
/* -----------------------------------
    6. smaller than 640
   ----------------------------------- */
/* contact ----- */
#contact #main .box01 dl .name ul li,
#contact #main .box01 dl .kana ul li {
  float: none;
}

#contact #main .box01 dl .name ul li input,
#contact #main .box01 dl .kana ul li input {
  width: 12em;
}


/* ----------------------------------- */
}


@media screen and (max-width: 600px) {
/* -----------------------------------
    7. smaller than 600
   ----------------------------------- */
#main .box01,
#main .box02 {
  overflow: hidden;
  padding: 40px 0 0;
  zoom: 1;
}

/* home ----- */
#home #topics {
  display: block;
  margin: 0;
  overflow: hidden;
  zoom: 1;
}

#home #topics .hdl {
  padding: 0;
}

#home #topics .list {
  border-left: none;
  padding: 0;
}

/* company ----- */
#company #main .box01 dl dt {
  border: 1px solid #555;
  float: none;
  margin-bottom: 10px;
  padding: 5px;
}

#company #main .box01 dl dd {
  padding: 0 5px;
}

/* facility ----- */
#facility #main .box01 dl dt {
  border: 1px solid #555;
  float: none;
  margin-bottom: 10px;
  padding: 5px;
}

#facility #main .box01 dl dd {
  border-bottom: none;
  margin: 0 0 20px 0;
  padding: 0 5px;
}

#facility #main .box01 dl dd ul {
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
  zoom: 1;
}

#facility #main .box01 dl dd ul li {
  margin-left: 0;
  width: 100%;
}

#facility #main .box01 .block01 ul {
  display: block;
}

#facility #main .box01 .block01 ul li {
  margin-top: 30px;
  width: 100%;
}


/* ----------------------------------- */
}


@media screen and (max-width: 512px) {
/* -----------------------------------
    8. smaller than 512
   ----------------------------------- */
/* contact ----- */
#contact #main .box01 dl dt {
  float: none;
}

#contact #main .box01 dl dt br {
  display: none;
}

#contact #main .box01 dl dd {
  padding-left: 0;
}

#contact #main .box01 dl dd ul {
  border-left: none;
  padding-left: 0;
}

#contact #main .box01 dl .name ul li,
#contact #main .box01 dl .kana ul li {
  float: left;
}

#contact #main .box01 dl .name ul li input,
#contact #main .box01 dl .kana ul li input {
  width: 8em;
}


/* ----------------------------------- */
}


@media screen and (max-width: 480px) {
/* -----------------------------------
    9. smaller than 480
   ----------------------------------- */
header h1 {
  margin-right: 35px;
}

/* home ----- */
#home #main #maps ul {
  display: block;
}

#home #main #maps ul li {
  margin-top: 30px;
}

#home #main #maps ul li:nth-child(1),
#home #main #maps ul li:nth-child(2),
#home #main #maps ul li:nth-child(3) {
  padding: 0;
}

#home #main #maps ul li::first-child {
  margin-top: 0;
}

#home #main #maps ul li .info .photo {
  float: left;
  width: auto;
}

#home #main #maps ul li .info .txt {
  float: left;
  margin-left: 10px;
}

/* message ----- */
#message #main .box01 .block {
  display: block;
}

#message #main .box01 .block .block02 {
  margin-top: 40px;
  text-align: center;
}

/* company ----- */
#company #main .box02 dl dt {
  float: none;
}

#company #main .box02 dl dd {
  border-bottom: 1px dotted #555;
  line-height: 1.5;
  margin-bottom: 20px;
  padding: 0 0 10px 1em;
}

/* product ----- */
#product #main .box01 .block01 ul,
#product #main .box01 .block02 ul {
  display: block;
}

#product #main .box01 .block01 ul li,
#product #main .box01 .block02 ul li {
  margin-bottom: 20px;
  padding: 0;
  width: 100%;
}

/* contact ----- */
#contact #main #contract #renrakusaki dl dd {
margin-left: 0 !important;
}

#contact #main #contract #renrakusaki dl dd ul li {
  font-size: 1em !important;
}


/* ----------------------------------- */
}


@media screen and (max-width: 360px) {
/* -----------------------------------
   10. smaller than 360
   ----------------------------------- */
header {
  height: auto;
  max-height: 60px;
}

#rpmparts {
  top: -5px;
}

/* home ----- */
#home #main #maps ul li .info .photo {
  display: none;
}

#home #main #maps ul li .info .txt {
  margin-left: 0;
}

#home #main #maps ul li .info .txt .rp {
  display: none;
}

/* company ----- */
#company #main .box01 dl dd table tr td {
  padding: 0 .5em;
}

#company #main .box01 dl dd table tr .num {
  padding: 0;
}

/* seal ----- */
footer #seal ul {
  display: flex;
  justify-content: center;
}

footer #seal ul li {
  margin: 0 10px;
}

/* copyright ----- */
footer .frame #copyright {
  float: none;
  margin-top: 20px;
  position: static;
  text-align: center;
}

footer .frame #copyright div {
  padding-top: 15px;
  text-align: center;
  width: 100%;
}


/* ----------------------------------- */
}