@charset "UTF-8";

@media all {

  .mv-1 img,
  .mv-2 img {
    width: 100%;
    object-fit: cover;
  }
}

@media screen and (max-width: 768px) {
  .site-main {
    margin-top: 18.23vw;
  }

  .main-visual {
    display: flex;
    flex-direction: column-reverse;
  }

  .mv-1 {
    margin-top: 1.25vw;
  }

  .mv-1 img,
  .mv-2 img {
    height: calc(20.83vw - .5px);
  }

  .mv-1 img {
    object-position: 75% center;
  }

  .mv-2 img {
    object-position: 14% center;
  }
}

@media print,
(min-width: 769px) {
  .site-main {
    margin-top: 157px;
  }

  .main-visual {
    position: relative;
    margin: 0 auto;
    max-width: 1280px;
    min-height: 400px;
    max-height: 557px;
    height: calc(100vh - 157px);
  }

  .mv-1 img,
  .mv-2 img {
    height: 178px;
  }

  .mv-2 {
    margin-top: 10px;
  }

  .scroll {
    position: absolute;
    bottom: 40px;
    left: calc(50% - 20px);
    width: 39px;
    height: 7px;
  }

  .scroll::before,
  .scroll::after {
    content: '';
    position: absolute;
    top: 0;
    left: calc(50% - 2px);
    width: 0;
    height: 14px;
    box-shadow: 0 0 1px #fff;
    border-left: 1px solid #9F9F95;
    animation: fuwa .75s linear infinite;
    transform-origin: bottom center;
  }

  .scroll::before {
    transform: rotate(40deg);
  }

  .scroll::after {
    transform: rotate(-40deg);
  }

  @keyframes fuwa {
    0% {
      top: -6px;
    }

    50% {
      top: 0;
    }

    100% {
      top: -6px;
    }
  }
}



/* concept */
@media screen and (max-width: 768px) {
  .concept-ttl {
    margin-top: 18.2292vw;
    width: 23.9583vw;
  }
  .concept-copy,
  .concept-text,
  .concept-img {
    margin-top: 15.625vw;
  }
  .concept-text {
    width: 72.917vw;
  }
  .concept-ttl img,
  .concept-text img {
    width: 100%;
  }
}

@media print,
(min-width: 769px) {
  #concept {
    margin-top: 100px;
  }

  .concept-content {
    display: flex;
    justify-content: space-between;
    margin-top: 90px;
  }

  .concept-text {
    margin-top: 80px;
  }

  .concept-img {
    width: 319px;
  }
}


/* works */
@media all {
  .slick-dots li button::before {
    content: '';
    border: 1px solid #9F9F95;
    border-radius: 50%;
    opacity: 1;
  }

  .slick-dots li.slick-active button:before {
    background-color: #9F9F95;
  }
  .works-all {
    position: absolute;
  }
}

@media screen and (max-width: 768px) {
  #works {
    margin-top: 54.6875vw;
  }
  .works-ttl {
    width: 18.49vw;
  }
  .works-ttl img {
    width: 100%;
  }
  .works-content {
    position: relative;
    margin-top: 7.8125vw;
  }

  .slick-dots {
    display: flex;
    justify-content: space-between;
    bottom: -7.8125vw;
    left: calc(50% - 11.3932vw);
    width: 22.7865vw;
  }
  .slick-dots li {
    margin: 0;
    width: 2.9948vw;
    height: 2.9948vw;
  }

  .slick-dots li button {
    width: 2.9948vw;
    height: 2.9948vw;
    padding: 0;
  }

  .slick-dots li button::before {
    width: 2.9948vw;
    height: 2.9948vw;
  }

  .slick-dotted.slick-slider {
    margin-bottom: 9.1145vw;
  }
  .works-all {
    bottom: -7.8125vw;
    right: 0;
    width: 12vw;
  }
  .works-all img {
    width: 100%;
  }
}

@media print,
(min-width: 769px) {
  #works {
    margin-top: 240px;
  }

  .works-content {
    margin-top: 40px;
    max-height: 558px;
    overflow: hidden;
  }

  .slick-dots {
    display: flex;
    justify-content: space-between;
    bottom: -45px;
    width: 50px;
  }

  .slick-dots li {
    margin: 0;
    width: 10px;
  }

  .slick-dots li button {
    width: 10px;
    height: 10px;
    padding: 0;
  }

  .slick-dots li button::before {
    width: 8px;
    height: 8px;
  }

  .slick-dotted.slick-slider {
    margin-bottom: 40px;
  }
  .works-all {
    bottom: 5px;
    right: 20px;
  }

}

