@media (max-width: 767px) {
  #sb-wrapper-inner {
    margin-top: -50% !important; }

  #sb-overlay {
    height: 130% !important; }

  #bottom {
    min-width: auto !important; }

  #wrapper #inner #contents .box .btn_area {
    min-width: auto !important; } }
.hide {
  display: none !important; }

.copyright_sp {
  position: relative; }

html {
  background-color: #000;
  margin-right: 0 !important; }

body {
  width: 100%;
  height: 100%;
  position: relative;
  background-color: #000; }

img {
  width: 100%;
  height: auto; }

a:hover {
  -webkit-transition: all 0.5s cubic-bezier(0.07, 0.58, 0.56, 0.96);
  -o-transition: all 0.5s cubic-bezier(0.07, 0.58, 0.56, 0.96);
  transition: all 0.5s cubic-bezier(0.07, 0.58, 0.56, 0.96);
  opacity: 0.85; }

#loading {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: #000;
  top: 0;
  left: 0;
  z-index: 1111; }
  #loading #loading_icon {
    width: 24px;
    height: 24px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -12px 0 0 -12px; }

#start_cpn {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 111;
  display: none; }
  #start_cpn .back {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #000;
    opacity: 0.6;
    cursor: pointer; }
  #start_cpn .box {
    width: 640px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -320px;
    margin-top: -168px;
    z-index: 10; }
    #start_cpn .box .box_inner_search .logo_search {
      margin-top: 15%; }
  #start_cpn .start_close {
    display: block;
    width: 300px;
    border: 1px solid #FFF;
    padding: 10px;
    position: absolute;
    left: 50%;
    margin-left: -150px;
    bottom: -50px;
    color: #FFF;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    font-size: 10px; }
    #start_cpn .start_close:hover, #start_cpn .start_close:visited {
      color: #FFF; }

.form_modal_01 {
  position: relative; }

.modal {
  display: block;
  height: 100vh;
  position: fixed;
  top: 0;
  width: 100%; }

.modal__bg {
  background: rgba(0, 0, 0, 0.8);
  height: 100vh;
  position: absolute;
  width: 100%; }

.modal__content {
  background: inherit;
  left: 50%;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  width: 600px; }
  .modal__content .js-modal-close {
    position: absolute;
    top: -50px;
    right: -50px;
    width: 35px;
    display: block; }

#wrapper {
  width: 100%;
  background-color: #000;
  position: relative; }
  #wrapper #inner {
    min-width: 1000px;
    max-width: 1600px;
    overflow: hidden; }
    #wrapper #inner #bg {
      top: 0;
      left: 0;
      position: absolute;
      width: 100%;
      height: 100%;
      background: url(../img/bg_pc.png) no-repeat;
      background-size: auto 100%;
      background-position: center; }
    #wrapper #inner .cover_left {
      width: 18%;
      height: 100%;
      left: -1%;
      position: absolute;
      background-image: url(../img/cover_left.png);
      background-repeat: repeat-y;
      background-size: 100% auto;
      z-index: 4; }
    #wrapper #inner .cover_right {
      width: 18%;
      height: 100%;
      right: -1%;
      position: absolute;
      background-image: url(../img/cover_right.png);
      background-repeat: repeat-y;
      background-size: 100% auto;
      z-index: 4; }
    #wrapper #inner .versus_logo {
      max-width: 450px;
      width: 21%;
      margin: 0 auto 0;
      position: absolute;
      top: 58%;
      left: 0;
      right: 0; }
    #wrapper #inner .comingsoon {
      max-width: 200px;
      width: 58%;
      margin: 0 auto 0;
      position: absolute;
      top: 77.5%;
      left: 0;
      right: 0; }
    #wrapper #inner .banner_tw {
      display: none;
      z-index: 11;
      position: absolute;
      left: 6%;
      bottom: 3%;
      width: 14%;
      -webkit-box-shadow: 0 1.9px 2.5px rgba(0, 0, 0, 0.057), 0 5px 6.1px rgba(0, 0, 0, 0.076), 0 10.1px 11.4px rgba(0, 0, 0, 0.086), 0 19.2px 19.8px rgba(0, 0, 0, 0.092), 0 38.4px 34.8px rgba(0, 0, 0, 0.1), 0 101px 74px rgba(0, 0, 0, 0.13);
      box-shadow: 0 1.9px 2.5px rgba(0, 0, 0, 0.057), 0 5px 6.1px rgba(0, 0, 0, 0.076), 0 10.1px 11.4px rgba(0, 0, 0, 0.086), 0 19.2px 19.8px rgba(0, 0, 0, 0.092), 0 38.4px 34.8px rgba(0, 0, 0, 0.1), 0 101px 74px rgba(0, 0, 0, 0.13); }
    #wrapper #inner #contents {
      overflow: hidden;
      position: relative;
      z-index: 3; }
      #wrapper #inner #contents .box {
        width: 100%;
        position: relative;
        overflow: hidden;
        text-align: center; }
        #wrapper #inner #contents .box .box_inner_search .logo_search {
          width: 90%;
          margin: 30% auto 0; }
        #wrapper #inner #contents .box .coming {
          width: 26.5%;
          position: absolute;
          left: 50%;
          bottom: 15%; }
        #wrapper #inner #contents .box .catch_area {
          width: 18%;
          height: 100%;
          position: absolute;
          right: 0;
          top: 0; }
          #wrapper #inner #contents .box .catch_area .catch {
            position: absolute;
            width: 31.3%;
            left: 26%;
            top: 2%;
            opacity: 0; }
          #wrapper #inner #contents .box .catch_area .tsume_01 {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 1;
            opacity: 0; }
          #wrapper #inner #contents .box .catch_area .tsume_02, #wrapper #inner #contents .box .catch_area .tsume_03 {
            position: absolute;
            width: 100%;
            top: 0;
            left: 0;
            z-index: 1;
            opacity: 0; }
        #wrapper #inner #contents .box .btn_area {
          position: absolute;
          bottom: 3.5%;
          left: 0;
          right: 0;
          margin: 0 auto;
          width: 80%;
          min-width: 1000px;
          max-width: 1200px;
          display: -webkit-flex;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-align-items: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          -ms-flex-wrap: wrap;
          flex-wrap: wrap;
          -webkit-box-pack: justify;
          -ms-flex-pack: justify;
          justify-content: center; }
          #wrapper #inner #contents .box .btn_area .guide {
            cursor: pointer; }
          #wrapper #inner #contents .box .btn_area .btn_ {
            min-width: 180px;
            width: 19vw;
            max-width: 225px;
            margin: 1.8% 0; }
          #wrapper #inner #contents .box .btn_area .btn_pc {
            margin: 1.8% 1%; }
        #wrapper #inner #contents .box .btn_close_pc .search {
          opacity: 0 !important;
          pointer-events: none; }
        #wrapper #inner #contents .box .btn_close_sp {
          bottom: 2% !important; }
          #wrapper #inner #contents .box .btn_close_sp .btn_ {
            width: 50% !important; }
          #wrapper #inner #contents .box .btn_close_sp .search {
            display: none !important; }
        #wrapper #inner #contents .box .copyright {
          width: 20%;
          position: absolute;
          left: 50%;
          bottom: 1.5%; }

