.jbm {
  @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,700"); }
  .jbm html, .jbm body, .jbm div, .jbm span, .jbm applet, .jbm object, .jbm iframe,
  .jbm h1, .jbm h2, .jbm h3, .jbm h4, .jbm h5, .jbm h6, .jbm p, .jbm blockquote, .jbm pre,
  .jbm a, .jbm abbr, .jbm acronym, .jbm address, .jbm big, .jbm cite, .jbm code,
  .jbm del, .jbm dfn, .jbm em, .jbm img, .jbm ins, .jbm kbd, .jbm q, .jbm s, .jbm samp,
  .jbm small, .jbm strike, .jbm strong, .jbm sub, .jbm sup, .jbm tt, .jbm var,
  .jbm b, .jbm u, .jbm i, .jbm center,
  .jbm dl, .jbm dt, .jbm dd, .jbm ol, .jbm ul, .jbm li,
  .jbm fieldset, .jbm form, .jbm label, .jbm legend,
  .jbm table, .jbm caption, .jbm tbody, .jbm tfoot, .jbm thead, .jbm tr, .jbm th, .jbm td,
  .jbm article, .jbm aside, .jbm canvas, .jbm details, .jbm embed,
  .jbm figure, .jbm figcaption, .jbm footer, .jbm header, .jbm hgroup,
  .jbm menu, .jbm nav, .jbm output, .jbm ruby, .jbm section, .jbm summary,
  .jbm time, .jbm mark, .jbm audio, .jbm video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline; }
  .jbm html {
    line-height: 1; }
  .jbm ol, .jbm ul {
    list-style: none; }
  .jbm table {
    border-collapse: collapse;
    border-spacing: 0; }
  .jbm caption, .jbm th, .jbm td {
    text-align: left;
    font-weight: normal;
    vertical-align: middle; }
  .jbm q, .jbm blockquote {
    quotes: none; }
    .jbm q:before, .jbm q:after, .jbm blockquote:before, .jbm blockquote:after {
      content: "";
      content: none; }
  .jbm a img {
    border: none; }
  .jbm article, .jbm aside, .jbm details, .jbm figcaption, .jbm figure, .jbm footer, .jbm header, .jbm hgroup, .jbm main, .jbm menu, .jbm nav, .jbm section, .jbm summary {
    display: block; }
  .jbm p, .jbm h1, .jbm h2, .jbm li, .jbm a {
    font-family: "Open Sans", sans-serif;
    font-size: 1em;
    line-height: 1.4em;
    font-weight: 400; }
  .jbm h1 {
    font-weight: 700;
    font-size: 2em; }
  .jbm section {
    padding: 0 20px; }
    .jbm section::after {
      clear: both;
      content: "";
      display: block; }
  .jbm section > .inner {
    max-width: 1100px;
    margin: auto;
    overflow: hidden; }
  .jbm .camp_header {
    text-align: center;
    background-color: #e1e7f3;
    color: #333333;
    padding-bottom: 100px; }
    .jbm .camp_header h1 {
      margin: 40px 0 2px; }
    .jbm .camp_header p {
      margin: 20px 0; }
  .jbm .main {
    background-color: #f9fafd;
    padding-bottom: 50px; }
    .jbm .main > .inner {
      overflow: visible; }
    .jbm .main .patent-wrap {
      margin-top: -50px;
      float: left;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-around; }
      .jbm .main .patent-wrap .patent {
        width: 235px;
        margin: 0 10px 20px;
        cursor: pointer; }
        .jbm .main .patent-wrap .patent .img {
          border: 1px solid #f4f4f4;
          border-bottom: 0; }
          .jbm .main .patent-wrap .patent .img img {
            vertical-align: bottom;
            max-width: 100%; }
        .jbm .main .patent-wrap .patent .info {
          background-color: #24a98c;
          border: 1px solid #24a98c;
          border-top: 0;
          color: #fff;
          padding: 10px;
          min-height: 4em; }
          .jbm .main .patent-wrap .patent .info .brand {
            font-size: 0.8em;
            font-weight: 100; }
          .jbm .main .patent-wrap .patent .info .name {
            font-size: 1.1em; }
  .jbm .outro p {
    color: #666666;
    text-align: center;
    margin: 50px 0; }
  .jbm .overlay {
    display: none; }
    .jbm .overlay.active {
      display: block;
      position: fixed;
      height: 100%;
      width: 100%;
      padding: 0 20px;
      overflow-y: scroll;
      left: 0;
      top: 0;
      background-color: rgba(0, 0, 0, 0.7); }
      @media screen and (min-width: 701px) {
        .jbm .overlay.active {
          padding: 0 60px; } }
    .jbm .overlay > .inner {
      max-width: 1000px;
      margin: auto;
      position: relative; }
      @media screen and (min-width: 701px) {
        .jbm .overlay > .inner {
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0; } }
    .jbm .overlay .box {
      display: none; }
      .jbm .overlay .box.active {
        background-color: #f9fafd;
        display: block;
        margin: 20px auto 20px;
        position: relative;
        -moz-box-shadow: #434343 0 0 20px;
        -webkit-box-shadow: #434343 0 0 20px;
        box-shadow: #434343 0 0 20px; }
        .jbm .overlay .box.active .inner {
          padding: 20px; }
        .jbm .overlay .box.active .l_img {
          border: 1px solid #f4f4f4;
          box-sizing: border-box; }
          .jbm .overlay .box.active .l_img img {
            max-width: 100%;
            vertical-align: bottom; }
        .jbm .overlay .box.active .info h2 {
          font-size: 1.5em;
          color: #000;
          margin: 20px 0; }
        .jbm .overlay .box.active .info p {
          color: #666666;
          font-size: 1.1em;
          margin: 1em 0;
          font-weight: 100; }
          .jbm .overlay .box.active .info p.date {
            font-weight: 700;
            font-size: 0.8em;
            margin-top: -1em; }
          .jbm .overlay .box.active .info p.desc, .jbm .overlay .box.active .info p a {
            font-size: 0.9em;
            font-weight: 100; }
          .jbm .overlay .box.active .info p a {
            color: #666666; }
        @media screen and (min-width: 701px) {
          .jbm .overlay .box.active {
            margin: 0 auto;
            width: calc(100% - 120px);
            top: 50%;
            transform: translate(0, -50%); }
            .jbm .overlay .box.active .inner::after {
              clear: both;
              content: "";
              display: block; }
            .jbm .overlay .box.active .l_img {
              float: left;
              width: 40%; }
            .jbm .overlay .box.active .info {
              float: right;
              width: calc(60% - 20px);
              margin-left: 20px; } }
        .jbm .overlay .box.active .close {
          width: 25px;
          height: 25px;
          background-color: #24a98c;
          border-radius: 12.5px;
          text-align: center;
          line-height: 25px;
          color: #fff;
          position: absolute;
          right: 10px;
          top: 10px; }
    .jbm .overlay .nav-wrap {
      text-align: center;
      margin: 20px 0; }
    .jbm .overlay .close, .jbm .overlay .nav {
      width: 25px;
      height: 25px;
      background-color: #24a98c;
      border-radius: 12.5px;
      text-align: center;
      line-height: 25px;
      color: #fff;
      margin: auto;
      display: inline-block;
      cursor: pointer; }
      .jbm .overlay .close.hide, .jbm .overlay .nav.hide {
        display: none; }
    .jbm .overlay .nav {
      margin: 10px; }
      @media screen and (min-width: 701px) {
        .jbm .overlay .nav {
          position: absolute;
          top: 50%; }
          .jbm .overlay .nav.prev {
            left: 10px; }
          .jbm .overlay .nav.next {
            right: 10px; } }
    .jbm .overlay .close {
      position: absolute;
      right: 10px;
      top: 10px; }

body.lock {
  overflow: hidden !important; }