/* profile */
@media all {
  .profile-list {
    display: flex;
    flex-wrap: wrap;
    line-height: 2;
  }

  .profile-list dt {
    font-weight: bold;
    color: #999999;
  }

  .profile-list dd {
    color: #4A4A4A;
  }

  .business {
    list-style: decimal;
    margin-left: 1.3em;
  }
}

@media screen and (max-width: 768px) {
  #profile {
    margin-top: 54.6875vw;
  }
  .profile-ttl {
    width: 21.484375vw;
  }
  .profile-ttl img {
    width: 100%;
  }
  .profile-content {
    margin-top: 14.625vw;
    font-size: 3.3854vw;
    line-height: 2;
  }
  .profile-list dt,
  .profile-list dd {
    margin-bottom: 9vw;
  }
  .profile-list dt {
    width: 27%;
  }
  .profile-list dd {
    width: 73%;
  }
}
@media print,
(min-width: 769px) {
  #profile {
    margin-top: 240px;
  }

  .profile-content {
    margin-top: 90px;
    font-size: 14px;
  }

  .profile-list dt,
  .profile-list dd {
    margin-bottom: 30px;
  }

  .profile-list dt {
    width: 158px;
  }

  .profile-list dd {
    width: calc(100% - 158px);
  }

  .business {
    margin-top: 30px;
  }
}


/* access */
@media all {
  .access-content {
    line-height: 1.8714;
  }

  address {
    font-style: normal;
    color: #9F9F95;
  }

  .pc-right {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .station {
    color: #4A4A4A;
  }
}

@media screen and (max-width: 768px) {
  #access {
    margin-top: 41.5vw;
  }
  .access-ttl {
    width: 16.27vw;
  }
  .access-ttl img {
    width: 100%;
  }
  .access-content {
    margin-top: 13vw;
    font-size: 3.125vw;
  }
  address img {
    width: 74.6vw;
  }
  .access_map {
    display: block;
    margin-top: 8vw;
    width: 94.7368vw;
  }
  
  .station:first-of-type {
    margin-top: 5vw;
  }
  .googlemap_link img {
    width: 16.0183vw;
    min-width: 70px;
  }
}

@media print,
(min-width: 769px) {
  #access {
    margin-top: 200px;
  }

  .access-content {
    display: flex;
    justify-content: space-between;
    margin-top: 60px;
    font-size: 14px;
  }
  .pc-left {
    width: 326px;
  }
  .pc-right {
    width: 488px;
  }
  .access_image {
    display: block;
    margin-top: 70px;
    width: 283px;
  }

  .station:first-of-type {
    margin-top: 20px;
  }
}


/* recruit */
@media all {
  .recruit-list {
    display: flex;
    flex-wrap: wrap;
  }

  .recruit-list dt,
  .recruit-list dd {
    border-top: 1px solid rgba(159, 159, 149, .25);
    line-height: 2;
  }

  .recruit-list dt {
    font-weight: bold;
    color: #999999;
  }

  .recruit-list dd {
    color: #4A4A4A;
  }
}

@media screen and (max-width: 768px) {
  #recruit {
    margin-top: 53.385vw;
  }
  .recruit-ttl {
    width: 18.5vw;
  }
  .recruit-copy {
    margin-top: 15.625vw;
    width: 88.02vw;
  }
  .recruit-text {
    margin-top: 13.02vw;
    width: 80.729vw;
  }
  .recruit-ttl img,
  .recruit-copy img,
  .recruit-text img {
    width: 100%;
  }
  .recruit-list {
    margin-top: 13.02vw;
    font-size: 3.3854vw;
  }
  .recruit-list dt {
    width: 27%;
  }
  .recruit-list dd {
    width: 73%;
  }
  .recruit-list dt,
  .recruit-list dd {
    padding: 4vw 0;
  }
  .recruit-img {
    margin-top: 10vw;
  }
}

@media print,
(min-width: 769px) {
  #recruit {
    margin-top: 200px;
  }

  .recruit-copy {
    margin-top: 60px;
  }

  .recruit-text {
    margin-top: 60px;
  }

  .recruit-list {
    margin-top: 60px;
  }

  .recruit-list dt,
  .recruit-list dd {
    font-size: 14px;
    padding: 32px 0;
  }

  .recruit-list dt {
    width: 195px;
  }

  .recruit-list dd {
    width: calc(100% - 195px);
  }

  .recruit-img {
    margin-top: 40px;
  }
}