#bottom {
  min-width: 1000px;
  background-color: #000;
  width: 100%;
  padding: 15px 0;
  text-align: center;
  border-top: 1px solid #008aff;
  border-bottom: 1px solid #008aff; }
  #bottom .aproject_01 {
    width: 250px;
    margin: 0 auto; }

/*-----footer-----*/
footer {
  position: relative;
  padding-top: 10px;
  padding-bottom: 20px;
  min-width: 1000px;
  max-width: 1600px; }
  footer .caution_pc {
    width: 860px;
    margin: 0 auto .8%; }
  footer #footer_menu {
    text-align: center;
    position: relative;
    z-index: 11; }
    footer #footer_menu li {
      width: 124px;
      height: 36px;
      display: inline-block;
      margin-right: .1%; }
      footer #footer_menu li:nth-child(1) {
        width: 120px;
        margin-right: .2%; }
      footer #footer_menu li:nth-child(2) {
        width: 36px;
        margin-right: .2%; }
      footer #footer_menu li img {
        width: 100%;
        height: auto; }

@media (max-width: 767px) {
  html {
    overflow: auto !important;
    margin-right: 0 !important; }

  .mfp-bg, .mfp-wrap {
    display: none; }

  #start_cpn .box {
    width: 100% !important;
    left: 0 !important;
    top: 32% !important;
    margin-left: 0 !important;
    margin-top: 0 !important; }
  #start_cpn .start_close {
    width: 100% !important;
    left: 0 !important;
    margin-left: 0 !important; }

  #wrapper {
    background-color: #000 !important; }
    #wrapper #inner {
      min-width: auto; }
      #wrapper #inner .bg_search {
        top: 0;
        left: 0;
        position: absolute;
        width: 100%;
        height: 100%;
        background: url(../img/bg_search.png) no-repeat !important;
        background-size: 100% auto !important;
        background-position: top center !important; }
      #wrapper #inner #bg {
        background: url(../img/bg_sp.png) no-repeat;
        background-size: 100% auto;
        background-position: top center; }
      #wrapper #inner .versus_logo {
        width: 80%;
        top: 105vw; }
      #wrapper #inner .comingsoon {
        width: 90%;
        top: 141vw; }
      #wrapper #inner .pc_item {
        display: none !important; }
      #wrapper #inner .banner_tw {
        position: relative;
        left: auto;
        bottom: auto;
        margin: 0 auto 4%;
        width: 100%;
        z-index: 11; }
      #wrapper #inner #contents {
        overflow: hidden;
        position: relative; }
        #wrapper #inner #contents .box .coming {
          width: 71%;
          bottom: 19.5%; }
        #wrapper #inner #contents .box .btn_bottom {
          bottom: 3% !important; }
        #wrapper #inner #contents .box .btn_area {
          position: absolute;
          bottom: 6.5%;
          width: 100%;
          display: -webkit-flex;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-justify-content: center;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-align-items: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
          #wrapper #inner #contents .box .btn_area .btn_ {
            min-width: auto;
            width: 45%;
            margin: 2%; }
        #wrapper #inner #contents .box .catch_area {
          width: 18%;
          height: 100%;
          position: absolute;
          right: 0;
          top: 7%; }
          #wrapper #inner #contents .box .catch_area .catch {
            position: absolute;
            width: 57.3%;
            left: 40%;
            top: 0; }
        #wrapper #inner #contents .box .copyright {
          width: 100%;
          bottom: auto;
          left: auto;
          position: relative;
          margin: 0 auto; }

  footer {
    min-width: auto; }
    footer .caution_sp {
      width: 95%;
      margin: 0 auto 3%; }
    footer .eleco_sp {
      width: 50%;
      margin: 4% auto 0; }
    footer #footer_menu {
      text-align: center;
      position: relative; }
      footer #footer_menu li {
        display: inline-block;
        width: 48% !important;
        height: auto; }
        footer #footer_menu li:nth-child(odd) {
          padding: 1% .5% 1% 1%; }
        footer #footer_menu li:nth-child(even) {
          padding: 1% .1% 1% .5%; }
        footer #footer_menu li img {
          width: 100%;
          height: auto; }
    footer #foooter_sns {
      width: 12%;
      margin: 5% auto 0; }
      footer #foooter_sns li {
        display: inline-block;
        width: 100%;
        padding: 3%; }
        footer #foooter_sns li:nth-child(1) {
          display: none; }
        footer #foooter_sns li img {
          width: 100%;
          height: auto; } }
