@charset "UTF-8";
body {
  -ms-content-zooming: none; }

.sp_use {
  display: none; }
  @media screen and (max-width: 715px) {
    .sp_use {
      display: block; } }

.top_firstview {
  height: 55vh;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d4dbe9+0,eef6ff+100 */
  background: #d4dbe9;
  /* Old browsers */
  background: -moz-linear-gradient(-45deg, #d4dbe9 0%, #eef6ff 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(-45deg, #d4dbe9 0%, #eef6ff 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(135deg, #d4dbe9 0%, #eef6ff 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4dbe9', endColorstr='#eef6ff',GradientType=1 );
  /* IE6-9 fallback on horizontal gradient */
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: column;
  max-height: 600px; }
  @media screen and (max-width: 769px) {
    .top_firstview {
      max-height: 450px; } }
  .top_firstview h1 {
    font-size: 36px;
    font-weight: 500;
    text-align: center;
    margin-top: 7%; }
    @media screen and (max-width: 515px) {
      .top_firstview h1 {
        font-size: 24px;
        position: relative;
        top: 20%; } }
    .top_firstview h1 small {
      font-size: 22px;
      text-align: center;
      display: block;
      margin: auto;
      font-weight: 400; }
      @media screen and (max-width: 515px) {
        .top_firstview h1 small {
          font-size: 14px; } }
  .top_firstview img {
    margin-bottom: -2%;
    max-width: 90%; }

.content_onecolumn h2 {
  padding: 50px 0; }
.content_onecolumn .toppage_mobile {
  background-image: url(../img/mobileback.jpg);
  background-size: cover;
  background-position: center;
  display: flex;
  justify-content: flex-end; }
  @media screen and (max-width: 515px) {
    .content_onecolumn .toppage_mobile {
      height: 70vh;
      background-position: 65%;
      background-image: url(../img/mobileback2.jpg); } }
  .content_onecolumn .toppage_mobile ul {
    width: 90%;
    max-width: 1280px;
    padding: 10% 0;
    display: flex;
    justify-content: space-between;
    margin: auto; }
    @media screen and (max-width: 515px) {
      .content_onecolumn .toppage_mobile ul {
        background: #fff;
        width: 100%;
        padding: 0px 5%;
        margin-bottom: 0px;
        align-items: center; } }
    .content_onecolumn .toppage_mobile ul li {
      display: flex;
      justify-content: center;
      text-align: center; }
      @media screen and (max-width: 769px) {
        .content_onecolumn .toppage_mobile ul li {
          width: 25%; } }
      @media screen and (max-width: 515px) {
        .content_onecolumn .toppage_mobile ul li {
          width: 80%; } }
      .content_onecolumn .toppage_mobile ul li img {
        max-width: 325px;
        height: auto;
        width: 85%;
        margin: 25px auto; }
        @media screen and (max-width: 769px) {
          .content_onecolumn .toppage_mobile ul li img {
            margin: 50px auto;
            width: 100%; } }
.content_onecolumn .toppage_security_content {
  width: 100%;
  padding: 5%;
  height: 75vh;
  background-position: center;
  background-size: cover;
  display: flex; }
  @media screen and (max-width: 769px) {
    .content_onecolumn .toppage_security_content {
      height: 45vh; } }
  .content_onecolumn .toppage_security_content .titlebox {
    height: 100%;
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    margin-left: auto;
    justify-content: center; }
    @media screen and (max-width: 515px) {
      .content_onecolumn .toppage_security_content .titlebox {
        align-items: center;
        justify-content: flex-start;
        margin-top: 75px; } }
    .content_onecolumn .toppage_security_content .titlebox h3 {
      text-align: right;
      font-size: 28px;
      font-weight: 500; }
      @media screen and (max-width: 515px) {
        .content_onecolumn .toppage_security_content .titlebox h3 {
          font-size: 24px;
          text-align: center; } }
      .content_onecolumn .toppage_security_content .titlebox h3 span {
        display: block;
        font-size: 18px;
        font-weight: 400; }
        .content_onecolumn .toppage_security_content .titlebox h3 span.link {
          margin-top: 15px; }
          .content_onecolumn .toppage_security_content .titlebox h3 span.link a {
            color: #808080; }
            @media screen and (min-width: 515px) {
              .content_onecolumn .toppage_security_content .titlebox h3 span.link a:hover {
                text-decoration: underline; } }
        @media screen and (max-width: 515px) {
          .content_onecolumn .toppage_security_content .titlebox h3 span {
            font-size: 14px; } }
    .content_onecolumn .toppage_security_content .titlebox ul {
      margin-top: 75px;
      display: flex;
      flex-wrap: wrap;
      flex-direction: column;
      max-width: 500px;
      justify-content: flex-end;
      align-items: flex-end; }
      @media screen and (max-width: 515px) {
        .content_onecolumn .toppage_security_content .titlebox ul {
          width: 55%;
          margin-top: 25px; } }
      .content_onecolumn .toppage_security_content .titlebox ul li {
        display: inline; }
        @media screen and (max-width: 515px) {
          .content_onecolumn .toppage_security_content .titlebox ul li {
            display: block;
            text-align: right; } }
        .content_onecolumn .toppage_security_content .titlebox ul li img {
          width: auto;
          height: 40px;
          margin-left: 20px; }
        .content_onecolumn .toppage_security_content .titlebox ul li:first-child {
          width: 35%;
          display: block;
          margin-bottom: 20px;
          text-align: right;
          margin-left: 30%; }
          .content_onecolumn .toppage_security_content .titlebox ul li:first-child img {
            width: 100%;
            height: auto;
            margin: auto; }
          @media screen and (max-width: 515px) {
            .content_onecolumn .toppage_security_content .titlebox ul li:first-child {
              width: 85%;
              margin: auto;
              margin-bottom: 10px; } }
        .content_onecolumn .toppage_security_content .titlebox ul li:nth-of-type(2) {
          width: 36%;
          display: block;
          margin-bottom: 20px;
          text-align: right;
          margin-left: 1em; }
          .content_onecolumn .toppage_security_content .titlebox ul li:nth-of-type(2) img {
            width: 100%;
            height: auto;
            margin: auto; }
          @media screen and (max-width: 515px) {
            .content_onecolumn .toppage_security_content .titlebox ul li:nth-of-type(2) {
              width: 88%;
              margin: auto;
              margin-bottom: 10px; } }
        .content_onecolumn .toppage_security_content .titlebox ul li:nth-of-type(3) {
          width: 24%;
          display: block;
          margin-bottom: 20px;
          text-align: right;
          margin-left: 1em; }
          .content_onecolumn .toppage_security_content .titlebox ul li:nth-of-type(3) img {
            width: 100%;
            height: auto;
            margin: auto; }
          @media screen and (max-width: 515px) {
            .content_onecolumn .toppage_security_content .titlebox ul li:nth-of-type(3) {
              width: 60%;
              margin: auto;
              margin-bottom: 10px; } }
        .content_onecolumn .toppage_security_content .titlebox ul li:nth-of-type(4) {
          width: 33%;
          display: block;
          margin-bottom: 20px;
          text-align: right;
          margin-left: 1em; }
          .content_onecolumn .toppage_security_content .titlebox ul li:nth-of-type(4) img {
            width: 100%;
            height: auto;
            margin: auto; }
          @media screen and (max-width: 515px) {
            .content_onecolumn .toppage_security_content .titlebox ul li:nth-of-type(4) {
              width: 92%;
              margin: auto;
              margin-bottom: 10px; } }
  .content_onecolumn .toppage_security_content.content1 {
    background-image: url(../img/toppage1.jpg);
    background-position: left top;
    padding: 2% 5%; }
    @media screen and (max-width: 515px) {
      .content_onecolumn .toppage_security_content.content1 {
        background-image: url(../img/toppage1dashsp.jpg); } }
    @media screen and (max-width: 769px) {
      .content_onecolumn .toppage_security_content.content1 {
        background-position: 33% center; } }
    @media screen and (max-width: 515px) {
      .content_onecolumn .toppage_security_content.content1 {
        height: 180vw; } }
    .content_onecolumn .toppage_security_content.content1 .titlebox {
      justify-content: flex-end; }
      @media screen and (max-width: 515px) {
        .content_onecolumn .toppage_security_content.content1 .titlebox {
          justify-content: flex-start;
          margin-top: 50px; } }
  .content_onecolumn .toppage_security_content.content2 {
    background-image: url(../img/toppage2.jpg);
    justify-content: flex-start;
    background-position: right; }
    @media screen and (max-width: 515px) {
      .content_onecolumn .toppage_security_content.content2 {
        background-image: url(../img/toppage2dash.jpg);
        justify-content: center; } }
    @media screen and (max-width: 515px) {
      .content_onecolumn .toppage_security_content.content2 {
        height: 180vw; } }
    .content_onecolumn .toppage_security_content.content2 .titlebox {
      margin-left: 0;
      height: 100%; }
      @media screen and (max-width: 515px) {
        .content_onecolumn .toppage_security_content.content2 .titlebox {
          margin: auto;
          margin-top: 50%;
          text-align: left; } }
      .content_onecolumn .toppage_security_content.content2 .titlebox h3 {
        text-align: left; }
        .content_onecolumn .toppage_security_content.content2 .titlebox h3 span {
          text-align: left; }
        @media screen and (max-width: 515px) {
          .content_onecolumn .toppage_security_content.content2 .titlebox h3 {
            text-align: center; }
            .content_onecolumn .toppage_security_content.content2 .titlebox h3 span {
              text-align: center; } }

.news {
  padding-top: 50px;
  padding-bottom: 50px;
  background-color: #dde2e7; }
  @media screen and (max-width: 769px) {
    .news {
      padding-bottom: 1px; } }
  .news h2 {
    padding: 50px 0; }
  .news a dl {
    display: flex;
    max-width: 780px;
    min-width: 320px;
    width: 75%;
    margin: auto;
    border-top: 1px solid #111111;
    padding: 30px 10px;
    align-items: center;
    cursor: pointer;
    position: relative;
    background: #dde2e7;
    top: 0px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all  0.2s ease; }
    @media screen and (max-width: 1020px) {
      .news a dl {
        flex-wrap: wrap; } }
    .news a dl .border_blue {
      width: 0%;
      height: 3px;
      position: absolute;
      -webkit-transition: all 0.2s ease;
      -moz-transition: all 0.2s ease;
      -o-transition: all 0.2s ease;
      transition: all  0.2s ease;
      top: 0;
      left: 0;
      background: -moz-linear-gradient(-45deg, gray 0%, #4c4c4c 100%);
      background: -webkit-linear-gradient(-45deg, gray 0%, #4c4c4c 100%);
      background: linear-gradient(135deg, gray 0%, #4c4c4c 100%); }
    .news a dl:hover {
      background: #fff;
      padding: 50px 10px;
      border-top: none; }
      .news a dl:hover .border_blue {
        width: 100%; }
    .news a dl dt {
      margin-right: 1em;
      min-width: 7em; }
    .news a dl dd {
      margin-right: 2em; }
      .news a dl dd:first-of-type {
        background-color: #535353;
        color: #fff;
        padding: 0 10px;
        min-width: 5em;
        text-align: center;
        font-size: 13px;
        border-radius: 3px;
        min-width: 8em; }
      @media screen and (max-width: 1020px) {
        .news a dl dd:last-of-type {
          width: 100%;
          padding-top: 1em; } }
  .news a:first-of-type {
    border-top: 1px solid #111111; }
  .news a:last-of-type {
    margin-bottom: 85px; }

.recruit_content {
  background: linear-gradient(70deg, #64badc, #0064b2);
  display: flex;
  align-items: center; }
  @media screen and (max-width: 767px) {
    .recruit_content {
      flex-direction: column-reverse; } }
  .recruit_content .left {
    width: 50%; }
    @media screen and (max-width: 767px) {
      .recruit_content .left {
        width: 100%; } }
    .recruit_content .left .left_inner {
      max-width: 640px;
      margin-left: auto;
      padding: 5%; }
      @media screen and (max-width: 767px) {
        .recruit_content .left .left_inner {
          padding: 2rem 5%; } }
      .recruit_content .left .left_inner .recruit_title_section {
        text-align: left; }
      .recruit_content .left .left_inner .link_wrap {
        display: flex;
        align-items: center;
        margin-top: 3rem; }
        @media screen and (max-width: 1180px) {
          .recruit_content .left .left_inner .link_wrap {
            display: block; } }
        .recruit_content .left .left_inner .link_wrap .Rounded_Button {
          margin-top: 0;
          margin-left: 0; }
        .recruit_content .left .left_inner .link_wrap .img_link {
          width: 50%;
          display: block; }
          @media screen and (max-width: 1180px) {
            .recruit_content .left .left_inner .link_wrap .img_link {
              max-width: 250px;
              margin-top: 25px; } }
          .recruit_content .left .left_inner .link_wrap .img_link img {
            width: 100%;
            height: auto; }
  .recruit_content .right {
    width: 50%;
    padding: 4rem 0; }
    @media screen and (max-width: 767px) {
      .recruit_content .right {
        padding: 0;
        width: 100%; } }
    .recruit_content .right .right_inner {
      background-image: url(../img/recimage.png);
      background-size: cover;
      width: 100%;
      height: 100%;
      margin: 0;
      background-position: center;
      min-height: 400px; }
      @media screen and (max-width: 767px) {
        .recruit_content .right .right_inner {
          min-height: 300px; } }

.two_colomn {
  display: flex;
  margin-bottom: 50px; }
  @media screen and (max-width: 769px) {
    .two_colomn {
      display: block; } }
  .two_colomn section {
    width: 50%;
    display: flex;
    justify-content: center;
    flex-direction: column; }
    @media screen and (max-width: 769px) {
      .two_colomn section {
        width: 100%; } }
  .two_colomn .recruit_content {
    background-color: #fff;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center 65%;
    display: flex;
    flex-direction: column;
    justify-content: space-between; }
    @media screen and (max-width: 769px) {
      .two_colomn .recruit_content {
        height: 70vw;
        background-position: center 60%; } }
    @media screen and (max-width: 515px) {
      .two_colomn .recruit_content {
        height: 100vw; } }
    .two_colomn .recruit_content .recimage {
      background-image: url(../img/recimage.png);
      width: 100%;
      height: 35vw;
      max-height: 500px;
      background-size: cover; }
    .two_colomn .recruit_content h2 {
      color: white;
      padding: 40px 0; }
    .two_colomn .recruit_content .recruit_link {
      height: 20vw;
      display: flex;
      align-items: center; }
      .two_colomn .recruit_content .recruit_link a {
        margin: auto; }
    .two_colomn .recruit_content .linkbox {
      height: 10vw;
      display: flex;
      width: 100%;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
      margin-left: auto;
      margin-right: auto;
      justify-content: center; }
      @media screen and (max-width: 769px) {
        .two_colomn .recruit_content .linkbox {
          height: 15vw; } }
      @media screen and (max-width: 515px) {
        .two_colomn .recruit_content .linkbox {
          height: 25vw; } }
      .two_colomn .recruit_content .linkbox a {
        width: 48%;
        text-align: center;
        margin: auto; }
        .two_colomn .recruit_content .linkbox a img {
          width: 80%;
          height: auto; }
  .two_colomn .photolib {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#808080+0,4c4c4c+100 */
    background: gray;
    /* Old browsers */
    background: -moz-linear-gradient(-45deg, gray 0%, #4c4c4c 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, gray 0%, #4c4c4c 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, gray 0%, #4c4c4c 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#808080', endColorstr='#4c4c4c',GradientType=1 );
    /* IE6-9 fallback on horizontal gradient */
    position: relative; }
    .two_colomn .photolib:after {
      width: 100%;
      height: 100%;
      content: "";
      display: blcok;
      background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAG0lEQVQYV2NkYGD4z8DAwMgABXAGNgGwSgwVAFbmAgXQdISfAAAAAElFTkSuQmCC) repeat;
      position: absolute;
      top: 0;
      right: 0; }
    .two_colomn .photolib h2 {
      color: #fff;
      padding: 40px 0;
      position: relative;
      z-index: 1; }
      .two_colomn .photolib h2:before {
        content: url(../svg/title_instaicon.svg);
        height: 25px;
        width: 25px;
        margin-right: 5px;
        display: inline-block; }
    .two_colomn .photolib .link_box {
      height: 10vw;
      position: relative;
      z-index: 1;
      display: flex;
      align-items: center; }
      @media screen and (max-width: 769px) {
        .two_colomn .photolib .link_box {
          height: 15vw; } }
      @media screen and (max-width: 515px) {
        .two_colomn .photolib .link_box {
          height: 25vw; } }
      .two_colomn .photolib .link_box a {
        position: relative;
        z-index: 1;
        margin: 0px auto; }
    .two_colomn .photolib .photo_flex {
      position: relative;
      z-index: 1;
      display: flex;
      flex-wrap: wrap;
      width: 100%; }
      .two_colomn .photolib .photo_flex .imgbox {
        width: 20%;
        overflow: hidden;
        height: 10vw; }
        @media screen and (max-width: 515px) {
          .two_colomn .photolib .photo_flex .imgbox:last-of-type {
            display: none; } }
        @media screen and (max-width: 769px) {
          .two_colomn .photolib .photo_flex .imgbox {
            height: 20vw; } }
        @media screen and (max-width: 515px) {
          .two_colomn .photolib .photo_flex .imgbox {
            width: 33.33333%;
            width: calc(100% / 3);
            height: 33.3333vw; } }
        .two_colomn .photolib .photo_flex .imgbox img {
          width: auto;
          height: 100%; }

.mobile_text {
  margin: 15px auto;
  line-height: 1.8em;
  margin-top: 50px;
  width: 100%;
  text-align: center;
  padding: 0 15px; }

.shop_container {
  padding-bottom: 50px;
  padding-top: 50px;
  border-top: 1px solid #888;
  margin-top: 50px; }
  .shop_container h2 img {
    width: 25%;
    min-width: 280px;
    max-width: 300px; }
  .shop_container .y_mobile_cm {
    background: #dde2e7;
    padding: 50px;
    margin-top: 50px; }
    .shop_container .y_mobile_cm h2 {
      margin-bottom: 50px; }
    .shop_container .y_mobile_cm p {
      font-size: 13.5px;
      line-height: 180%;
      margin: auto;
      margin-bottom: 15px;
      text-align: justify;
      letter-spacing: 1px;
      max-width: 780px;
      padding: 15px; }
    .shop_container .y_mobile_cm h3 {
      font-weight: 500;
      text-align: center;
      font-size: 18px; }
      .shop_container .y_mobile_cm h3:after {
        content: "";
        margin: auto;
        margin-right: auto;
        border-bottom: 3px solid #0070c9;
        width: 50px;
        height: 5px;
        display: block;
        margin-top: 10px;
        margin-bottom: 20px; }
    .shop_container .y_mobile_cm .youtube-movie {
      margin: 0 auto;
      padding: 10px;
      width: 100%;
      max-width: 780px; }
      .shop_container .y_mobile_cm .youtube-movie .youtube-movie-content {
        padding-top: 56.25%;
        position: relative;
        width: 100%; }
        .shop_container .y_mobile_cm .youtube-movie .youtube-movie-content iframe {
          height: 100% !important;
          left: 0;
          position: absolute;
          top: 0;
          width: 100% !important; }
  .shop_container article {
    max-width: 980px;
    margin: auto;
    margin-top: 50px; }
    .shop_container article .special_box h3 {
      width: 100%;
      margin-bottom: 25px;
      font-weight: 500; }
      @media screen and (max-width: 515px) {
        .shop_container article .special_box h3 {
          padding: 0px 15px;
          font-size: 16px; } }
    .shop_container article .special_box .shopflex_special_box {
      background: #dde2e7;
      font-size: 13.5px;
      width: 100%;
      padding: 20px 30px;
      display: flex;
      justify-content: space-between; }
      @media screen and (max-width: 515px) {
        .shop_container article .special_box .shopflex_special_box {
          display: block; } }
      .shop_container article .special_box .shopflex_special_box .speical_copybox {
        width: 60%; }
        @media screen and (max-width: 515px) {
          .shop_container article .special_box .shopflex_special_box .speical_copybox {
            width: 100%; } }
        .shop_container article .special_box .shopflex_special_box .speical_copybox h4 {
          font-size: 22px;
          font-weight: 400;
          line-height: 180%;
          margin-bottom: 0.75em; }
          @media screen and (max-width: 515px) {
            .shop_container article .special_box .shopflex_special_box .speical_copybox h4 {
              font-size: 18px; } }
        .shop_container article .special_box .shopflex_special_box .speical_copybox p {
          line-height: 180%; }
      .shop_container article .special_box .shopflex_special_box .shopflex_databox {
        width: 35%; }
        @media screen and (max-width: 515px) {
          .shop_container article .special_box .shopflex_special_box .shopflex_databox {
            width: 100%;
            margin-top: 15px; } }
        .shop_container article .special_box .shopflex_special_box .shopflex_databox .accesslink {
          color: #808080; }
        .shop_container article .special_box .shopflex_special_box .shopflex_databox dl {
          margin-bottom: 1em; }
    .shop_container article .special_box .shopflex_photobox {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between; }
      .shop_container article .special_box .shopflex_photobox .shopflex_photobox_img_mainvisual {
        width: 100%;
        /*	height: 30vw;*/
        overflow: hidden;
        display: flex;
        align-items: center;
        margin-bottom: 15px; }
        @media screen and (max-width: 515px) {
          .shop_container article .special_box .shopflex_photobox .shopflex_photobox_img_mainvisual {
            height: 50vw; } }
        .shop_container article .special_box .shopflex_photobox .shopflex_photobox_img_mainvisual img {
          width: 100%; }
      .shop_container article .special_box .shopflex_photobox .shopflex_photobox_img {
        width: 24%;
        height: auto; }
        @media screen and (max-width: 515px) {
          .shop_container article .special_box .shopflex_photobox .shopflex_photobox_img {
            width: 49%; } }
        .shop_container article .special_box .shopflex_photobox .shopflex_photobox_img img {
          width: 100%;
          height: auto; }
    .shop_container article .shopflex {
      display: flex;
      flex-wrap: wrap; }
      @media screen and (max-width: 515px) {
        .shop_container article .shopflex {
          flex-direction: column; } }
      .shop_container article .shopflex h3 {
        width: 100%;
        margin-bottom: 25px;
        font-weight: 500; }
        @media screen and (max-width: 515px) {
          .shop_container article .shopflex h3 {
            width: 100%;
            order: 1;
            padding: 0px 15px;
            font-size: 16px; } }
      .shop_container article .shopflex .shopflex_databox {
        background: #dde2e7;
        font-size: 13.5px;
        width: 40%;
        padding: 20px 30px; }
        @media screen and (max-width: 515px) {
          .shop_container article .shopflex .shopflex_databox {
            width: 100%;
            order: 3;
            padding: 20px 15px; } }
        .shop_container article .shopflex .shopflex_databox dl {
          margin-bottom: 1em; }
        .shop_container article .shopflex .shopflex_databox .accesslink {
          color: #808080; }
          .shop_container article .shopflex .shopflex_databox .accesslink:hover {
            text-decoration: underline; }
      .shop_container article .shopflex .shopflex_photobox {
        width: 60%;
        display: flex; }
        @media screen and (max-width: 515px) {
          .shop_container article .shopflex .shopflex_photobox {
            width: 100%;
            order: 2; } }
        .shop_container article .shopflex .shopflex_photobox .shopflex_photobox_img {
          width: 50%;
          overflow: hidden;
          display: flex;
          align-items: center;
          flex-direction: column;
          justify-content: center; }
          .shop_container article .shopflex .shopflex_photobox .shopflex_photobox_img img {
            height: 100%;
            width: auto;
            max-height: 300px; }
            @media screen and (max-width: 515px) {
              .shop_container article .shopflex .shopflex_photobox .shopflex_photobox_img img {
                height: auto;
                width: 100%; } }

#recruit_container section {
  background: #e5e5e5; }
  #recruit_container section.recruit_cm {
    padding: 50px 0px; }
    #recruit_container section.recruit_cm h2 {
      margin-bottom: 50px; }
    #recruit_container section.recruit_cm p {
      font-size: 13.5px;
      line-height: 180%;
      margin: auto;
      margin-bottom: 15px;
      text-align: justify;
      letter-spacing: 1px;
      max-width: 780px;
      padding: 15px; }
    #recruit_container section.recruit_cm h3 {
      font-weight: 500;
      text-align: center;
      font-size: 18px; }
      #recruit_container section.recruit_cm h3:after {
        content: "";
        margin: auto;
        margin-right: auto;
        border-bottom: 3px solid #0070c9;
        width: 50px;
        height: 5px;
        display: block;
        margin-top: 10px;
        margin-bottom: 20px; }
    #recruit_container section.recruit_cm .youtube-movie {
      margin: 0 auto;
      padding: 10px;
      width: 100%;
      max-width: 780px; }
      #recruit_container section.recruit_cm .youtube-movie .youtube-movie-content {
        padding-top: 56.25%;
        position: relative;
        width: 100%; }
        #recruit_container section.recruit_cm .youtube-movie .youtube-movie-content iframe {
          height: 100% !important;
          left: 0;
          position: absolute;
          top: 0;
          width: 100% !important; }
  #recruit_container section:nth-of-type(odd) {
    background: #fff; }
  #recruit_container section .inner_div {
    max-width: 780px;
    margin: auto;
    padding: 50px 15px; }
    #recruit_container section .inner_div dl {
      display: flex;
      margin-bottom: 15px; }
      #recruit_container section .inner_div dl dt {
        width: 20%; }
      #recruit_container section .inner_div dl dd {
        width: 80%; }
