@charset "UTF-8";
/* Scss Document */
.header .naviArea ul li:nth-child(1) a {
  background: #ffcc01;
  color: #000; }

.footer .footerNavi ul li:nth-child(1) a {
  color: #ffcc01; }

.mainImg {
  position: relative;
  display: flex;
  align-items: flex-end;
  background: url("../images/standard/main_bg_pc.jpg") no-repeat center 40%;
  background-size: cover;
  height: 480px;
  line-height: 0; }
  @media (max-width: 480px) {
    .mainImg {
      height: 200px;
      background: url("../images/standard/main_bg_sp.jpg") no-repeat center;
      background-size: cover; } }
  .mainImg .container {
    padding-bottom: 35px; }
    @media (max-width: 480px) {
      .mainImg .container {
        padding-bottom: 10px;
        margin: 0 3%; } }
    .mainImg .container img {
      width: 242.39px; }
      @media (max-width: 480px) {
        .mainImg .container img {
          width: 45%; } }

.mainImg02 {
  position: relative;
  display: flex;
  align-items: flex-end;
  background: url("../images/standard/signature/main_bg_pc.jpg") no-repeat center 40%;
  background-size: cover;
  height: 480px;
  line-height: 0; }
  @media (max-width: 480px) {
    .mainImg02 {
      height: 200px;
      background: url("../images/standard/signature/main_bg_sp.jpg") no-repeat center;
      background-size: cover; } }
  .mainImg02 .container {
    padding-bottom: 35px; }
    @media (max-width: 480px) {
      .mainImg02 .container {
        padding-bottom: 10px;
        margin: 0 3%; } }
    .mainImg02 .container img {
      width: 242.39px; }
      @media (max-width: 480px) {
        .mainImg02 .container img {
          width: 45%; } }

#navi {
  background: #ffcc01; }
  #navi ul {
    display: flex;
    justify-content: center;
    padding: 15px 0; }
    @media (max-width: 480px) {
      #navi ul {
        flex-wrap: wrap;
        justify-content: flex-start;
        padding: 0; } }
    #navi ul li {
      padding: 0 25px;
      border-right: 1px solid #000; }
      @media (max-width: 480px) {
        #navi ul li {
          width: 50%;
          display: flex;
          border-right: none;
          border-bottom: 1px solid #000;
          padding: 0; } }
      #navi ul li:first-child {
        border-left: 1px solid #000; }
        @media (max-width: 480px) {
          #navi ul li:first-child {
            border-left: none; } }
      #navi ul li:nth-child(odd) {
        border-right: 1px solid #000; }
      #navi ul li:nth-last-child(1) {
        border-bottom: none; }
      #navi ul li a {
        font-size: 12px;
        font-weight: 900;
        line-height: 14px;
        letter-spacing: 2px; }
        @media (max-width: 480px) {
          #navi ul li a {
            width: 100%;
            height: 30px;
            display: flex;
            justify-content: center;
            align-items: center;
            border-right: none;
            line-height: 1.0;
            letter-spacing: 0; } }
        #navi ul li a:hover {
          color: #fff; }

#concept {
  padding-top: 110px;
  background: #000; }
  @media (max-width: 480px) {
    #concept {
      padding-top: 50px; } }
  #concept .logo_st {
    width: 486px;
    margin: 0 auto 50px; }
    @media (max-width: 480px) {
      #concept .logo_st {
        width: 80%; } }
  #concept .title {
    margin-bottom: 60px;
    font-weight: 900;
    color: #ffcc01;
    letter-spacing: 15px;
    text-align: center; }
    @media (max-width: 480px) {
      #concept .title {
        margin-bottom: 50px; } }
  #concept .text {
    width: 550px;
    margin: 0 auto;
    line-height: 2.2;
    color: #fff;
    text-align: center; }
    @media (max-width: 480px) {
      #concept .text {
        width: 94%;
        font-size: 14px;
        line-height: 1.75;
        text-align: left; } }
    @media (max-width: 480px) {
      #concept .text .br_pc {
        display: none; } }
  #concept .photo img {
    width: 70%; }