.inline-wrap2 {
  width: 40%;
  height: 100%;
  margin: 0 auto;
  position: relative;
  text-align: center;
  max-width: 810px;
  min-width: 610px; }
  .inline-wrap2 img {
    width: 100%;
    height: auto; }
  .inline-wrap2 #searchGroup {
    position: relative; }
    .inline-wrap2 #searchGroup #selectbox {
      position: absolute;
      width: 50%;
      height: 28px;
      border: 1px solid #000000;
      background: #FFF;
      font-size: 18px;
      top: 65%;
      left: 50%;
      margin: 0 0 0 -199px; }
    .inline-wrap2 #searchGroup #search_btn {
      width: 40%;
      position: absolute;
      top: 77%;
      left: 50%;
      margin-left: -115px; }
  .inline-wrap2 .mfp-close {
    margin-left: auto !important;
    margin-top: auto !important;
    left: auto !important;
    width: 4.5% !important;
    right: 1% !important;
    top: 101% !important;
    background-size: auto 100% !important; }

.eleco_foot_logo {
  width: 40%;
  margin: 0 auto; }

.searc_contents {
  padding: 0px; }
  .searc_contents #logo {
    width: 100%;
    position: relative;
    padding: 3% 0; }
  .searc_contents .searchbg {
    width: 100%;
    height: 100%;
    font-size: 14px; }
    .searc_contents .searchbg div {
      text-align: center; }
    .searc_contents .searchbg #search_c {
      width: 9%;
      position: absolute;
      top: 4%;
      right: 5%; }
    .searc_contents .searchbg .searchselect #ken_ita {
      width: 80%;
      position: relative;
      margin: 6% auto 8%; }
      .searc_contents .searchbg .searchselect #ken_ita #selectbox {
        width: 83%;
        height: 100%;
        background: #FFF;
        font-size: 1em;
        position: absolute;
        top: 150%;
        left: 8.5%;
        border: 1px solid #000000; }
    .searc_contents .searchbg .searchselect .search_btn {
      position: relative;
      left: 29%;
      width: 45%;
      padding-top: 10%;
      padding-bottom: 5%; }
      .searc_contents .searchbg .searchselect .search_btn input {
        width: 100%; }

/* ANIMETION
--------------------------------------------------- */
.fadein {
  -webkit-transition: .8s !important;
  -o-transition: .8s !important;
  transition: .8s !important;
  opacity: 0;
  -webkit-transform: translate(0, 60px);
  -ms-transform: translate(0, 60px);
  transform: translate(0, 60px); }

.fadein_af {
  opacity: 1.0;
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0); }

.fadein_op {
  transition: .8s !important;
  opacity: 0; }

.fadein_op_af {
  opacity: 1.0;
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0); }

.del_01 {
  -webkit-transition-delay: 0.2s !important;
  -o-transition-delay: 0.2s !important;
  transition-delay: 0.2s !important; }

.del_02 {
  -webkit-transition-delay: 0.4s !important;
  -o-transition-delay: 0.4s !important;
  transition-delay: 0.4s !important; }

.del_03 {
  -webkit-transition-delay: 0.6s !important;
  -o-transition-delay: 0.6s !important;
  transition-delay: 0.6s !important; }

.del_04 {
  -webkit-transition-delay: 0.6s !important;
  -o-transition-delay: 0.6s !important;
  transition-delay: 0.6s !important; }

.del_04 {
  -webkit-transition-delay: 0.6s !important;
  -o-transition-delay: 0.6s !important;
  transition-delay: 0.6s !important; }

/*# sourceMappingURL=main.css.map */