#recruit_container .recruit_summary {
  padding-bottom: 81px; }
  #recruit_container .recruit_summary .copy_zone h2 {
    text-align: center;
    font-weight: 200;
    font-size: 36px;
    padding: 50px 0px;
    padding-bottom: 25px; }
    @media screen and (max-width: 714px) {
      #recruit_container .recruit_summary .copy_zone h2 {
        font-size: 26px; } }
  #recruit_container .recruit_summary .copy_zone P {
    text-align: center;
    font-weight: 400;
    line-height: 1.8em; }
  #recruit_container .recruit_summary .flex_box {
    width: 100%;
    max-width: 1280px;
    padding: 0;
    margin: auto;
    display: flex;
    justify-content: center;
    gap: 43.5px; }
    @media screen and (max-width: 714px) {
      #recruit_container .recruit_summary .flex_box {
        flex-wrap: wrap; } }
    #recruit_container .recruit_summary .flex_box .flex {
      width: 212.5px; }
      @media screen and (max-width: 714px) {
        #recruit_container .recruit_summary .flex_box .flex {
          width: 49%;
          margin-bottom: 1.5em; } }
      #recruit_container .recruit_summary .flex_box .flex a h4 {
        font-size: 14px;
        line-height: 21px;
        font-weight: 700; }
        @media screen and (max-width: 515px) {
          #recruit_container .recruit_summary .flex_box .flex a h4 {
            font-size: 14px; } }
        #recruit_container .recruit_summary .flex_box .flex a h4:before {
          content: "";
          display: block;
          width: 50px;
          height: 2px;
          margin: 10px 0 7.5px;
          background-color: #535353; }
      #recruit_container .recruit_summary .flex_box .flex a .imgbox {
        overflow: hidden;
        height: 124.5px;
        width: 100%;
        background-position: center;
        background-size: cover; }
        #recruit_container .recruit_summary .flex_box .flex a .imgbox img {
          width: 100%;
          height: auto; }
      #recruit_container .recruit_summary .flex_box .flex a:hover {
        color: #808080;
        text-decoration: underline; }