#menu {
  line-height: 0; }
  #menu ul {
    display: flex;
    flex-flow: wrap; }
    #menu ul li {
      width: 50%; }
      #menu ul li a {
        position: relative;
        overflow: hidden;
        height: 640px;
        display: flex;
        align-items: flex-end;
        justify-content: center; }
        @media (max-width: 480px) {
          #menu ul li a {
            height: calc( 100vw * 0.5 ); } }
        #menu ul li a:after {
          position: absolute;
          content: "";
          display: block;
          width: 100%;
          height: 100%;
          top: 0;
          transition: all 1.2s ease-out; }
        #menu ul li a:hover:after {
          opacity: .8;
          transform: scale(1.2); }
        #menu ul li a span {
          font-size: 30px;
          font-weight: 900;
          color: #ffcc01;
          z-index: 2;
          padding-bottom: 60px; }
          @media (max-width: 480px) {
            #menu ul li a span {
              font-size: 20px;
              line-height: 1.2;
              padding-bottom: 10px; } }
      #menu ul li:nth-child(1) a:after {
        background: url("../images/standard/rcscex/RCSCEX.jpg") no-repeat center center;
        background-size: cover; }
      #menu ul li:nth-child(2) a:after {
        background: url("../images/standard/rcsc/RCSC　改.jpg") no-repeat center center;
        background-size: cover; }
      #menu ul li:nth-child(3) a:after {
        background: url("../images/standard/RCSSPLUS.jpg") no-repeat center center;
        background-size: cover; }
      #menu ul li:nth-child(3) a span {
        color: #000; }
      #menu ul li:nth-child(4) a:after {
        background: url("../images/standard/RCSSPLUS.jpg") no-repeat center center;
        background-size: cover; }
      @media (max-width: 480px) {
        #menu ul li:nth-child(4) a span {
          text-align: center;
          padding-bottom: 0; } }
      #menu ul li:nth-child(5) a:after {
        background: url("../images/standard/KNOB.jpg") no-repeat center center;
        background-size: cover; }
      @media (max-width: 480px) {
        #menu ul li:nth-child(5) a span {
          text-align: center;
          padding-bottom: 0; } }
      #menu ul li.no {
        background: url("../images/top/custombait_bg.jpg");
        background-size: cover;
        height: 640px;
        display: flex;
        align-items: flex-end;
        justify-content: center; }
        @media (max-width: 480px) {
          #menu ul li.no {
            height: calc( 100vw * 0.5 ); } }
        #menu ul li.no span {
          font-size: 30px;
          font-weight: 900;
          color: #000;
          z-index: 2;
          padding-bottom: 60px; }
          @media (max-width: 480px) {
            #menu ul li.no span {
              font-size: 18px;
              line-height: 1.2;
              padding-bottom: 10px; } }

#list {
  padding: 170px 0 100px; }
  @media (max-width: 480px) {
    #list {
      padding: 100px 0 50px; } }
  #list h2.title {
    text-align: center; }
    #list h2.title span {
      display: inline-block;
      line-height: 40px;
      padding: 0 35px;
      background: #000;
      color: #ffcc01;
      font-size: 20rem; }
  #list .text {
    padding: 35px 0 40px;
    text-align: center; }
    @media (max-width: 480px) {
      #list .text {
        font-size: 12px;
        line-height: 1.5;
        padding: 25px 0 20px;
        margin: 0 3%; } }
  #list .note {
    display: none; }
    @media (max-width: 480px) {
      #list .note {
        display: block;
        color: rgba(0, 0, 0, 0.5);
        font-size: 10px;
        text-align: right;
        margin: 0 3%; } }
  @media (max-width: 480px) {
    #list .listWrapper {
      width: 100%;
      overflow-x: scroll; } }
  #list .listWrapper .listBlock {
    width: 800px;
    margin: 0 auto;
    font-size: 16px; }
    @media (max-width: 1000px) {
      #list .listWrapper .listBlock {
        width: 100%; } }
    @media (max-width: 480px) {
      #list .listWrapper .listBlock {
        width: 580px;
        font-size: 12px;
        margin: 0 10px; } }
    #list .listWrapper .listBlock .titleList {
      display: flex;
      color: #ffcc01;
      font-weight: 700;
      padding: 15px; }
      @media (max-width: 480px) {
        #list .listWrapper .listBlock .titleList {
          padding: 20px; } }
      #list .listWrapper .listBlock .titleList .title01 {
        width: 280px;
        text-align: center; }
        @media (max-width: 1000px) {
          #list .listWrapper .listBlock .titleList .title01 {
            width: 37%; } }
        @media (max-width: 480px) {
          #list .listWrapper .listBlock .titleList .title01 {
            width: 200px;
            padding-right: 40px; } }
      #list .listWrapper .listBlock .titleList .title02 {
        width: 260px; }
        @media (max-width: 1000px) {
          #list .listWrapper .listBlock .titleList .title02 {
            width: 34.5%; } }
        @media (max-width: 480px) {
          #list .listWrapper .listBlock .titleList .title02 {
            width: 170px; } }
      #list .listWrapper .listBlock .titleList .title03 {
        width: 150px; }
        @media (max-width: 1000px) {
          #list .listWrapper .listBlock .titleList .title03 {
            width: 20%; } }
        @media (max-width: 480px) {
          #list .listWrapper .listBlock .titleList .title03 {
            width: 110px; } }
      @media (max-width: 480px) {
        #list .listWrapper .listBlock .titleList .title04 {
          width: 60px; } }
    #list .listWrapper .listBlock .pdfList a dl {
      display: flex;
      align-items: center;
      border-top: 1px solid #cccccc;
      padding: 30px; }
      @media (max-width: 480px) {
        #list .listWrapper .listBlock .pdfList a dl {
          padding: 20px; } }
      #list .listWrapper .listBlock .pdfList a dl .pdf {
        width: 75px; }
        @media (max-width: 480px) {
          #list .listWrapper .listBlock .pdfList a dl .pdf {
            width: 50px;
            padding-right: 10px; } }
      #list .listWrapper .listBlock .pdfList a dl .title {
        width: 190px; }
        @media (max-width: 480px) {
          #list .listWrapper .listBlock .pdfList a dl .title {
            width: 150px; } }
      #list .listWrapper .listBlock .pdfList a dl .name {
        width: 260px; }
        @media (max-width: 480px) {
          #list .listWrapper .listBlock .pdfList a dl .name {
            width: 170px; } }
      #list .listWrapper .listBlock .pdfList a dl .date {
        width: 150px; }
        @media (max-width: 480px) {
          #list .listWrapper .listBlock .pdfList a dl .date {
            width: 110px; } }
      @media (max-width: 480px) {
        #list .listWrapper .listBlock .pdfList a dl .size {
          width: 60px; } }
    #list .listWrapper .listBlock .pdfList a:last-child dl {
      border-bottom: 1px solid #cccccc; }
    #list .listWrapper .listBlock .pdfList.no-border dl {
      border-top: none;
      border-bottom: 1px solid #ccc;
      padding-top: 0; }
  @media (max-width: 480px) {
    #list .listWrapper .text {
      width: 600px;
      font-size: 16px;
      font-weight: 900;
      text-align: left; } }

