@charset "utf-8";

    #content .boxpatrol {
      width: 90%;
      text-align: center;
      margin-left: auto;
      margin-right: auto;
    }

    #content .boxpatrol h3 {
      width: 90%;
      margin: 50px auto 3px;
      padding: 20px;
      color: #00a0e3;
      font-size: 40px;
      border: 0;
      font-weight: bold;
    }

    #content .boxpatrol img {
      padding: 20px 20px 0 20px;
    }

    #content .img-truck {
      float: right;
      position: relative;
      bottom: 100px;
    }

    #content .boxpatrol p {
      width: 98%;
      color: #000000;
      background: #FFF;
      border: solid 3px #c0c0c0;
      border-radius: 10px;
      margin: 10px;
      padding: 10px;
      font-size: 25px;
      font-weight: bold;
    }

    #content .boxpatrol2 {
      width: 90%;
      margin-left: auto;
      margin-right: auto;
    }

    #content .boxpatrol2 p {
      float: left;
      width: 48%;
      color: #000000;
      background: #FFF;
      border: solid 3px #c0c0c0;
      border-radius: 10px;
      margin: 10px;
      padding: 10px;
      font-size: 25px;
      font-weight: bold;
      text-align: center;
    }

    #content .boxpatrol3 {
      width: 90%;
      margin-left: auto;
      margin-right: auto;
      padding: 10px 40px 40px 40px;
    }

    #content .boxpatrol3 h4 {
      width: 90%;
      margin: 0px;
      padding: 35px 0px 20px 0px;
      color: #00a0e3;
      font-size: 33px;
      border: 0;
      font-weight: bold;
    }

    #content .boxpatrol3 p {
      width: 100%;
      margin: 0px 0px 0px 0px;
      padding: 0px 0px;
      color: #000;
      font-size: 22px;
      border: 0;
    }

    #content .boxpatrol4 {
      width: 100%;
    }

    #content .boxpatrol4 .bloc1 {
      width: 90%;
      height: 450px;
      margin-left: auto;
      margin-right: auto;
    }

    #content .boxpatrol4 h4 {
      margin: 0px 0px 0px 0px;
      padding: 10px 0px;
      color: #ffffff;
      background-color: #2779B7;
      font-size: 33px;
      border: 0;
      font-weight: bold;
      text-align: center;
    }

    #content .boxpatrol4 div.blocked {
      float: left;
      width: 48%;
      padding: 0.5em 1em;
    }

    #content .boxpatrol4 p.title {
      color: #00a0e3;
      margin: 20px 0px 10px 0px;
      padding: 0px;
      font-size: 23px;
      font-weight: bold;
      text-align: center;
    }

    #content .boxpatrol4 p.textline {
      margin: 0px 0px 0px 0px;
      padding: 0px;
      color: #000;
      font-size: 20px;
      text-align: left;
    }

    #content .boxpatrol4 p.textline_red {
      margin: 0px 0px 0px 0px;
      padding: 0px;
      color: #ff0000;
      font-size: 16px;
      text-align: left;
    }

    #content .boxpatrol4 p.underline {
      margin: 0px;
      padding: 0px;
      text-align: center;
    }

    #content .boxpatrol5 {
      width: 100%;
      height: calc(450px + 10em);
    }

    #content .boxpatrol5 p.sp5-text {
      display: none;
    }

    #content .boxpatrol5 h4 {
      margin: 0px 0px 0px 0px;
      padding: 10px 0px;
      color: #ffffff;
      background-color: #2779B7;
      font-size: 33px;
      border: 0;
      font-weight: bold;
      text-align: center;
    }

    #content .boxpatrol5 div.block_left {
      float: left;
      width: 60%;
      padding: 0.5em 1em;
    }

    #content .boxpatrol5 div.block_right {
      float: left;
      width: 37%;
      padding: 35px 5px 30px 5px;
    }

    #content .boxpatrol5 p.map {
      margin: 0px;
      padding: 30px;
      text-align: center;
    }

    #content .boxpatrol5 p.textline {
      margin: 0px 0px 30px 0px;
      padding: 0px;
      color: #000;
      font-size: 20px;
      text-align: left;
    }

    #content .boxpatrol5-1 {
      width: 100%;
      height: calc(350px + 10em);
    }

    #content .boxpatrol5-1 h4 {
      margin: 0px 0px 0px 0px;
      padding: 10px 0px;
      color: #ffffff;
      background-color: #2779B7;
      font-size: 33px;
      border: 0;
      font-weight: bold;
      text-align: center;
    }

    #content .boxpatrol5-1 div.block_left {
      float: left;
      width: 60%;
      padding: 0.5em 1em;
    }

    #content .boxpatrol5-1 div.block_right {
      float: left;
      width: 37%;
      padding: 35px 5px 30px 5px;
    }

    #content .boxpatrol5-1 p.map {
      margin: 0px;
      padding: 30px;
      text-align: center;
    }

    #content .boxpatrol5-1 p.textline {
      margin: 0px 0px 30px 0px;
      padding: 0px;
      color: #000;
      font-size: 20px;
      text-align: left;
    }

    #content .boxpatrol5-1 .img-note {
      margin: 0px 6px 4px 0px;
    }

    #content .boxpatrol6 {
      width: 100%;
    }

    #content .boxpatrol6 div.blocked {
      float: left;
      width: 48%;
      padding: 0.5em 1em;
    }

    #content .boxpatrol6 div.block_all {
      float: left;
      width: 100%;
      padding: 0.5em 1em;
    }

    #content .boxpatrol6 p.button {
      float: left;
      width: 100%;
      padding: 5px 10px 5px 10px;
      color: #00a0e3;
      background: #FFF;
      border: solid 3px #00a0e3;
      border-radius: 0px;
      margin: 10px;
      font-size: 25px;
      font-weight: bold;
      text-align: center;
    }

    #content .boxpatrol6 p.textline {
      width: 100%;
      padding: 10px 10px 10px 10px;
      color: #ff0000;
      background: #FFF;
      margin: 10px;
      font-size: 25px;
      font-weight: bold;
      text-align: center;
    }

    #content .boxpatrol7 {
      width: 90%;
      padding: 30px 5px 30px 5px;
      text-align: center;
      margin-left: auto;
      margin-right: auto;
    }

    #content .boxpatrol7 div {
      padding: 1em 0em;
    }

    #content .boxpatrol7 div.blocked {
      float: left;
      width: 30%;
      padding: 0em 1em;
      background: #F0F0F0;
    }

    #content .boxpatrol7 div.blocked_left {
      float: left;
      width: 20%;
			min-height: 8em;
    }

    #content .boxpatrol7 div.blocked_right {
      float: left;
      width: 80%;
      line-height: 28px;
    }

    #content .boxpatrol7 div.arrow {
      float: left;
      width: 5%;
      padding: 3.8em 1em;
    }

    #content .boxpatrol7 p.img {
      margin: 0px;
      padding: 0px;
      text-align: center;
    }

    #content .boxpatrol7 p.textline {
      margin: 0px;
      padding: 10px 0px 0px 10px;
      color: #000;
      font-size: 20px;
      text-align: left;
      vertical-align: middle;
      font-weight: bold;
    }

    #content .boxpatrol7 p.textline-red {
      padding-top: 10px;
      color: red;
      font-size: 18px;
    }

    #content .boxpatrol8 {
      width: 100%;
      padding: 4em 22em;
    }

    #content .boxpatrol8 ul {
      padding-left: 30px;
    }

    #content .boxpatrol8 li {
      width: 100%;
      text-align: left;
      list-style: disc;
    }

    #content .boxpatrol8 h3 {
      width: 25%;
      font-weight: bold;
    }

    #content .boxpatrol8 .title {
      font-weight: 100;
      padding: 0.2rem 1rem;
      color: #fff;
      background: #2992e1;
			text-shadow: none;
    }

    #content .refueling_jisseki ul {
      padding-left: 30px;
    }

    #content .refueling_jisseki li {
      width: 100%;
      text-align: left;
      list-style: disc;
    }

    #content .refueling_jisseki h3 {
      width: 25%;
      font-weight: bold;
    }

    #content .refueling_jisseki .title {
      font-weight: 100;
      padding: 0.2rem 1rem;
      color: #fff;
      background: #2992e1;
			text-shadow: none;
    }


    @media screen and (max-width: 1660px) {
      #content .boxpatrol8 {
        padding: 4em 7em;
      }
    }

    @media screen and (max-width: 1230px) {
      #content .img-truck {
        bottom: 20px;
      }

      #content .boxpatrol3 {
        padding: 10px 40px 90px 40px;
      }

      #content .box01 h4,
      #content .box02 h4 {
        font-size: calc(30px + 2em);
      }

      #content .boxpatrol h3 {
        width: 100%;
      }

      #content .boxpatrol8 {
        padding: calc(100px - 3em);
      }

      #content .boxpatrol p {
        width: 100%;
      }

      #content .boxpatrol2 p {
        float: none;
        width: 100%;
      }

      #content .boxpatrol4 .bloc1 {
        height: calc(570px + 10em);
      }

      #content .boxpatrol4 div.blocked {
        float: none;
        width: 100%;
        padding: 0px;
      }

      #content .boxpatrol5 {
        width: 100%;
        height: calc(850px + 10em);
      }

      #content .boxpatrol5 p.sp5-text {
        display: block;
      }

      #content .boxpatrol5 p.pc5-text {
        display: none;
      }

      #content .boxpatrol5 div.block_right {
        float: none;
        width: 100%;
      }

      #content .boxpatrol5 div.block_left {
        float: none;
        width: 100%;
      }

      #content .boxpatrol5-1 {
        width: 100%;
        height: calc(350px + 10em);
      }

      #content .boxpatrol5-1 .img-top {
        padding-top: 30px;
      }
    }

    @media screen and (max-width: 1105px) {
      #content .boxpatrol3 {
        padding: 10px 40px 120px 40px;
      }

      #content .img-truck {
        bottom: 10px;
      }

      #content .boxpatrol5 {
        width: 100%;
        height: calc(850px + 10em);
      }

      #content .boxpatrol5-1 {
        width: 100%;
        height: calc(750px + 10em);
      }

      #content .boxpatrol5-1 .img-top {
        padding-top: 65px;
      }

      #content .boxpatrol7 {
        width: 100%;
      }

      #content .boxpatrol7 div.blocked {
        width: 100%;
      }

      #content .boxpatrol7 div.arrow {
        width: 100%;
        transform: rotate(90deg);
        padding: 1em 0em;
      }

      #content .boxpatrol8 h3,
      #content .refueling_jisseki h3 {
        width: calc(20% + 5em);
      }
    }

    @media screen and (max-width: 660px) {
      #content .boxpatrol3 p {
        font-size: 20px;
      }

      #content .img-truck {
        bottom: 50px;
      }

      #content .boxpatrol4 .bloc1 {
        width: 100%;
        height: calc(560px + 6em);
      }

      #content .boxpatrol5 {
        width: 100%;
        height: calc(850px + 5em);
      }

      #content .boxpatrol5-1 {
        width: 100%;
        height: calc(760px + 5em);
      }

      #content .boxpatrol3 {
        width: 100%;
        padding: 10px 40px 60px 40px;
      }

      #content .boxpatrol p {
        margin: 10px 0px 10px 0px;
      }

      #content .boxpatrol2 p {
        margin: 10px 0px 10px 0px;
      }

      #content .boxpatrol8 h3,
			#content .refueling_jisseki h3 {
        width: calc(35% + 5em);
      }
    }

    @media screen and (max-width: 610px) {
      #content .img-truck {
        top: 10px;
      }

      #content .boxpatrol3 {
        padding: 10px 40px 120px 40px;
      }
			
      #content .boxpatrol7 div.blocked_left {
        min-height: 7em;
      }
    }

    @media screen and (max-width: 550px) {
      #content .boxpatrol7 p.textline-red {
        font-size: 14px;
      }

      #content .products dl ul {
        margin: 0 0 0 5px;
        list-style-type: disc;
      }

      #content .boxpatrol8 {
        padding: 4em 1em;
      }

      #content .boxpatrol p {
        font-size: 2rem;
      }

      #content .boxpatrol2 p {
        font-size: 2rem;
      }

      #content .img-truck {
        top: 10px;
      }

      #content .boxpatrol h3 {
        font-size: 26px;
        margin: 20px auto 3px;
        padding: 20px 0px;
      }

      #content .boxpatrol3 h4 {
        font-size: 26px;
      }

      #content .boxpatrol5 h4 {
        font-size: 22px;
      }

      #content .boxpatrol5-1 h4 {
        font-size: 22px;
      }

      #content .boxpatrol5-1 {
        width: 100%;
        height: calc(880px + 5em);
      }

      #content .boxpatrol4 h4 {
        padding: 10px 1px;
        font-size: 22px
      }

      #content .boxpatrol4 .bloc1 {
        width: 100%;
        height: calc(630px + 10em);
      }

      #content .boxpatrol5 {
        height: calc(830px + 3em);
      }

      #content .box01 h4,
      #content .box02 h4 {
        font-size: 40px;
      }

      #content h3 {
        padding: 20px 0px;
      }

      #content .boxpatrol5 p.map {
        padding: 0px;
      }

      #content .img-map {
        max-width: 105%;
        height: auto;
      }
    }

    @media screen and (max-width: 480px) {
      #content .img-truck {
        top: 10px;
      }

      #content .boxpatrol5 {
        height: calc(780px + 5em);
      }

      #content .boxpatrol4 .bloc1 {
        height: calc(700px + 10em);
      }
    }

    @media screen and (max-width: 410px) {
      #content .boxpatrol4 h4 {
        font-size: 20px;
      }

      #content .boxpatrol5 h4 {
        font-size: 20px;
      }

      #content .boxpatrol5-1 h4 {
        font-size: 20px;
      }

      #content .boxpatrol4 .bloc1 {
        height: calc(680px + 10em);
      }

      #content .boxpatrol5 {
        height: calc(700px + 5em);
      }

      #content .boxpatrol5-1 {
        height: calc(830px + 5em);
      }
    }