.company_profile {
  padding: 78.5px 0 154.5px; }
  .company_profile .c-lead {
    margin-top: 42.5px; }

#company_container.backblack {
  background: #000; }
#company_container section {
  padding: 15px;
  padding-top: 50px;
  padding-bottom: 50px; }
  #company_container section h2 {
    padding-bottom: 50px; }
#company_container .company_overview {
  background: #e5e5e5;
  padding-top: 38.5px;
  padding-bottom: 80px; }
#company_container .company_map {
  padding: 0; }
  #company_container .company_map #map {
    width: 100%;
    height: 25vh;
    max-height: 800px;
    min-height: 500px; }
#company_container .company_group .div_inner {
  max-width: 780px;
  width: 100%;
  margin: auto; }
  #company_container .company_group .div_inner .group_flex_box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around; }
    #company_container .company_group .div_inner .group_flex_box h4 {
      width: 100%;
      text-align: center;
      margin-top: 25px;
      font-size: 18px;
      font-weight: 400;
      border-top: 1px dotted #888;
      padding-top: 25px;
      margin-bottom: 25px; }
    #company_container .company_group .div_inner .group_flex_box .group_flex {
      width: 49%;
      display: flex;
      flex-direction: column;
      margin-bottom: 15px; }
      @media screen and (max-width: 515px) {
        #company_container .company_group .div_inner .group_flex_box .group_flex {
          width: 100%;
          margin-bottom: 25px; } }
      #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(0), #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(1), #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(2), #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(3) {
        flex-direction: row;
        width: 49%; }
        @media screen and (max-width: 515px) {
          #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(0), #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(1), #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(2), #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(3) {
            flex-direction: column;
            width: 100%; } }
        #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(0) .textbox, #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(1) .textbox, #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(2) .textbox, #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(3) .textbox {
          padding-left: 1.5em;
          display: none; }
          @media screen and (max-width: 515px) {
            #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(0) .textbox, #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(1) .textbox, #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(2) .textbox, #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(3) .textbox {
              padding-left: 0em; } }
      #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(4), #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(5) {
        margin-top: 25px; }
        @media screen and (max-width: 515px) {
          #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(4), #company_container .company_group .div_inner .group_flex_box .group_flex:nth-of-type(5) {
            margin-top: 0px; } }
      #company_container .company_group .div_inner .group_flex_box .group_flex .imgbox {
        width: 100%; }
        @media screen and (max-width: 515px) {
          #company_container .company_group .div_inner .group_flex_box .group_flex .imgbox {
            width: 100%; } }
        #company_container .company_group .div_inner .group_flex_box .group_flex .imgbox a img {
          width: 100%;
          height: auto; }
        #company_container .company_group .div_inner .group_flex_box .group_flex .imgbox a:hover {
          opacity: 0.8; }
      #company_container .company_group .div_inner .group_flex_box .group_flex .textbox {
        display: flex;
        flex-direction: column;
        justify-content: center; }
        #company_container .company_group .div_inner .group_flex_box .group_flex .textbox .name {
          font-size: 16px;
          margin-bottom: 10px; }
        #company_container .company_group .div_inner .group_flex_box .group_flex .textbox .address, #company_container .company_group .div_inner .group_flex_box .group_flex .textbox .info {
          line-height: 1.8em;
          font-size: 13.5px; }
          #company_container .company_group .div_inner .group_flex_box .group_flex .textbox .address a, #company_container .company_group .div_inner .group_flex_box .group_flex .textbox .info a {
            text-decoration: underline; }
            #company_container .company_group .div_inner .group_flex_box .group_flex .textbox .address a:hover, #company_container .company_group .div_inner .group_flex_box .group_flex .textbox .info a:hover {
              color: #808080; }
#company_container .company_cm {
  background: rgba(255, 255, 255, 0.7) !important;
  margin: auto;
  width: 100%;
  max-width: 780px; }
  #company_container .company_cm .cmflex {
    width: 90%;
    margin: auto;
    max-width: 780px; }
    #company_container .company_cm .cmflex p {
      font-size: 13.5px;
      line-height: 180%;
      margin-bottom: 15px;
      text-align: justify;
      letter-spacing: 1px; }
    #company_container .company_cm .cmflex h4 {
      font-weight: 500;
      text-align: center;
      font-size: 18px; }
      #company_container .company_cm .cmflex h4:after {
        content: "";
        margin: auto;
        margin-right: auto;
        border-bottom: 3px solid #0070c9;
        width: 50px;
        height: 5px;
        display: block;
        margin-top: 10px;
        margin-bottom: 20px; }
    #company_container .company_cm .cmflex .youtube-movie {
      margin: 0 auto;
      padding: 10px;
      margin-bottom: 100px;
      width: 100%;
      max-width: 100%;
      /* 最大の横幅 */ }
    #company_container .company_cm .cmflex .youtube-movie-content {
      padding-top: 56.25%;
      position: relative;
      width: 100%; }
    #company_container .company_cm .cmflex .youtube-movie-content iframe {
      height: 100% !important;
      left: 0;
      position: absolute;
      top: 0;
      width: 100% !important; }