#important {
  padding: 0 0 200px; }
  @media (max-width: 480px) {
    #important {
      padding: 0 0 50px; } }
  #important h2.title {
    text-align: center;
    margin-bottom: 35px; }
    @media (max-width: 480px) {
      #important h2.title {
        margin-bottom: 20px; } }
    #important h2.title span {
      display: inline-block;
      line-height: 30px;
      padding: 0 25px;
      background: #000;
      color: #ffcc01;
      font-size: 16rem; }
  #important ul {
    width: 800px;
    margin: 0 auto 100px; }
    @media (max-width: 1000px) {
      #important ul {
        width: 96%; } }
    @media (max-width: 480px) {
      #important ul {
        width: 94%;
        margin: 0 auto 50px; } }
    #important ul li {
      position: relative;
      font-size: 14rem;
      padding-left: 1.2em;
      line-height: 1.77; }
      @media (max-width: 480px) {
        #important ul li {
          font-size: 12px;
          line-height: 1.5;
          margin-bottom: 5px; } }
      #important ul li:before {
        position: absolute;
        content: "●";
        top: 0;
        left: 0; }

#first {
  padding: 80px 0 350px; }
  @media (max-width: 480px) {
    #first {
      padding: 50px 0 200px; } }
  #first .title {
    width: 200px;
    margin: 0 auto 50px; }
  #first .title02 {
    text-align: center;
    margin: 0 auto 50px; }
    #first .title02 img {
      width: 300px; }
      @media (max-width: 480px) {
        #first .title02 img {
          width: 70%; } }
    #first .title02 .subtitle01 {
      font-size: 30rem;
      font-weight: 900;
      letter-spacing: 2px;
      display: block;
      margin-top: 20px;
      text-align: center; }
      @media (max-width: 480px) {
        #first .title02 .subtitle01 {
          font-size: 22rem; } }
  #first .text {
    width: 530px;
    margin: 50px auto;
    line-height: 2.2; }
    @media (max-width: 480px) {
      #first .text {
        width: 94%;
        font-size: 14px;
        line-height: 1.75;
        margin: 50px 3%; } }
    #first .text span {
      font-size: 20px;
      font-weight: 900;
      display: block;
      text-align: center; }
      @media (max-width: 480px) {
        #first .text span {
          font-size: 16px; } }
      #first .text span .br_sp {
        display: none; }
        @media (max-width: 480px) {
          #first .text span .br_sp {
            display: block; } }
  #first .photo {
    width: 100%;
    text-align: center; }
  #first .caption {
    font-size: 14rem;
    line-height: 1.5;
    margin-top: 30px; }
    @media (max-width: 480px) {
      #first .caption {
        width: 780px;
        font-size: 12px;
        margin: 0 10px 30px; } }
  #first .photo02 {
    text-align: center;
    margin: 0 0 50px 0; }

.textBlock {
  font-size: 14rem;
  line-height: 1.5;
  margin-bottom: 100px; }
  @media (max-width: 480px) {
    .textBlock {
      font-size: 12rem; } }

#first .knob {
  margin-bottom: 350px; }
  @media (max-width: 480px) {
    #first .knob {
      margin-bottom: 150px; } }
  #first .knob .text {
    margin: 50px auto 120px; }
    @media (max-width: 480px) {
      #first .knob .text {
        margin: 50px auto; } }
#first .knob01 .title {
  width: 154px; }
#first .knob02 .title {
  width: 179px; }
#first .knob03 .title {
  width: 450px; }
  @media (max-width: 480px) {
    #first .knob03 .title {
      width: 280px; } }
#first .knob03 .c_table01 .nothing {
  position: relative; }
  #first .knob03 .c_table01 .nothing::before {
    position: absolute;
    content: "";
    background-color: #000000;
    width: 50px;
    height: 2px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
  #first .knob03 .c_table01 .nothing ul {
    display: none; }
#first .blueprint {
  text-align: center; }