/******* setting.scss *******/
/******* mixin.scss *******/
@media screen and (max-width: 960px) {
  div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fildset, input, textarea, p, blockquote, table, th, td, address, div {
    font-size: 2.8vw;
    line-height: 180%; }

  .menuOpen {
    height: 100%;
    overflow: hidden; }

  br.sp {
    display: inline-block; }

  img.sp {
    display: inline-block; }
    img.sp + img {
      display: none; }

  .wrapper:before {
    border-right-width: 5px; }

  /******header******/
  header .headCont {
    flex-wrap: wrap;
    padding: 3vw !important; }
  header .headLogo a {
    height: 9.2vw;
    width: 40vw; }
  header .spMenu {
    display: block;
    height: 8vw;
    position: relative;
    width: 8vw; }
    header .spMenu span {
      background-color: #362519;
      height: 3px;
      display: block;
      position: absolute;
      top: 0px;
      left: 0px;
      width: 100%;
      transition: all 0.6s; }
      header .spMenu span:nth-child(2) {
        top: 50%;
        margin-top: -1.5px; }
      header .spMenu span:nth-child(3) {
        top: auto;
        bottom: 0; }
  header .headNav {
    display: block;
    max-height: 0;
    overflow: hidden;
    transition: all 0.6s;
    width: 100%; }
  header nav {
    padding-top: 3vw; }
    header nav ul {
      border-right: none;
      display: block;
      margin-bottom: 5vw; }
      header nav ul li {
        border-left: none;
        border-bottom: 1px dotted #333;
        font-size: 140%;
        margin-right: 0;
        letter-spacing: 0.1em;
        padding: 0; }
        header nav ul li:first-child {
          border-top: 1px dotted #333; }
        header nav ul li:last-child {
          background: none;
          text-indent: 0; }
          header nav ul li:last-child a {
            box-sizing: border-box;
            width: 100%; }
        header nav ul li a {
          display: block;
          padding: 8vw;
          height: auto;
          text-align: center; }
          header nav ul li a:after {
            display: none !important; }
  header .headSns {
    justify-content: center; }
    header .headSns li {
      margin-left: 5vw; }
      header .headSns li:first-of-type {
        margin-left: 0; }
      header .headSns li a {
        font-size: 165%; }
  header.scroll .spMenu span {
    background-color: #362519; }

  .menuOpen header {
    background-color: rgba(255, 255, 255, 0.9); }
    .menuOpen header .headLogo a {
      background-image: url(../img/common/logo_scroll.png); }
    .menuOpen header .spMenu span {
      background-color: #362519; }
      .menuOpen header .spMenu span:nth-child(1) {
        top: 50%;
        transform: rotate(135deg); }
      .menuOpen header .spMenu span:nth-child(2) {
        left: 50%;
        width: 0; }
      .menuOpen header .spMenu span:nth-child(3) {
        top: 50%;
        bottom: auto;
        transform: rotate(-135deg); }
    .menuOpen header .headNav {
      max-height: 100vh; }
    .menuOpen header nav ul {
      border-right-color: #333; }
      .menuOpen header nav ul li a {
        color: #333; }
        .menuOpen header nav ul li a:after {
          background-color: #333; }
    .menuOpen header .headSns li a {
      color: #333; }

  /******footer******/
  .contactArea h2 {
    font-size: 261%; }
  .contactArea .secCont .btn {
    margin: 0 4vw 0; }
    .contactArea .secCont .btn:first-child {
      margin-bottom: 4vw; }
    .contactArea .secCont .btn a {
      padding: 10px 0; }

  footer .footCont h2 {
    margin: 0 auto 40px; }
  footer .footCont .footLeft {
    width: 100%; }
    footer .footCont .footLeft ul li {
      border-top: 1px dotted #fff;
      width: 100%;
      margin: 0;
      padding: 0;
      position: static; }
      footer .footCont .footLeft ul li:before {
        content: none; }
      footer .footCont .footLeft ul li:last-child {
        border-bottom: 1px dotted #fff;
        margin-bottom: 40px; }
      footer .footCont .footLeft ul li a {
        display: block;
        padding: 20px;
        width: 100%;
        text-align: left;
        box-sizing: border-box; }
    footer .footCont .footLeft ul.footInfo li {
      display: block;
      width: 100%;
      text-align: center;
      box-sizing: border-box;
      border: none; }
      footer .footCont .footLeft ul.footInfo li:last-child {
        margin-bottom: 0; }

  /******main******/
  main {
    background-size: 261%;
    padding-top: 37vw; }
    main h1 {
      font-size: 100%;
      margin: 0 auto 19vw; }
      main h1 span {
        font-size: 225% !important;
        margin-bottom: 2vw;
        letter-spacing: normal !important; }
    main .topics {
      margin: 0 5vw 1vw; }
    main .secCont {
      max-width: 1200px;
      margin: 0 auto;
      padding: 8vw 4vw; }
      main .secCont.wAll .secCont {
        padding-bottom: 8vw;
        padding-top: 8vw; }
      main .secCont.wAll section:last-of-type .secCont {
        padding-bottom: 15vw; }
    main p {
      margin-bottom: 5vw; }
    main .btn {
      width: 92vw; }
      main .btn a {
        font-size: 110%;
        height: 16vw; }
        main .btn a:after {
          height: 2vw;
          margin-top: -1vw;
          top: 50%;
          right: 3vw;
          width: 2vw; }

  .mb20 {
    margin-bottom: 2vw !important; }

  .mb30 {
    margin-bottom: 3vw !important; }

  .mb40 {
    margin-bottom: 4vw !important; }

  .mb60 {
    margin-bottom: 6vw !important; }

  .mb80 {
    margin-bottom: 7vw !important; }

  /******** index ********/
  #index .mainVisual .title {
    height: 130vw;
    padding: 0 4vw; }
  #index .mainVisual h1 {
    font-size: 530%; }
  #index .secCont h2 {
    margin: 0 auto 5vw;
    font-size: 161%; }
    #index .secCont h2 span {
      font-size: 225% !important;
      margin-bottom: 2vw;
      letter-spacing: normal !important; }
  #index .pictRow {
    margin: 0 auto 5vw; }
  #index .pager a,
  #index .pager span {
    height: 5vw;
    margin: 0 1.5vw;
    width: 5vw; }
  #index .pager a.c, #index .pager a:hover {
    background-color: #000;
    color: #fff; }
  #index .pager a.prev {
    border: none;
    font-size: 250%;
    margin-left: 0; }
    #index .pager a.prev:hover {
      background-color: inherit;
      color: #000;
      opacity: 0.7; }
  #index .pager a.next {
    border: none;
    font-size: 250%;
    margin-right: 0; }
    #index .pager a.next:hover {
      background-color: inherit;
      color: #000;
      opacity: 0.7; }

  .itemList {
    margin-bottom: 4vw; }
    .itemList li {
      width: 100vw;
      margin-bottom: 4vw; }
      .itemList li .pict {
        margin-bottom: 4vw; }

  /******** work detail ********/
  .workDetail {
    padding: 8vw 0;
    margin-bottom: 8vw; }
    .workDetail .secCont {
      width: auto; }
      .workDetail .secCont .flexslider .flex-control-thumbs li {
        width: 14%;
        height: auto; }

  /******** news ********/
  .news .secCont .newsitem {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 8vw; }
    .news .secCont .newsitem .item {
      width: 92vw;
      margin-bottom: 4vw; }
      .news .secCont .newsitem .item a {
        padding: 0; }
        .news .secCont .newsitem .item a figure {
          margin-bottom: 4vw; }
          .news .secCont .newsitem .item a figure img {
            width: 92vw;
            height: 57vw; }
        .news .secCont .newsitem .item a .cont p {
          padding: 0 4vw 2vw; }
        .news .secCont .newsitem .item a .cont dl {
          padding: 0 4vw 4vw; }
  .news .secCont .pager {
    width: 100%; }
  .news .secCont .sideArea {
    width: 92vw; }
  .news .secCont .newsCont {
    width: 92vw;
    margin-bottom: 8vw; }
    .news .secCont .newsCont .cont .blogPict img {
      max-width: 92vw; }

  .pageNav {
    max-width: 100%;
    padding-top: 18vw; }
    .pageNav div {
      margin: 0 auto;
      width: 100%; }
      .pageNav div a {
        height: 15vw;
        width: 100%; }
      .pageNav div.prev {
        width: 48%; }
        .pageNav div.prev a:before {
          height: 2vw;
          margin-top: -1vw;
          top: 50%;
          left: 3vw;
          width: 2vw; }
      .pageNav div.next {
        width: 48%; }
        .pageNav div.next a:after {
          height: 2vw;
          margin-top: -1vw;
          top: 50%;
          right: 3vw;
          width: 2vw; }

  .pictRowArea {
    display: block; }
    .pictRowArea.reverse .pict {
      margin-bottom: 0; }
    .pictRowArea .detail {
      width: 100%; }
    .pictRowArea .pict {
      margin-bottom: 5vw;
      width: 100%; }

  .titleStyle01 {
    font-size: 160%;
    margin-bottom: 3vw; }

  .titleStyle02 {
    font-size: 140%;
    margin: 0 auto 3vw; }

  table th {
    border-bottom: none;
    display: block;
    padding: 3vw 0 1vw 0;
    width: 100%; }
  table td {
    border-bottom: 1px solid #333;
    display: block;
    padding: 0 0 3vw 0; }
  table tr:first-of-type td {
    border-top: none; }
  table tr:last-of-type th {
    border: none; }

  /******** company ********/
  .outlineTable {
    width: 92vw; }

  /******** contact ********/
  .contactLead dd {
    margin-top: 4vw; }

  .contactForm .keyColor01 {
    color: #ff0000; }
  .contactForm tr {
    display: block;
    margin-bottom: 4vw; }
    .contactForm tr th {
      margin-bottom: 2vw;
      width: 100%; }
      .contactForm tr th.req {
        display: flex; }
        .contactForm tr th.req:after {
          margin-left: 2vw;
          position: relative;
          top: auto;
          right: auto; }
    .contactForm tr td {
      border-left: none;
      border-bottom: 1px dotted #000;
      margin: 0;
      padding-bottom: 4vw;
      padding-left: 0;
      width: 100%; }
      .contactForm tr td input {
        border: 1px solid #ccc; }
        .contactForm tr td input.type01 {
          height: 12vw;
          padding: 0 2vw; }
          .contactForm tr td input.type01:nth-of-type(2) {
            margin-top: 2vw; }
        .contactForm tr td input.type02 {
          height: 12vw;
          margin-left: 10px;
          width: 32vw; }
          .contactForm tr td input.type02:first-of-type {
            margin-right: 5vw; }
      .contactForm tr td textarea {
        height: 35vw; }
      .contactForm tr td.radioButton {
        display: flex;
        flex-wrap: wrap;
        height: auto;
        align-items: center; }
        .contactForm tr td.radioButton label {
          margin: 0 5vw 2vw 0; }
          .contactForm tr td.radioButton label input {
            margin-right: 10px;
            vertical-align: -0.1em; }
  .contactForm .formBtn {
    flex-wrap: wrap;
    margin-top: 8vw; }
    .contactForm .formBtn button {
      font-size: 165%;
      height: 20vw;
      margin: 0 0 8vw;
      width: 92vw;
      background-color: #362519; } }
@media screen and (max-width: 470px) {
  div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fildset, input, textarea, p, blockquote, table, th, td, address {
    font-size: 3.4vw; }

  #index .h205 {
    background: linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 12%, rgba(255, 255, 255, 0.9) 12%, rgba(255, 255, 255, 0.9) 100%), url(../img/index/bg04.jpg) no-repeat 50% 0;
    background-size: 150%; } }