#company_container .company_philosophy {
  background: none !important;
  padding-top: 0px; }
  #company_container .company_philosophy .div_inner {
    background: rgba(255, 255, 255, 0.7);
    max-width: 780px;
    width: 100%;
    margin: auto;
    padding: 100px 15px; }
    #company_container .company_philosophy .div_inner div.philosophy {
      font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
      font-weight: 600;
      font-size: 20px;
      width: 23em;
      margin: auto;
      line-height: 1.8em; }
      @media screen and (max-width: 515px) {
        #company_container .company_philosophy .div_inner div.philosophy {
          font-size: 18px; } }
#company_container .company_message .div_inner {
  max-width: 780px;
  width: 100%;
  margin: auto; }
  #company_container .company_message .div_inner .imgbox {
    width: 80%;
    height: auto;
    display: flex;
    margin: auto;
    align-items: center;
    margin-bottom: 25px;
    justify-content: center;
    max-width: 500px; }
    #company_container .company_message .div_inner .imgbox img {
      width: 100%;
      height: auto; }
  #company_container .company_message .div_inner .name {
    margin-bottom: 25px; }
    #company_container .company_message .div_inner .name small {
      font-size: 13.5px;
      letter-spacing: 0.1em; }
    #company_container .company_message .div_inner .name p.name_mincho {
      font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
      font-weight: 600;
      font-size: 20px;
      letter-spacing: 0.1em; }
      #company_container .company_message .div_inner .name p.name_mincho span {
        font-size: 18px;
        margin-left: 0em;
        font-family: "Times New Roman", Times, serif;
        font-weight: 200;
        display: block; }
  #company_container .company_message .div_inner .textbox .message_catch {
    margin: 0 0 20px;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: 0.05em;
    color: #000; }
  #company_container .company_message .div_inner .textbox p {
    text-align: justify;
    font-size: 13.5px;
    line-height: 1.8; }
  #company_container .company_message .div_inner .textbox > p + p {
    margin-top: 1em; }
  #company_container .company_message .div_inner .textbox .singbox {
    display: flex;
    align-items: center;
    margin-top: 25px; }
    #company_container .company_message .div_inner .textbox .singbox img {
      width: 30%;
      margin-left: auto;
      height: auto;
      max-width: 250px; }
      @media screen and (max-width: 515px) {
        #company_container .company_message .div_inner .textbox .singbox img {
          width: 60%; } }
#company_container .company_stance {
  background-image: url(../img/stance.jpg);
  background-size: cover;
  background-position: center;
  position: relative;
  z-index: -1; }
  #company_container .company_stance .div_inner {
    max-width: 780px;
    width: 100%;
    margin: auto;
    padding: 100px 15px; }
    #company_container .company_stance .div_inner div.stance {
      font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
      font-weight: 600;
      font-size: 22px;
      width: 22em;
      margin: auto;
      line-height: 1.8em; }
      @media screen and (max-width: 515px) {
        #company_container .company_stance .div_inner div.stance {
          font-size: 18px; } }
  #company_container .company_stance:after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 0.2;
    z-index: -1;
    top: 0;
    left: 0; }
#company_container .company_overview .div_inner {
  max-width: 780px;
  width: 100%;
  margin: auto;
  max-width: 780px;
  width: 100%;
  margin: auto; }
  #company_container .company_overview .div_inner .imgbox {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    margin-bottom: 25px;
    justify-content: center; }
    #company_container .company_overview .div_inner .imgbox img {
      width: 100%;
      height: auto; }
  #company_container .company_overview .div_inner dl {
    display: flex;
    font-size: 13.5px;
    line-height: 1.8; }
    @media screen and (max-width: 515px) {
      #company_container .company_overview .div_inner dl {
        display: block;
        margin-bottom: 25px; } }
    #company_container .company_overview .div_inner dl dt, #company_container .company_overview .div_inner dl dd {
      margin-bottom: 15px; }
    #company_container .company_overview .div_inner dl dt {
      width: 20%; }
    #company_container .company_overview .div_inner dl dd {
      width: 80%; }
    @media screen and (max-width: 515px) {
      #company_container .company_overview .div_inner dl dt, #company_container .company_overview .div_inner dl dd {
        margin-bottom: 5px; }
      #company_container .company_overview .div_inner dl dt {
        width: 100%;
        border-bottom: 1px dotted #555;
        padding-bottom: 5px; }
      #company_container .company_overview .div_inner dl dd {
        width: 100%; } }
#company_container .company_history .div_inner {
  max-width: 780px;
  width: 100%;
  margin: auto; }
  #company_container .company_history .div_inner dl {
    font-size: 13.5px;
    display: flex;
    flex-wrap: wrap; }
    #company_container .company_history .div_inner dl dt, #company_container .company_history .div_inner dl dd {
      margin-bottom: 5px; }
    #company_container .company_history .div_inner dl .year {
      width: 6em; }
    #company_container .company_history .div_inner dl .month {
      width: 5em; }
    #company_container .company_history .div_inner dl .content {
      width: calc(100% - 11em); }
    @media screen and (max-width: 515px) {
      #company_container .company_history .div_inner dl .year {
        width: 100%;
        margin-top: 1em;
        padding-bottom: 5px;
        border-bottom: 1px dotted #555; }
      #company_container .company_history .div_inner dl .content {
        width: calc(100% - 6em); } }

#installation_container {
  position: relative; }
  #installation_container .installation_back {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -1;
    height: auto;
    max-height: 450px;
    display: flex;
    align-items: center; }
    #installation_container .installation_back img.installation_back_img {
      width: 100%;
      height: auto;
      position: relative;
      top: 0px;
      left: 0; }
  #installation_container h2 {
    padding: 100px 0px; }
  #installation_container main {
    max-width: 880px;
    width: 100%;
    margin: auto;
    background: rgba(255, 255, 255, 0.8);
    padding: 30px;
    position: relative; }
    #installation_container main h2 {
      padding: 0px; }
    #installation_container main section.installation_voice_block {
      padding: 100px 0px; }
      #installation_container main section.installation_voice_block .commentflex {
        display: flex; }
        #installation_container main section.installation_voice_block .commentflex .iconbox {
          width: 20%;
          margin-top: 50px; }
          #installation_container main section.installation_voice_block .commentflex .iconbox img {
            max-width: 200px;
            height: auto;
            width: 75%; }
        #installation_container main section.installation_voice_block .commentflex .textbox {
          width: 75%;
          margin-top: 50px; }
          #installation_container main section.installation_voice_block .commentflex .textbox h4 {
            font-weight: 500;
            color: #999;
            font-size: 18px; }
          #installation_container main section.installation_voice_block .commentflex .textbox p {
            text-align: justify;
            font-size: 16px;
            line-height: 1.8em; }
            @media screen and (max-width: 515px) {
              #installation_container main section.installation_voice_block .commentflex .textbox p {
                font-size: 14px; } }
    #installation_container main section.installation_system_block {
      position: relative;
      z-index: 0; }
      #installation_container main section.installation_system_block .imgbox {
        width: 100%;
        height: auto; }
        #installation_container main section.installation_system_block .imgbox img {
          width: 100%;
          height: auto; }
      #installation_container main section.installation_system_block:after {
        content: "";
        display: block;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        opacity: 0.8;
        background: #fff;
        z-index: -1; }
    #installation_container main section.installation_effect_block, #installation_container main section.installation_system_block {
      margin-left: -1000px;
      margin-right: -1000px;
      padding: 100px 1000px;
      padding-bottom: 50px;
      background: #dde2e7;
      background-size: cover;
      background-position: center;
      background-attachment: fixed; }
      #installation_container main section.installation_effect_block ul, #installation_container main section.installation_system_block ul {
        width: 100%;
        margin-top: 50px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap; }
        #installation_container main section.installation_effect_block ul li, #installation_container main section.installation_system_block ul li {
          width: 31%;
          margin-bottom: 50px; }
          @media screen and (max-width: 1020px) {
            #installation_container main section.installation_effect_block ul li, #installation_container main section.installation_system_block ul li {
              width: 100%; } }
          #installation_container main section.installation_effect_block ul li.harf, #installation_container main section.installation_system_block ul li.harf {
            width: 48%; }
            @media screen and (max-width: 1020px) {
              #installation_container main section.installation_effect_block ul li.harf, #installation_container main section.installation_system_block ul li.harf {
                width: 100%; } }
          #installation_container main section.installation_effect_block ul li .blue_border, #installation_container main section.installation_system_block ul li .blue_border {
            width: 0%;
            background: #26aec8;
            height: 3px;
            margin-bottom: 1em;
            -webkit-transition: all 0.5s ease;
            -moz-transition: all 0.5s ease;
            -o-transition: all 0.5s ease;
            transition: all  0.5s ease;
            top: 0;
            left: 0;
            background: -moz-linear-gradient(-45deg, gray 0%, #4c4c4c 100%);
            background: -webkit-linear-gradient(-45deg, gray 0%, #4c4c4c 100%);
            background: linear-gradient(135deg, gray 0%, #4c4c4c 100%); }
            #installation_container main section.installation_effect_block ul li .blue_border.active, #installation_container main section.installation_system_block ul li .blue_border.active {
              width: 100%; }
          #installation_container main section.installation_effect_block ul li h4, #installation_container main section.installation_system_block ul li h4 {
            font-weight: 500;
            font-size: 18px; }
          #installation_container main section.installation_effect_block ul li .textbox, #installation_container main section.installation_system_block ul li .textbox {
            margin-top: 1em; }
            #installation_container main section.installation_effect_block ul li .textbox p, #installation_container main section.installation_system_block ul li .textbox p {
              text-align: justify;
              font-size: 13.5px;
              line-height: 1.8em; }
    #installation_container main section.installation_main_block {
      margin-bottom: 50px; }
      #installation_container main section.installation_main_block .main_graph img {
        width: 100%;
        height: auto;
        margin-top: 1em; }
      #installation_container main section.installation_main_block .maintext p {
        text-align: justify;
        font-size: 16px;
        line-height: 1.8em; }
        @media screen and (max-width: 515px) {
          #installation_container main section.installation_main_block .maintext p {
            font-size: 14px; } }
      #installation_container main section.installation_main_block h2 {
        font-weight: 500;
        text-align: center; }
        #installation_container main section.installation_main_block h2:after {
          display: block;
          margin: auto; }
        @media screen and (max-width: 515px) {
          #installation_container main section.installation_main_block h2 {
            font-size: 18px; } }
        #installation_container main section.installation_main_block h2:after {
          content: "";
          margin-right: auto;
          border-bottom: 3px solid #0070c9;
          width: 50px;
          height: 5px;
          display: block;
          margin-top: 10px;
          margin-bottom: 20px; }

