@charset "UTF-8";
/*
---------------------------------------------------------------------------------------------------------------------
1ページでわかる岡田電気工事
---------------------------------------------------------------------------------------------------------------------
*/
#one-page, #job-type {
  margin: 60px auto 0; }
  @media (min-width: 768px) {
    #one-page, #job-type {
      margin: 100px auto 0; } }
  #one-page .swiper-button-prev,
  #one-page .swiper-button-next, #job-type .swiper-button-prev,
  #job-type .swiper-button-next {
    top: 46%; }
  #one-page .page-title, #job-type .page-title {
    position: relative;
    display: flex;
    margin: 0 0 40px 5%;
    border-top: 1px solid #707070;
    padding-top: 60px; }
    @media (min-width: 768px) {
      #one-page .page-title .txt, #job-type .page-title .txt {
        margin: 0 20px 0 0; } }
    #one-page .page-title .txt h2, #job-type .page-title .txt h2 {
      font-size: 1.25em; }
      @media (min-width: 768px) {
        #one-page .page-title .txt h2, #job-type .page-title .txt h2 {
          font-size: 1.75em; } }
    #one-page .page-title .txt p, #job-type .page-title .txt p {
      font-size: 0.8em;
      margin-top: 10px; }
      @media (min-width: 768px) {
        #one-page .page-title .txt p, #job-type .page-title .txt p {
          font-size: 0.9em; } }
    #one-page .page-title .lead-icon, #job-type .page-title .lead-icon {
      width: 120px;
      position: absolute;
      right: 5%; }
      @media (min-width: 768px) {
        #one-page .page-title .lead-icon, #job-type .page-title .lead-icon {
          width: 150px;
          position: unset; } }
      #one-page .page-title .lead-icon.one, #job-type .page-title .lead-icon.one {
        top: 10px; }
      #one-page .page-title .lead-icon.job, #job-type .page-title .lead-icon.job {
        top: 50px; }
  #one-page .news-card, #job-type .news-card {
    padding: 0 0 0 5%;
    position: relative;
    overflow: hidden;
    width: 100%; }
    #one-page .news-card .swiper-slide, #job-type .news-card .swiper-slide {
      width: 240px;
      margin: 0 15px 0 0; }
      @media (min-width: 768px) {
        #one-page .news-card .swiper-slide, #job-type .news-card .swiper-slide {
          width: 300px;
          margin: 0 30px 0 0; } }
      @media (min-width: 1024px) {
        #one-page .news-card .swiper-slide, #job-type .news-card .swiper-slide {
          width: 350px; } }
      @media (min-width: 1450px) {
        #one-page .news-card .swiper-slide, #job-type .news-card .swiper-slide {
          width: 500px;
          margin: 0 40px 0 0; } }
      #one-page .news-card .swiper-slide:last-child, #job-type .news-card .swiper-slide:last-child {
        margin-right: 3%; }
    #one-page .news-card .understand-box a:hover .imgWrap > img, #job-type .news-card .understand-box a:hover .imgWrap > img {
      transform: scale(1.04); }
    #one-page .news-card .understand-box a:hover .title > h3, #job-type .news-card .understand-box a:hover .title > h3 {
      color: #F1FF4E; }
    #one-page .news-card .understand-box a:hover .title > svg > g > .st0, #job-type .news-card .understand-box a:hover .title > svg > g > .st0 {
      fill: #F1FF4E; }
    #one-page .news-card .understand-box a .imgWrap, #job-type .news-card .understand-box a .imgWrap {
      position: relative;
      border-radius: 10px;
      overflow: hidden;
      display: block;
      z-index: 1;
      border: 2px solid #fff; }
      @media (min-width: 768px) {
        #one-page .news-card .understand-box a .imgWrap, #job-type .news-card .understand-box a .imgWrap {
          border-radius: 20px; } }
      #one-page .news-card .understand-box a .imgWrap img, #job-type .news-card .understand-box a .imgWrap img {
        width: 100%;
        height: auto;
        display: block;
        transition-duration: 0.8s;
        transform: scale(1); }
    #one-page .news-card .understand-box a h2, #job-type .news-card .understand-box a h2 {
      font-size: 0.85em;
      font-weight: normal;
      color: #fff;
      margin: 10px 0 -10px; }
      @media (min-width: 1024px) {
        #one-page .news-card .understand-box a h2, #job-type .news-card .understand-box a h2 {
          font-size: 1.0em;
          margin: 20px 0 -10px; } }
    #one-page .news-card .understand-box a .title, #job-type .news-card .understand-box a .title {
      display: flex;
      align-items: center;
      margin-top: 20px; }
      #one-page .news-card .understand-box a .title h3, #job-type .news-card .understand-box a .title h3 {
        font-size: 0.9em;
        color: #fff;
        margin: 0 10px 0 0;
        transition: .5s; }
        @media (min-width: 1024px) {
          #one-page .news-card .understand-box a .title h3, #job-type .news-card .understand-box a .title h3 {
            font-size: 1.0em; } }
      #one-page .news-card .understand-box a .title svg, #job-type .news-card .understand-box a .title svg {
        width: 20px; }
        @media (min-width: 1024px) {
          #one-page .news-card .understand-box a .title svg, #job-type .news-card .understand-box a .title svg {
            width: 30px; } }
        #one-page .news-card .understand-box a .title svg .st0, #job-type .news-card .understand-box a .title svg .st0 {
          fill: #fff;
          transition: .5s; }
        #one-page .news-card .understand-box a .title svg .st1, #job-type .news-card .understand-box a .title svg .st1 {
          fill: #222324;
          transition: .5s; }

.end-line {
  border-bottom: 1px solid #707070;
  margin: 60px 0 0 5%; }