/* contact */
@media all {
  #contact {
    background-color: rgba(159, 159, 149, .30);
  }

  .contact-type {
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid #fff;
  }

  .contact-type dt {
    font-weight: bold;
    color: #4A4A4A;
    line-height: 1.625;
  }

  .contact-type dd {
    line-height: 2;
  }
}

@media screen and (max-width: 768px) {
  #contact {
    margin-top: 54.6875vw;
    padding: 15.625vw 0 33.4635vw;
    width: 100%;
  }
	.contact-inner {
		margin: 0 auto;
		width: 89.5833vw;
	}
  .contact-ttl {
    width: 20.18vw;
  }
  .contact-ttl img {
    width: 100%;
  }
  .contact-type {
    margin-top: 8.4635vw;
  }
  .contact-type dt {
    width: 100%;
    padding: 6vw 0;
    font-size: 3.6458vw;
  }
  .contact-type dd {
    width: 100%;
    padding-bottom: 6vw;
    border-bottom: 1px solid #fff;
    font-size: 3.31vw;
  }
}

@media print,
(min-width: 769px) {
  #contact {
    width: 100%;
  }

  .contact-inner {
    margin: 240px auto 0;
    padding: 120px 20px;
    width: 900px;
  }

  .contact-content {
    margin-top: 60px;
  }

  .contact-type dt,
  .contact-type dd {
    border-bottom: 1px solid #fff;
  }

  .contact-type dt {
    width: 240px;
  }

  .contact-type dd {
    width: calc(100% - 240px);
    font-size: 14px;
  }

  .contact-type dt,
  .contact-type dd {
    padding: 26px 0;
  }
}





/*** contact form ***/
@media all {
  .form {
    position: relative;
    margin: 0 auto;
  }
  .form-notice span {
    color: #FF0000;
  }
  
  .form input,
  .form select,
  .form textarea {
    box-sizing: border-box;
    width: 100%;
    border: none;
    outline: none;
    background-color: #fff;
  }
  
  .form input:focus,
  .form select:focus,
  .form textarea:focus {
    outline: none;
    border-radius: 4px;
  }
  dd.select {
    position: relative;
  }
  dd.select::after {
    content: '';
    position: absolute;
    top: calc(50% - .25em);
    right: 1.25em;
    display: block;
    width: .75em;
    height: .75em;
    background: center / contain no-repeat url(../img/top/select_arrow-sp.svg);
  }
  
  .form textarea {
    resize: vertical;
    height: 5em;
  }
  
  .form dt.required::after {
    content: '＊';
    display: inline-block;
    color: #FF0000;
    font-size: .5em;
    transform: translateY(-.5em);
  }
  
  .button-form_check {
    position: relative;
    z-index: 1;
    display: block;
    margin: 0 auto;
    border: 1px solid #9F9F95;
    padding: 0;
    width: 260px;
    height: 40px;
    background: center / cover no-repeat url(../img/top/btn-send-on.svg);
    cursor: pointer;
  }
  
  .button-form_check img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 1;
    transition: .3s;
  }
  .button-form_check:hover img {
    opacity: 0;
  }
  
  .checking {
    overflow: hidden;
  }
  
  .form-check {
    width: 0;
    height: 0;
    opacity: 0;
    overflow: hidden;
    transition: .3s opacity, .3s background;
  }
  
  .checking .form-check {
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    width: 100%;
    min-width: 320px;
    height: 100vh;
    background: rgba(0, 0, 0, .7);
    opacity: 1;
    overflow-x: scroll;
    z-index: 9999;
  }
  
  .checking .check-inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 20px 0;
    padding: 0 20px;
    width: 90%;
    max-width: 640px;
    background: #fff;
  }
  
  .checking .check-inner .notice {
    padding: 20px 0;
    width: 100%;
    color: #4A4A4A;
    text-align: center;
  }
  
  .checking .check-inner .notice span {
    display: inline-block;
  }
  
  .checking .check-list {
    max-height: 60vh;
    padding-bottom: 32px;
    overflow-y: scroll;
  }
  
  .checking .check-list-outer {
    position: relative;
  }
  
  .checking .check-list-outer::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 32px;
    background: linear-gradient(to top, #fff, rgba(255, 255, 255, 0));
  }
  
  .checking .check-list>dl {
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    padding: 10px 0 0;
    max-width: 500px;
  }
  
  .checking .check-inner .inquiry-list {
    margin: 0;
    padding: 32px 40px 32px;
  }
  
  .form-check .submit {
    display: flex;
    justify-content: space-around;
    padding: 40px 0;
    background-color: #fff;
    max-width: 640px;
  }
  
  .form-check .return {
    display: block;
    width: 100%;
    max-width: 200px;
    font-size: 14px;
    border: 1px solid #dadada;
    cursor: pointer;
    background: center / cover no-repeat url(../img/top/btn-back-on.svg);
  }
  .form-check .return img {
    vertical-align: top;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity .3s;
  }
  
  .form-check .return:hover img {
    opacity: 0;
  }
  
  .form-check .button-form_check {
    margin: 0;
  }
  
  .form-sent {
    position: relative;
    display: none;
    padding-bottom: 80px;
  }
  
  .form-accordion-opener {
    border: 1px solid #9F9F95;
    background-color: #9F9F95;
    color: #fff;
    font-size: 14px;
    text-align: center;
    cursor: pointer;
    transition: .3s;
  }
  .form-accordion-opener:hover {
    color: #9F9F95;
    background-color: #fff;
  }

  #dispmsg {
    text-align: center;
  }
}