#top_content_wrap {
  position: relative; }
  #top_content_wrap .swiper-container {
    width: 100%;
    margin-top: 50px; }
    #top_content_wrap .swiper-container .swiper-wrapper {
      margin-top: 50px; }
      #top_content_wrap .swiper-container .swiper-wrapper .home_company {
        height: 30vw;
        min-height: 450px;
        background-position: center;
        background-size: cover; }
        @media screen and (max-width: 515px) {
          #top_content_wrap .swiper-container .swiper-wrapper .home_company {
            height: 20vw;
            min-height: 250px; } }
        #top_content_wrap .swiper-container .swiper-wrapper .home_company.back_top {
          background-position: top center; }
        #top_content_wrap .swiper-container .swiper-wrapper .home_company a {
          width: 100%;
          height: 100%;
          display: block; }

#photolib_container {
  display: flex;
  flex-wrap: wrap;
  align-items: center; }
  #photolib_container #title_container {
    width: 100%; }
  #photolib_container article {
    width: 20vw;
    height: 20vw;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center; }
    @media screen and (max-width: 515px) {
      #photolib_container article {
        width: 33.33333%;
        width: calc(100% / 3);
        height: 33.33333333vw;
        height: calc(100vw / 3); } }
    #photolib_container article a {
      align-items: center;
      justify-content: center;
      height: 101%;
      overflow: hidden;
      position: relative;
      width: 101%; }
      #photolib_container article a img {
        width: 100%;
        height: 100%;
        transform: scale(1.05, 1.05);
        transition: 0.2s all ease; }
      #photolib_container article a:hover img {
        transform: scale(1.15, 1.15); }

#security_container {
  position: relative; }
  #security_container .swiper-container {
    width: 100%;
    padding-bottom: 0px; }
    #security_container .swiper-container .swiper-slide {
      height: 100vh;
      max-height: 800px;
      background-size: cover;
      background-position: center; }
      @media screen and (max-width: 515px) {
        #security_container .swiper-container .swiper-slide {
          height: 120vw; } }
      #security_container .swiper-container .swiper-slide .product_box {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        overflow: hidden; }
        #security_container .swiper-container .swiper-slide .product_box img.swp1 {
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          max-width: 400px;
          margin: auto;
          width: 40%;
          height: auto; }
          @media screen and (max-width: 515px) {
            #security_container .swiper-container .swiper-slide .product_box img.swp1 {
              width: 60%; } }
        #security_container .swiper-container .swiper-slide .product_box img.swp2 {
          position: absolute;
          bottom: -5%;
          right: -5%;
          max-width: 950px;
          margin: auto;
          width: 80%;
          height: auto;
          z-index: 1; }
          @media screen and (max-width: 515px) {
            #security_container .swiper-container .swiper-slide .product_box img.swp2 {
              width: 100%; } }
        #security_container .swiper-container .swiper-slide .product_box img.swp4 {
          position: absolute;
          bottom: 0;
          left: 0;
          right: 0;
          max-width: 450px;
          margin: auto;
          width: 40%;
          height: auto; }
          @media screen and (max-width: 515px) {
            #security_container .swiper-container .swiper-slide .product_box img.swp4 {
              width: 60%; } }
        #security_container .swiper-container .swiper-slide .product_box img.swp5 {
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          max-width: 450px;
          margin: auto;
          width: 40%;
          height: auto;
          transform: rotateX(180deg); }
          @media screen and (max-width: 515px) {
            #security_container .swiper-container .swiper-slide .product_box img.swp5 {
              width: 60%; } }
      #security_container .swiper-container .swiper-slide .div_textbox {
        display: flex;
        height: 100%;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        position: relative;
        z-index: 11; }
        #security_container .swiper-container .swiper-slide .div_textbox.white {
          color: #fff; }
        #security_container .swiper-container .swiper-slide .div_textbox.black {
          color: #000; }
        #security_container .swiper-container .swiper-slide .div_textbox h2.entitle {
          font-family: 'Roboto Condensed', sans-serif;
          font-size: 86px;
          text-align: center; }
          @media screen and (max-width: 515px) {
            #security_container .swiper-container .swiper-slide .div_textbox h2.entitle {
              font-size: 56px; } }
        #security_container .swiper-container .swiper-slide .div_textbox h2.jptitle {
          font-weight: 500;
          font-size: 18px; }
          @media screen and (max-width: 515px) {
            #security_container .swiper-container .swiper-slide .div_textbox h2.jptitle {
              font-size: 16px; } }
        #security_container .swiper-container .swiper-slide .div_textbox p {
          width: 70%;
          max-width: 600px;
          margin-left: auto;
          margin-right: auto;
          text-align: center;
          margin-top: 2em;
          font-weight: 400;
          font-size: 16px; }
          @media screen and (max-width: 515px) {
            #security_container .swiper-container .swiper-slide .div_textbox p {
              font-size: 14px; } }
  #security_container section {
    padding-bottom: 100px; }
    #security_container section#flow {
      padding-bottom: 0px; }
    #security_container section .solution_main {
      padding-top: 100px; }
      #security_container section .solution_main h2, #security_container section .solution_main p {
        position: relative;
        z-index: 11; }
      #security_container section .solution_main p {
        padding: 15px;
        text-align: center; }
      #security_container section .solution_main .solution_flexbox {
        max-width: 100%;
        margin: auto;
        display: flex;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e0e0e0+1,000000+100&0.65+0,0+100 */
        background: -moz-linear-gradient(45deg, rgba(224, 224, 224, 0.65) 0%, rgba(224, 224, 224, 0.64) 1%, rgba(0, 0, 0, 0) 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(45deg, rgba(224, 224, 224, 0.65) 0%, rgba(224, 224, 224, 0.64) 1%, rgba(0, 0, 0, 0) 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(45deg, rgba(224, 224, 224, 0.65) 0%, rgba(224, 224, 224, 0.64) 1%, rgba(0, 0, 0, 0) 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6e0e0e0', endColorstr='#00000000',GradientType=1 );
        /* IE6-9 fallback on horizontal gradient */ }
        @media screen and (max-width: 515px) {
          #security_container section .solution_main .solution_flexbox {
            flex-direction: column; } }
        #security_container section .solution_main .solution_flexbox:nth-of-type(odd) {
          flex-direction: row-reverse;
          /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fafafa+0,000000+100&0.65+0,0+100 */
          background: -moz-linear-gradient(-45deg, rgba(250, 250, 250, 0.65) 0%, rgba(0, 0, 0, 0) 100%);
          /* FF3.6-15 */
          background: -webkit-linear-gradient(-45deg, rgba(250, 250, 250, 0.65) 0%, rgba(0, 0, 0, 0) 100%);
          /* Chrome10-25,Safari5.1-6 */
          background: linear-gradient(135deg, rgba(250, 250, 250, 0.65) 0%, rgba(0, 0, 0, 0) 100%);
          /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
          filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6fafafa', endColorstr='#00000000',GradientType=1 );
          /* IE6-9 fallback on horizontal gradient */ }
          @media screen and (max-width: 515px) {
            #security_container section .solution_main .solution_flexbox:nth-of-type(odd) {
              flex-direction: column; } }
        #security_container section .solution_main .solution_flexbox:first-of-type {
          margin-top: 100px; }
        #security_container section .solution_main .solution_flexbox .imgbox {
          width: 50%;
          background-position: center;
          background-size: cover; }
          @media screen and (max-width: 515px) {
            #security_container section .solution_main .solution_flexbox .imgbox {
              width: 100%;
              min-height: 200px; } }
        #security_container section .solution_main .solution_flexbox dl {
          width: 50%;
          padding: 45px;
          max-width: 600px;
          margin-bottom: 30px;
          padding-top: 100px;
          padding-bottom: 100px; }
          @media screen and (max-width: 515px) {
            #security_container section .solution_main .solution_flexbox dl {
              width: 100%;
              padding: 25px;
              padding-top: 25px;
              padding-bottom: 25px; } }
          #security_container section .solution_main .solution_flexbox dl .border_red {
            height: 3px;
            width: 0%;
            background: #808080;
            background: -moz-linear-gradient(-45deg, gray 0%, #4c4c4c 100%);
            background: -webkit-linear-gradient(-45deg, gray 0%, #4c4c4c 100%);
            background: linear-gradient(135deg, gray 0%, #4c4c4c 100%);
            -webkit-transition: all 1s ease;
            -moz-transition: all 1s ease;
            -o-transition: all 1s ease;
            transition: all  1s ease; }
            #security_container section .solution_main .solution_flexbox dl .border_red.active {
              width: 100%; }
          #security_container section .solution_main .solution_flexbox dl dt {
            margin-bottom: 15px;
            font-weight: 500;
            font-size: 22px;
            margin-top: 20px; }
          #security_container section .solution_main .solution_flexbox dl dd {
            font-size: 13.5px;
            line-height: 1.8em; }
            #security_container section .solution_main .solution_flexbox dl dd p {
              text-align: left;
              padding: 0; }
    #security_container section .system_installation #system_blcok_box {
      background-size: cover;
      background-position: center;
      padding: 100px 0px; }
      #security_container section .system_installation #system_blcok_box p {
        padding: 15px;
        padding-bottom: 0px;
        text-align: center; }
    #security_container section .system_installation .system_flex {
      display: flex;
      flex-wrap: wrap;
      width: 100%; }
      #security_container section .system_installation .system_flex article {
        width: 50%;
        min-height: 300px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        background-position: center;
        background-size: cover;
        position: relative; }
        @media screen and (max-width: 515px) {
          #security_container section .system_installation .system_flex article {
            width: 100%;
            min-height: 200px; } }
        #security_container section .system_installation .system_flex article h3 {
          z-index: 11;
          color: #fff;
          font-weight: 500;
          font-size: 22px; }
          @media screen and (max-width: 515px) {
            #security_container section .system_installation .system_flex article h3 {
              font-size: 18px; } }
        #security_container section .system_installation .system_flex article a {
          margin: 0px;
          margin-top: 20px;
          z-index: 11; }
        #security_container section .system_installation .system_flex article:after {
          background: black;
          opacity: 0.5;
          content: "";
          display: block;
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%; }
        #security_container section .system_installation .system_flex article:nth-of-type(odd):after {
          opacity: 0.6; }
    #security_container section.product_loop {
      padding-bottom: 0px;
      padding-top: 0px;
      margin-top: -150px; }
      #security_container section.product_loop ul {
        width: 100%;
        padding-top: 50px; }
        #security_container section.product_loop ul li {
          width: 33%;
          background: #fff;
          margin: 10px 15px;
          box-shadow: 0 0 3px #333;
          padding: 10px;
          padding-bottom: 20px;
          pointer-events: none !important; }
          #security_container section.product_loop ul li .imgbox {
            height: 250px;
            overflow: hidden;
            display: flex;
            justify-content: center;
            align-items: center; }
            @media screen and (max-width: 515px) {
              #security_container section.product_loop ul li .imgbox {
                height: 125px; } }
            #security_container section.product_loop ul li .imgbox img {
              width: 75%;
              height: auto; }
          #security_container section.product_loop ul li h3 {
            font-family: 'Roboto Condensed', sans-serif;
            text-align: center;
            font-size: 18px; }
            @media screen and (max-width: 515px) {
              #security_container section.product_loop ul li h3 {
                font-size: 14px; } }
          #security_container section.product_loop ul li h4 {
            font-family: 'Noto Sans JP', sans-serif;
            text-align: center;
            font-size: 13.5px;
            font-weight: 400; }
            @media screen and (max-width: 515px) {
              #security_container section.product_loop ul li h4 {
                font-size: 11px; } }
    #security_container section.brandlineup {
      background: #fff;
      padding-top: 100px; }
      @media screen and (max-width: 515px) {
        #security_container section.brandlineup {
          padding-bottom: 0px; } }
      #security_container section.brandlineup ul {
        max-width: 980px;
        display: flex;
        flex-wrap: wrap;
        margin: auto;
        width: 100%;
        padding: 15px;
        align-items: center;
        justify-content: center; }
        @media screen and (max-width: 515px) {
          #security_container section.brandlineup ul {
            width: 75%; } }
        #security_container section.brandlineup ul li {
          width: 25%;
          padding: 10px; }
          #security_container section.brandlineup ul li:nth-of-type(1) {
            width: 29%;
            margin-left: 10.5%;
            margin-right: 10.5%; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(1) {
                width: 80%; } }
          #security_container section.brandlineup ul li:nth-of-type(2) {
            width: 29%;
            margin-left: 10.5%;
            margin-right: 10.5%; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(2) {
                width: 82%; } }
          #security_container section.brandlineup ul li:nth-of-type(3) {
            width: 21%;
            margin-top: 15px; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(3) {
                width: 58%; } }
          #security_container section.brandlineup ul li:nth-of-type(4) {
            width: 20%;
            margin-top: 16px; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(4) {
                width: 45%;
                padding-top: 0px;
                padding-bottom: 0px; } }
          #security_container section.brandlineup ul li:nth-of-type(5) {
            width: 20%;
            margin-top: 17px; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(5) {
                width: 45%;
                padding-top: 0px;
                padding-bottom: 0px; } }
          #security_container section.brandlineup ul li:nth-of-type(6) {
            width: 20%;
            margin-top: 20px; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(6) {
                width: 45%;
                padding-top: 0px;
                padding-bottom: 0px;
                margin-top: 10px; } }
          #security_container section.brandlineup ul li:nth-of-type(7) {
            width: 17%;
            margin-top: 9px; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(7) {
                width: 45%;
                padding-top: 0px;
                padding-bottom: 0px;
                margin-top: 10px; } }
          #security_container section.brandlineup ul li:nth-of-type(8) {
            width: 20%;
            padding-top: 7px; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(8) {
                width: 45%;
                margin: auto;
                padding-top: 0px;
                padding-bottom: 0px;
                margin-top: 10px; } }
          #security_container section.brandlineup ul li:nth-of-type(9) {
            width: 20%; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(9) {
                width: 45%;
                margin: auto;
                padding-top: 10px;
                padding-bottom: 0px;
                margin-top: 10px; } }
          #security_container section.brandlineup ul li:nth-of-type(10) {
            width: 20%; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(10) {
                width: 45%;
                margin: auto;
                padding-top: 0px;
                padding-bottom: 0px;
                margin-top: 10px; } }
          #security_container section.brandlineup ul li:nth-of-type(11) {
            width: 20%; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(11) {
                width: 45%;
                margin: auto;
                padding-top: 0px;
                padding-bottom: 0px;
                margin-top: 16px; } }
          #security_container section.brandlineup ul li:nth-of-type(12) {
            width: 20%; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(12) {
                width: 45%;
                margin: auto;
                padding-top: 0px;
                padding-bottom: 0px;
                margin-top: 10px; } }
          #security_container section.brandlineup ul li:nth-of-type(13) {
            width: 20%; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(13) {
                width: 45%;
                margin: auto;
                padding-top: 0px;
                padding-bottom: 0px;
                margin-top: 10px; } }
          #security_container section.brandlineup ul li:nth-of-type(14) {
            width: 20%; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(14) {
                width: 45%;
                margin: auto;
                padding-top: 3px;
                padding-bottom: 0px;
                margin-top: 10px; } }
          #security_container section.brandlineup ul li:nth-of-type(15) {
            width: 20%; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(15) {
                width: 45%;
                margin: auto;
                padding-top: 0px;
                padding-bottom: 0px;
                margin-top: 10px; } }
          #security_container section.brandlineup ul li:nth-of-type(16) {
            width: 20%; }
            @media screen and (max-width: 515px) {
              #security_container section.brandlineup ul li:nth-of-type(16) {
                width: 45%;
                margin: auto;
                padding-top: 0px;
                padding-bottom: 0px;
                margin-top: 10px; } }
          @media screen and (max-width: 515px) {
            #security_container section.brandlineup ul li {
              width: 50%;
              width: calc(100% / 2); } }
          #security_container section.brandlineup ul li a {
            width: 100%;
            display: block; }
            #security_container section.brandlineup ul li a img {
              width: 100%;
              height: auto; }
    #security_container section.security_content_lineup {
      background-image: url(../img/toppage1dash.jpg);
      background-position: right;
      background-attachment: fixed;
      width: 100%;
      padding: 5%;
      height: auto;
      background-position: center;
      background-size: cover;
      display: flex;
      padding-top: 100px;
      padding-bottom: 200px;
      position: relative; }
      @media screen and (max-width: 515px) {
        #security_container section.security_content_lineup {
          background-image: url(../img/toppage1dashsp.jpg);
          background-attachment: inherit;
          background-position: bottom; } }
      #security_container section.security_content_lineup:after {
        content: "";
        background: #fff;
        opacity: 0.5;
        width: 100%;
        height: 100%;
        position: absolute;
        display: block;
        z-index: 0;
        left: 0;
        top: 0; }
      @media screen and (max-width: 515px) {
        #security_container section.security_content_lineup {
          padding-bottom: 280px; } }
      #security_container section.security_content_lineup .titlebox {
        height: 100%;
        display: flex;
        flex-direction: column;
        margin: auto;
        justify-content: center;
        text-shadow: 0 0 black;
        z-index: 1; }
        #security_container section.security_content_lineup .titlebox h2 {
          text-align: center;
          margin-bottom: 50px; }
        #security_container section.security_content_lineup .titlebox h3 {
          text-align: center;
          font-size: 36px;
          font-weight: 400;
          margin-bottom: 50px; }
          @media screen and (max-width: 515px) {
            #security_container section.security_content_lineup .titlebox h3 {
              font-size: 24px; } }
          #security_container section.security_content_lineup .titlebox h3 span {
            display: block;
            font-size: 22px; }
            @media screen and (max-width: 515px) {
              #security_container section.security_content_lineup .titlebox h3 span {
                font-size: 14px; } }
        #security_container section.security_content_lineup .titlebox ul {
          margin-top: 75px; }
          #security_container section.security_content_lineup .titlebox ul li {
            display: inline; }
            #security_container section.security_content_lineup .titlebox ul li:first-of-type {
              width: 100%;
              display: block;
              margin-bottom: 20px;
              text-align: right; }
            #security_container section.security_content_lineup .titlebox ul li img {
              width: auto;
              height: 40px;
              margin-left: 20px; }
  #security_container .integration_flow {
    width: 100%; }
    #security_container .integration_flow #integration_title_box {
      background-size: cover;
      background-position: center;
      background-attachment: fixed;
      position: relative;
      padding: 150px 0; }
      @media screen and (max-width: 515px) {
        #security_container .integration_flow #integration_title_box {
          background-attachment: inherit; } }
      #security_container .integration_flow #integration_title_box h2, #security_container .integration_flow #integration_title_box p {
        position: relative;
        z-index: 11;
        color: #fff; }
      #security_container .integration_flow #integration_title_box p {
        padding: 15px;
        text-align: center; }
      #security_container .integration_flow #integration_title_box:after {
        position: absolute;
        width: 100%;
        height: 100%;
        content: "";
        display: block;
        opacity: 0.7;
        background: #00c6ff;
        /* fallback for old browsers */
        background: -webkit-linear-gradient(to left, #0072ff, #00c6ff);
        /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(to left, #0072ff, #00c6ff);
        /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        top: 0;
        left: 0; }
    #security_container .integration_flow .integration_block {
      background-size: cover;
      background-position: center;
      min-height: 300px;
      display: flex;
      align-items: center;
      position: relative;
      z-index: -1;
      overflow: hidden; }
      #security_container .integration_flow .integration_block .div_circle {
        width: 1px;
        height: 1px;
        position: absolute;
        margin: auto;
        background: white;
        z-index: -1;
        border-radius: 100%;
        opacity: 1;
        transform-origin: 50% 50%; }
      #security_container .integration_flow .integration_block .integration_inner {
        margin: auto;
        display: flex;
        justify-content: space-between;
        padding: 15px;
        align-items: center;
        width: 100%;
        max-width: 980px; }
        #security_container .integration_flow .integration_block .integration_inner .integration_title_en {
          width: 30%;
          font-family: 'Roboto Condensed', sans-serif;
          font-style: normal;
          font-weight: 400;
          font-size: 36px; }
          @media screen and (max-width: 515px) {
            #security_container .integration_flow .integration_block .integration_inner .integration_title_en {
              font-size: 24px; } }
        #security_container .integration_flow .integration_block .integration_inner .integration_content {
          width: 50%; }
          #security_container .integration_flow .integration_block .integration_inner .integration_content h3 {
            text-align: left;
            font-weight: 500; }
            #security_container .integration_flow .integration_block .integration_inner .integration_content h3:after {
              content: "";
              margin-right: auto;
              border-bottom: 3px solid #808080;
              width: 50px;
              height: 5px;
              display: block;
              margin-top: 10px;
              margin-bottom: 20px; }

.svg_wrap {
  width: 100%;
  max-width: 1420px;
  position: relative;
  margin: auto; }
  @media screen and (max-width: 768px) {
    .svg_wrap {
      margin-top: -30px; } }
  .svg_wrap .svgbox {
    width: 100%;
    max-width: 60%;
    margin: auto; }
    @media screen and (max-width: 768px) {
      .svg_wrap .svgbox {
        max-width: 100%; } }
    .svg_wrap .svgbox div.pdfemb-viewer {
      background: none;
      border: none; }
    .svg_wrap .svgbox .pdf-scroll {
      min-height: 400px; }
      .svg_wrap .svgbox .pdf-scroll.is-ready {
        min-height: 0; }
      .svg_wrap .svgbox .pdf-scroll.is-error {
        padding: 40px 0;
        text-align: center; }
    .svg_wrap .svgbox .pdf-scroll__page {
      position: relative;
      background: #fff;
      box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12); }
      .svg_wrap .svgbox .pdf-scroll__page + .pdf-scroll__page {
        margin-top: 24px; }
      .svg_wrap .svgbox .pdf-scroll__page canvas {
        display: block;
        width: 100%;
        height: 100%;
        animation: pdfScrollFade .4s ease; }
  .svg_wrap .float_link {
    position: absolute;
    right: 5%;
    top: 5%;
    background: #000;
    color: white;
    padding: 20px;
    height: 10em;
    width: 10em;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold; }
    @media screen and (max-width: 768px) {
      .svg_wrap .float_link {
        position: relative;
        width: 100%;
        left: 0;
        top: 0;
        display: block;
        right: 0;
        height: auto;
        text-align: center; } }
    .svg_wrap .float_link:hover {
      background: #808080; }
    .svg_wrap .float_link span {
      display: block; }
      @media screen and (max-width: 768px) {
        .svg_wrap .float_link span {
          display: inline; } }

.brand_top__intro {
  position: relative;
  height: 1260px;
  padding-top: 78.5px;
  box-sizing: border-box; }
  .brand_top__intro .c-title, .brand_top__intro .c-lead {
    position: relative;
    z-index: 1; }
  .brand_top__intro .c-lead {
    margin-top: 42.5px; }
.brand_top__bg {
  position: absolute;
  top: 495px;
  left: 50%;
  width: 1280px;
  height: 765px;
  margin-left: -640px; }
.brand_top__models {
  margin-top: 160px; }
  .brand_top__models .c-brand-panel + .c-brand-panel {
    margin-top: 53.5px; }
.brand_top__other {
  position: relative;
  height: 364px;
  margin-top: 161.5px;
  padding-top: 77.5px;
  box-sizing: border-box;
  background: #e5e5e5; }
.brand_top__logos {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1280px;
  height: 100%;
  margin-left: -640px; }
  .brand_top__logos a {
    position: absolute;
    display: block;
    transition: opacity .3s; }
  .brand_top__logos a:hover {
    opacity: .7; }
  .brand_top__logos img {
    display: block;
    width: 100%;
    height: auto; }
  .brand_top__logos .logo-hikvision {
    left: 431.5px;
    top: 179px;
    width: 185px; }
  .brand_top__logos .logo-panasonic {
    left: 676px;
    top: 175.5px;
    width: 172.5px; }
  .brand_top__logos .logo-unv {
    left: 318.5px;
    top: 241.5px;
    width: 72.5px; }
  .brand_top__logos .logo-wisenet {
    left: 463px;
    top: 256px;
    width: 115.5px; }
  .brand_top__logos .logo-axis {
    left: 649px;
    top: 238.5px;
    width: 113px; }
  .brand_top__logos .logo-dahua {
    left: 839.5px;
    top: 247px;
    width: 107.5px; }
.brand_top__cta {
  padding: 78.5px 0 81px; }

.brand_model {
  padding: 79px 0 162.5px; }
  .brand_model__intro, .brand_model__cat {
    max-width: 1020px;
    margin-left: auto;
    margin-right: auto; }
  .brand_model__cat {
    margin-top: 84px; }
  .brand_model__intro + .brand_model__cat {
    margin-top: 69px; }
  .brand_model__cat .c-products {
    margin-top: 44.5px; }
  .brand_model__cta {
    margin-top: 134px; }

.showroom_page {
  padding-bottom: 162px; }
  .showroom_page .c-showroom-wrap:last-child {
    margin-bottom: 0; }

.showroom_intro {
  padding: 78.5px 0 151.5px; }
  .showroom_intro .c-lead {
    margin-top: 42.5px; }

.recruit_intro {
  padding: 78.5px 0 79.5px; }
  .recruit_intro .c-lead {
    margin-top: 42.5px; }
  .recruit_intro__photos {
    display: flex;
    justify-content: center;
    gap: 20.5px;
    margin-top: 35px; }
    .recruit_intro__photos img {
      display: block;
      width: 332.5px;
      height: 300.5px;
      object-fit: cover; }

.recruit_cta {
  padding: 80px 0 81px;
  background: #fff; }

.contact_page {
  padding-bottom: 163.5px; }

.contact_intro {
  padding: 79.5px 0 81px; }

.contact_form {
  padding: 35.5px 0 157.5px;
  background: #e5e5e5;
  font-feature-settings: normal; }
  .contact_form #general_container {
    padding: 0;
    background: none; }
    .contact_form #general_container .inner_div {
      width: 604.5px;
      margin: 0 auto;
      padding: 0; }
      .contact_form #general_container .inner_div p {
        font-size: inherit; }
      .contact_form #general_container .inner_div dl {
        max-width: none;
        margin: 0 0 42px; }
        .contact_form #general_container .inner_div dl dt {
          margin-bottom: 17px;
          padding-left: 3px;
          font-size: 16px;
          font-weight: 400;
          line-height: 24px; }
        .contact_form #general_container .inner_div dl p {
          margin: 0; }
      .contact_form #general_container .inner_div input[type=text], .contact_form #general_container .inner_div input[type=tel], .contact_form #general_container .inner_div input[type=email], .contact_form #general_container .inner_div textarea, .contact_form #general_container .inner_div select {
        display: block;
        width: 100%;
        height: 54.5px;
        padding: 0 15px;
        border: 0;
        border-radius: 0;
        box-sizing: border-box;
        background: #fff;
        font-family: inherit;
        font-size: 16px; }
      .contact_form #general_container .inner_div textarea {
        height: 310px;
        padding: 15px; }
      .contact_form #general_container .inner_div .selectbox:before, .contact_form #general_container .inner_div .selectbox:after {
        display: none; }
      .contact_form #general_container .inner_div .wpcf7-radio {
        display: flex;
        flex-wrap: wrap;
        padding: 0.5px 0 0 19px;
        font-size: 16px;
        line-height: 28.5px; }
        .contact_form #general_container .inner_div .wpcf7-radio::after {
          content: "";
          flex-basis: 100%;
          order: 2; }
        .contact_form #general_container .inner_div .wpcf7-radio .wpcf7-list-item {
          order: 1;
          margin: 0 12px 0 0; }
        .contact_form #general_container .inner_div .wpcf7-radio .wpcf7-list-item:nth-child(n+3) {
          order: 3; }
        .contact_form #general_container .inner_div .wpcf7-radio label {
          display: flex;
          align-items: center;
          cursor: pointer; }
        .contact_form #general_container .inner_div .wpcf7-radio input[type=radio] {
          appearance: none;
          -webkit-appearance: none;
          width: 12px;
          height: 12px;
          margin: 0 5px 0 0;
          border: 1px solid #555;
          border-radius: 50%;
          background: #fff; }
          .contact_form #general_container .inner_div .wpcf7-radio input[type=radio]:checked {
            background: radial-gradient(#231f20 0 2.5px, #fff 3px); }
      .contact_form #general_container .inner_div small {
        display: block;
        margin-top: 20px !important;
        padding-left: 3px;
        font-size: 14.5px;
        line-height: 28.8px !important; }
      .contact_form #general_container .inner_div input[type=submit] {
        display: block;
        width: 100%;
        max-width: none;
        height: 50px;
        margin: 61.5px auto 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: #231f20;
        font-family: inherit;
        font-size: 18px;
        font-weight: 500;
        color: #fff;
        cursor: pointer; }
        .contact_form #general_container .inner_div input[type=submit]:hover {
          opacity: .8; }
      .contact_form #general_container .inner_div dl:last-of-type {
        margin-bottom: 0; }
      .contact_form #general_container .inner_div dl:has([data-name="menu-354"]) {
        margin-bottom: 59px; }
      .contact_form #general_container .inner_div dl:has([data-name="your-message"]) dt {
        margin-bottom: 19.5px; }
      .contact_form #general_container .inner_div .wpcf7-spinner {
        position: absolute; }
      .contact_form #general_container .inner_div form > p {
        position: relative;
        margin: 0; }