/* sp */
@media only screen and (max-width: 768px) {
  #dispmsg {
    margin: 7vw auto;
    font-size: 3vw;
  }
  .form {
    padding-top: 3vw;
    font-size: 3.5714vw;
  }
  .form-notice {
    font-size: 2.604vw;
    text-align: right;
  }
  .form input,
  .form textarea,
  .form select {
    padding-left: .5em;
    padding-right: .5em;
    height: 10.4167vw;
    border-radius: max(.82418vw, 3px);
  }
  .form textarea {
    height: 28.6458vw;
  }

  .form dt {
    margin-top: 6vw;
    color: #4A4A4A;
    font-weight: bold;
    letter-spacing: .125em;
  }
  .form dd {
    margin-top: 1vw;
  }

  .button-form_check {
    margin-top: 12vw;
    width: 59.896vw;
    height: 10.4167vw;
  }
  .button-form_check img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .check-inner {
    height: 95vh;
  }

  .form-check .check-list>dl {
    flex-direction: column;
  }

  .form-check .check-list dd+dt {
    margin-top: .25em;
    padding-top: .25em;
    border-top: 1px solid #9F9F95;
  }
  .form-check .check-list dd {
    margin-top: .25em;
  }

  .form-check .submit {
    flex-direction: column-reverse;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
  }

  .form-check .button-form_check {
    width: 50%;
    height: 8vw;
    margin-top: 20px;
    color: #fff;
  }

  .form-check .return {
    margin-top: 4vw;
    width: 40%;
    height: 6vw;
  }

  .checking .check-list {
    max-height: 50vh;
  }
  .checking .check-list-outer::after {
    height: 6vw;
  }
  .form-sent {
    padding-bottom: 0;
  }

  .form-accordion-opener {
    margin: 12vw auto;
    width: 70vw;
    font-size: 3vw;
  }
}

/* pc */
@media print,
(min-width: 769px) {
  .form {
    margin-top: 80px;
  }

  .form dl {
    display: flex;
    flex-wrap: wrap;
    font-size: 14px;
  }
  .form dt {
    padding-top: 12px;
    width: 240px;
  }
  .form dd {
    width: calc(100% - 240px);
  }
  .form dt,
  .form dd {
    margin-top: 32px;
  }

  .form input,
  .form select,
  .form textarea {
    padding-left: 14px;
    padding-right: 16px;
    height: 50px;
    border-radius: 4px;
  }
  dd.select::after {
    top: calc(50% - 4px);
    width: 14px;
    height: 11px;
    background: center / contain no-repeat url(../img/top/select_arrow-pc.svg);
  }
  .form textarea {
    padding-top: 14px;
    padding-bottom: 14px;
    height: 220px;
  }
  .form-notice {
    font-size: 10px;
    text-align: right;
  }

  .form-accordion .button-form_check {
    margin-top: 50px;
  }
  
  .form-accordion-opener {
    margin: 120px auto;
    width: 300px;
    font-size: 14px;
  }

  .form-check .check-list>dl>dt {
    margin-top: 0;
    padding-right: 20px;
    width: 200px;
  }

  .form-check .check-list>dl>dd {
    margin-top: 0;
    padding-top: 12px;
    width: calc(100% - 200px);
  }

  .form-check .check-list>dl>*:nth-child(n+3) {
    margin-top: 1em;
    padding-top: calc(1em - 2px);
    border-top: 1px solid #9F9F95;
  }

  .form-check .submit {
    align-items: center;
  }

  .form-check .button-form_check {
    width: 200px;
  }

  .form-check .return {
    margin-right: 10px;
    width: 200px;
    height: 40px;
  }

  #dispmsg {
    font-size: 14px;
  }
}