.concept {
  padding-bottom: 125.5px; }
  .concept [id] {
    scroll-margin-top: 52px; }
  .concept .c-lead {
    margin-top: 42px; }
  .concept .c-lead--center .c-text {
    margin-top: 16.5px; }
  .concept .c-more {
    margin-top: 35px; }

.concept-fv {
  position: relative;
  height: 1000px; }
  .concept-fv::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.26) 10%, rgba(255, 255, 255, 0.5) 20%, rgba(255, 255, 255, 0.71) 30%, rgba(255, 255, 255, 0.89) 40%, #fff 50%, rgba(255, 255, 255, 0.89) 60%, rgba(255, 255, 255, 0.71) 70%, rgba(255, 255, 255, 0.5) 80%, rgba(255, 255, 255, 0.26) 90%, rgba(255, 255, 255, 0) 100%); }
  .concept-fv__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; }
  .concept-fv__body {
    position: relative;
    z-index: 1;
    padding-top: 143.5px;
    text-align: center;
    color: #000; }
  .concept-fv__logo img {
    width: 344.5px;
    height: auto;
    margin: 0 auto; }
  .concept-fv__tagline img {
    width: 480px;
    height: auto;
    margin: 51px auto 0; }
  .concept-fv__cross {
    position: relative;
    display: block;
    width: 35px;
    height: 35px;
    margin: 26px auto 0; }
    .concept-fv__cross::before, .concept-fv__cross::after {
      content: "";
      position: absolute;
      background: #000; }
    .concept-fv__cross::before {
      top: 16.5px;
      left: 0;
      width: 100%;
      height: 2px; }
    .concept-fv__cross::after {
      top: 0;
      left: 16.5px;
      width: 2px;
      height: 100%; }
  .concept-fv__word {
    margin-top: 9px;
    font-size: 47.5px;
    font-weight: 300;
    line-height: 1.2;
    letter-spacing: 0; }
  .concept-fv__en {
    margin-top: 14px;
    font-size: 16px;
    font-weight: 300;
    line-height: 28px; }
  .concept-fv .c-lead {
    margin-top: 57px; }
  .concept-fv .c-heading {
    color: #000; }
  .concept-fv .c-lead--center .c-text {
    margin-top: 23.5px;
    line-height: 44px; }

.concept-row {
  position: relative;
  max-width: 1280px;
  aspect-ratio: 1280 / 540;
  margin: 80px auto 0; }
  .concept-fv + .concept-row {
    margin-top: 160px; }
  .concept-base > .c-lead + .concept-row {
    margin-top: 76.5px; }
  .concept-row__media {
    position: absolute;
    top: 0;
    left: -4.6875%;
    width: 59.375%;
    aspect-ratio: 760 / 540; }
  .concept-row--reverse .concept-row__media {
    left: auto;
    right: -4.6875%; }
  .concept-row__img {
    height: 100%;
    clip-path: polygon(15.7895% 0, 100% 0, 84.2105% 100%, 0 100%); }
    .concept-row__img img {
      width: 100%;
      height: 100%;
      object-fit: cover; }
  .concept-row__badge {
    position: absolute;
    top: 70.2778%;
    left: 57.6974%;
    width: 21.4474%;
    height: auto; }
  .concept-row__body {
    width: 50%;
    margin-left: 50%;
    padding-top: 49px;
    box-sizing: border-box;
    text-align: center; }
  .concept-row--reverse .concept-row__body {
    margin-left: 0; }
  .concept-row__num {
    font-size: 28px;
    font-weight: 400;
    line-height: 31px;
    color: #808080; }
  .concept-row .c-more {
    display: flex;
    width: max-content;
    margin-left: auto;
    margin-right: calc(50% - 68.5px); }

.concept-base {
  margin-top: 199px; }
  .concept-base__visual {
    position: relative;
    max-width: 1280px;
    margin: 0 auto;
    background: #6386d3;
    container-type: inline-size;
    --u:0.078125cqw; }
  .concept-base__img {
    width: 100%;
    height: auto;
    aspect-ratio: 1280 / 1000; }
  .concept-base__logo {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: calc(-85 * var(--u));
    padding-top: calc(36 * var(--u));
    color: #fff;
    white-space: nowrap; }
  .concept-base__num {
    margin-left: calc(-21.5 * var(--u));
    font-size: calc(221 * var(--u));
    font-weight: 100;
    line-height: 1;
    letter-spacing: -0.081em; }
  .concept-base__word {
    margin: calc(-21 * var(--u)) 0 0 calc(-9 * var(--u));
    font-size: calc(102 * var(--u));
    font-weight: 100;
    line-height: 1;
    letter-spacing: -0.0815em; }
  .concept-base__read {
    margin: calc(8.5 * var(--u)) 0 0 calc(-1.5 * var(--u));
    font-size: calc(30 * var(--u));
    font-weight: 300;
    line-height: 1.2; }
  .concept-base__place {
    margin: calc(16.5 * var(--u)) 0 0 calc(-1.5 * var(--u));
    font-size: calc(23 * var(--u));
    font-weight: 300;
    line-height: calc(26 / 23); }
  .concept-base__lead {
    margin-top: calc(12.5 * var(--u));
    font-size: calc(10.2 * var(--u));
    font-weight: 300;
    line-height: calc(18 / 10.2); }
  .concept-base > .c-lead {
    margin-top: 74px; }

@media screen and (max-width: 1279px) {
  .concept-row__body {
    padding-left: 20px;
    padding-right: 20px; }

  .concept-row .c-heading {
    font-size: 32px;
    line-height: 40px; }

  .concept-row .c-text {
    font-size: 16px;
    line-height: 30px; } }
@media screen and (max-width: 1023px) {
  .company_profile {
    padding: 64px 0 96px; }

  #company_container .company_overview {
    padding-left: 20px;
    padding-right: 20px; }

  .brand_top__intro {
    display: flex;
    flex-direction: column;
    height: auto;
    padding: 64px 0 0; }

  .brand_top__bg {
    order: 3; }

  .brand_top__bg {
    position: static;
    width: 100%;
    height: auto;
    margin: 24px 0 0;
    aspect-ratio: 1280 / 765;
    object-fit: cover; }

  .brand_top__models {
    margin-top: 64px; }

  .brand_top__other {
    height: auto;
    margin-top: 80px;
    padding: 56px 20px 60px; }

  .brand_top__logos {
    position: static;
    width: auto;
    height: auto;
    margin: 36px auto 0;
    max-width: 640px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 28px 44px; }
    .brand_top__logos a {
      position: static; }

  .brand_top__cta {
    padding: 64px 0 72px; }

  .brand_model {
    padding: 56px 0 96px; }

  .brand_model__intro, .brand_model__cat {
    padding-left: 20px;
    padding-right: 20px; }

  .brand_model__cat {
    margin-top: 64px; }

  .brand_model__intro + .brand_model__cat {
    margin-top: 56px; }

  .brand_model__cta {
    margin-top: 80px; }

  .showroom_intro {
    padding: 64px 0 88px; }

  .showroom_page {
    padding-bottom: 96px; }

  .recruit_intro {
    padding: 64px 0 64px; }

  .recruit_intro__photos {
    padding: 0 20px;
    gap: 12px; }

  .recruit_intro__photos img {
    width: calc((100% - 24px) / 3);
    height: auto;
    aspect-ratio: 332.5 / 300.5; }

  #recruit_container .recruit_summary .flex_box {
    padding: 0 20px; }

  .recruit_cta {
    padding: 64px 0 72px; }

  .contact_intro {
    padding: 56px 0 56px; }

  .contact_page {
    padding-bottom: 96px; }

  .contact_form {
    padding: 36px 20px 96px; }

  .contact_form #general_container .inner_div {
    width: auto;
    max-width: 604.5px; }

  .concept {
    padding-bottom: 96px; }

  .concept-row {
    aspect-ratio: auto;
    margin-top: 64px; }

  .concept-fv + .concept-row {
    margin-top: 96px; }

  .concept-base > .c-lead + .concept-row {
    margin-top: 64px; }

  .concept-row__media {
    position: relative;
    left: 0;
    width: 88%; }

  .concept-row--reverse .concept-row__media {
    right: auto;
    left: 12%; }

  .concept-row__body {
    width: auto;
    margin-left: 0;
    padding: 32px 20px 0; }

  .concept-row .c-heading {
    font-size: 36px;
    line-height: 44px; }

  .concept-row .c-text {
    font-size: 18px;
    line-height: 32px; }

  .concept-row .c-more {
    margin-right: auto; }

  .concept-row__badge {
    top: auto;
    bottom: 6%;
    left: auto;
    right: 6%;
    width: 15%; }

  .concept-base {
    margin-top: 96px; }

  .concept-base > .c-lead {
    margin-top: 56px;
    padding: 0 20px; } }
@media screen and (max-width: 767px) {
  .company_profile {
    padding: 48px 0 72px; }

  .company_profile .c-lead {
    margin-top: 32px; }

  .brand_top__intro {
    padding-top: 48px; }

  .brand_top__intro .c-lead {
    margin-top: 32px; }

  .brand_top__models {
    margin-top: 48px; }

  .brand_top__models .c-brand-panel + .c-brand-panel {
    margin-top: 32px; }

  .brand_top__other {
    margin-top: 64px;
    padding: 48px 20px 52px; }

  .brand_top__logos {
    gap: 24px 32px; }
    .brand_top__logos .logo-hikvision {
      width: 150px; }
    .brand_top__logos .logo-panasonic {
      width: 140px; }
    .brand_top__logos .logo-unv {
      width: 58px; }
    .brand_top__logos .logo-wisenet {
      width: 92px; }
    .brand_top__logos .logo-axis {
      width: 90px; }
    .brand_top__logos .logo-dahua {
      width: 86px; }

  .brand_top__cta {
    padding: 48px 0 56px; }

  .brand_model {
    padding: 40px 0 72px; }

  .brand_model__cat {
    margin-top: 48px; }

  .brand_model__intro + .brand_model__cat {
    margin-top: 40px; }

  .brand_model__cat .c-products {
    margin-top: 28px; }

  .brand_model__cta {
    margin-top: 56px; }

  .showroom_intro {
    padding: 48px 0 64px; }

  .showroom_intro .c-lead {
    margin-top: 32px; }

  .showroom_page {
    padding-bottom: 72px; }

  .recruit_intro {
    padding: 48px 0 48px; }

  .recruit_intro .c-lead {
    margin-top: 32px; }

  .recruit_intro__photos {
    flex-direction: column;
    gap: 10px;
    margin-top: 32px; }

  .recruit_intro__photos img {
    width: 100%;
    aspect-ratio: 332.5 / 200; }

  #recruit_container .recruit_summary {
    padding-bottom: 56px; }

  #recruit_container .recruit_summary .flex_box {
    gap: 16px; }

  #recruit_container .recruit_summary .flex_box .flex {
    width: calc(50% - 8px);
    margin-bottom: 0; }

  #recruit_container .recruit_summary .flex_box .flex a .imgbox {
    height: auto;
    aspect-ratio: 212.5 / 124.5; }

  .recruit_cta {
    padding: 48px 0 56px; }

  .contact_intro {
    padding: 44px 0 44px; }

  .contact_page {
    padding-bottom: 72px; }

  .contact_form {
    padding: 28px 20px 72px; }

  .contact_form #general_container .inner_div dl {
    margin-bottom: 28px; }
  .contact_form #general_container .inner_div dl dt {
    margin-bottom: 10px;
    font-size: 15px; }
  .contact_form #general_container .inner_div dl:has([data-name="menu-354"]) {
    margin-bottom: 28px; }
  .contact_form #general_container .inner_div .wpcf7-radio {
    display: block;
    padding-left: 3px;
    font-size: 15px; }
    .contact_form #general_container .inner_div .wpcf7-radio::after {
      display: none; }
    .contact_form #general_container .inner_div .wpcf7-radio .wpcf7-list-item {
      display: block;
      margin: 0; }
  .contact_form #general_container .inner_div small {
    font-size: 13px;
    line-height: 22px !important;
    margin-top: 12px !important; }
  .contact_form #general_container .inner_div textarea {
    height: 220px; }
  .contact_form #general_container .inner_div input[type=submit] {
    margin-top: 40px;
    font-size: 16px; }

  .concept {
    padding-bottom: 72px; }

  .concept .c-heading {
    font-size: clamp(18px, calc((100vw - 40px) / 16.5), 24px);
    line-height: 1.45; }

  .concept-row .c-text br:not(.br-sp), .concept-base > .c-lead .c-text br:not(.br-sp) {
    display: none; }

  .concept-row .c-text, .concept-base > .c-lead .c-text {
    text-align: justify; }

  .concept-fv {
    height: auto;
    padding: 64px 0 56px; }

  .concept-fv__body {
    padding: 0 20px; }

  .concept-fv__logo img {
    width: 220px; }

  .concept-fv__tagline img {
    width: 290px;
    margin-top: 32px; }

  .concept-fv__cross {
    width: 24px;
    height: 24px;
    margin-top: 18px; }

  .concept-fv__cross::before {
    top: 11.25px;
    height: 1.5px; }

  .concept-fv__cross::after {
    left: 11.25px;
    width: 1.5px; }

  .concept-fv__word {
    margin-top: 6px;
    font-size: 32px; }

  .concept-fv__en {
    margin-top: 10px;
    font-size: 13px;
    line-height: 22px; }

  .concept-fv .c-lead {
    margin-top: 40px;
    padding: 0; }

  .concept-fv .c-lead--center .c-text {
    margin-top: 16px;
    font-size: min(15px, calc((100vw - 40px) / 22));
    line-height: 30px; }

  .concept-fv + .concept-row {
    margin-top: 64px; }

  .concept-row {
    margin-top: 56px; }

  .concept-row__body {
    padding-top: 24px; }

  .concept-row__num {
    font-size: 24px;
    line-height: 27px; }

  .concept-row .c-lead {
    margin-top: 28px;
    padding: 0; }

  .concept-row .c-text {
    font-size: 15px;
    line-height: 28px; }

  .concept-row .c-more {
    margin-top: 28px; }

  .concept-base {
    margin-top: 72px; }

  .concept-base__visual {
    --u: 0.5px; }

  .concept-base__img {
    aspect-ratio: 3 / 4;
    object-fit: cover;
    object-position: 40% 100%; }

  .concept-base__read {
    font-size: 16px; }

  .concept-base__place {
    font-size: 14px; }

  .concept-base__lead {
    font-size: 10px; }

  .concept-base > .c-lead {
    margin-top: 40px; } }
@keyframes pdfScrollFade {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
