/* ##############################################################################

    COMMON

############################################################################## */
  .ttl_logos {
    column-gap: 32px;
    row-gap: 16px;
  }
  .head1 {
    font-size: 253%;
  }
  .sect_ttl.head1 {
    padding-bottom: 24px;
    font-weight: 700;
  }
  .sect_ttl.head1::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    translate: -50% 0;
    width: 100px;
    height: 1px;
  }
  @media (max-width: 960px) {
    .head1 {
      font-size: 170%;
    }
  }
  @media (max-width: 560px) {
    .head1 {
      font-size: 149%;
    }
  }



/* ##############################################################################

    HEADER

############################################################################## */
  .header-lp {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background-color: rgba(243,244,244,.5);
    padding-top: 16px;
    padding-bottom: 16px;
    padding-left: 64px;
    padding-right: 64px;
    height: auto;
  }
  .header-lp .header--nav,
  .header-lp .hnav_list {
    column-gap: 24px;
  }
  .header-lp .btn-def {
    width: 160px;
  }
  .header-lp .btn-def .line {
    display: none;
  }
  .scrolled .header-lp .logo-wht {
    opacity: 0;
  }
  .scrolled .header-lp .logo-blk {
    opacity: 1;
  }
  @media (max-width: 1600px) {
    .header-lp {
      padding-left: 40px;
      padding-right: 40px;
    }
  }
  @media (max-width: 1400px) {
    .header-lp .logo {
      width: 220px;
    }
    .header-lp .header--nav,
    .header-lp .hnav_list {
      column-gap: 16px;
    }
  }
  @media (max-width: 1200px) {
    .header-lp {
      padding-right: 24px;
      background-color: transparent;
      -webkit-align-items: flex-start;
      -ms-flex-align: start;
      align-items: flex-start;
    }
  }
  @media (max-width: 960px) {
    .header-lp {
      padding-left: 24px;
      padding-right: 20px;
    }
  }
  @media (max-width: 560px) {
    .header-lp {
      padding-left: 16px;
      padding-right: 12px;
    }
  }

/* gnav
*************************************************** */
  @media (min-width: 1201px) {
    .header-lp .gnav_btn {
      display: none;
    }
  }
  @media (max-width: 1200px) {
    .header--nav {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      overflow-y: scroll;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      background-color: #f3f4f4;
      row-gap: 32px;
      padding-left: 24px;
      padding-right: 24px;
      pointer-events: none;
      opacity: 0;
    }
    .header-lp.active .header--nav {
      pointer-events: all;
      opacity: 1;
    }
    .header-lp.active .logo-wht {
      opacity: 0;
    }
    .header-lp.active .logo-blk {
      opacity: 1;
    }
    .hnav_list {
      display: block;
      column-count: 2;
      text-align: center;
      width: 100%;
      column-gap: 16px;
    }
    .hnav_list--item {
      width: 100%;
      margin-top: -1px;
    }
    .hnav_list--item a {
      display: block;
      border-top: 1px solid #fff;
      border-bottom: 1px solid #fff;
      padding-top: 12px;
      padding-bottom: 12px;
    }
    .gnav_btn {
      top: 0;
      right: 0;
    }
  }
  @media (max-width: 560px) {
    .hnav_list {
      column-count: 1;
    }
    .header--nav {
      padding-top: 96px;
      -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
      justify-content: flex-start;
      row-gap: 24px;
    }
  }

/* fix_btns
*************************************************** */
  .fix_cir_btns {
    position: fixed;
    right: 64px;
    bottom: 32px;
    z-index: 100;
    column-gap: 24px;
  }
  .scrolled .fix_cir_btns {
    translate: 32px 0;
  }
  .scrolled.is-bottom .fix_cir_btns {
    opacity: 0;
    translate: 32px 16px;
  }
  .fix_cir_btn {
    width: 180px;
    height: 180px;
    border-radius: 100vmax;
  }
  .fix_cir_btn-contact {
    background-color: #fbb03b;
  }
  .fix_cir_btn .btn_txt {
    row-gap: 16px;
    translate: 0 8px;
  }
  .fix_cir_btn .hov_img {
    height: auto;
  }
  .fix_cir_btn .arrow {
    display: block;
    width: 10px;
    height: 10px;
  }
  .fix_cir_btn .arrow::before {
    border-top-width: 1px;
    border-top-style: solid;
    border-right-width: 1px;
    border-right-style: solid;
    rotate: 45deg;
  }
  @keyframes arrow_mov {
    0% {
      opacity: 1;
      translate: 0 0;
    }
    50% {
      opacity: 0;
      translate: 6px 0;
    }
    51% {
      opacity: 0;
      translate: -6px 0;
    }
    100% {
      opacity: 1;
      translate: 0 0;
    }
  }
  @media (any-hover: hover) {
    .fix_cir_btn-contact:hover {
      background-color: #f97310;
    }
    .fix_cir_btn:hover .arrow {
      animation-duration: 1.4s;
      animation-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
      animation-delay: 0s;
      animation-iteration-count: infinite;
      animation-fill-mode: forwards;
      animation-name: arrow_mov;
    }
  }
  @media (max-width: 1400px) {
    .fix_cir_btns {
      bottom: 24px;
      column-gap: 16px;
      translate: 32px 0;
    }
    .scrolled .fix_cir_btns {
      translate: 0 0;
    }
    .fix_cir_btn {
      width: 158px;
      height: 158px;
    }
    .fix_cir_btn img {
      width: 116px;
    }
  }
  @media (max-width: 960px) {
    .fix_cir_btns {
      width: 100%;
      bottom: 0;
      right: 0;
      column-gap: 0;
      translate: 0 0;
    }
    .fix_cir_btn {
      width: 50%;
      height: 80px;
      border-radius: 0;
    }
    .fix_cir_btn .btn_txt {
      translate: 0 0;
    }
    .fix_cir_btn img {
      width: 220px;
    }
    .fix_cir_btn .arrow {
      display: none;
    }
    .scrolled.is-bottom .fix_cir_btns {
      translate: 0 8px;
    }
  }
  @media (max-width: 560px) {
    .fix_cir_btn {
      height: 50px;
    }
    .fix_cir_btn img {
      width: 180px;
    }
    .scrolled.is-bottom .fix_cir_btns {
      opacity: 1;
    }
  }

/* ##############################################################################

    FOOTER

############################################################################## */
  .foot_catch {
    width: 100%;
  }
  .footer-lp .inner {
    column-gap: 188px;
  }
  .footer-lp .comp_area .logo-slu img {
    width: 314px;
  }
  .footer-lp .comp_area .logo-gaw_nagoya img {
    width: 300px;
  }
  @media (max-width: 1400px) {
    .footer-lp .comp_area .logo-slu img {
      width: 250px;
    }
  }
  @media (max-width: 960px) {
    .footer-lp .comp_area {
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
    }
    .footer-lp .comp_area .logo-slu {
      margin-bottom: 24px;
    }
    .footer-lp .comp_area .logo-gaw_nagoya {
      text-align: center;
    }
    .footer--copyright small {
      order: 9999;
      margin-bottom: 0;
      margin-top: 16px;
    }
  }
  @media (max-width: 768px) {
    .footer-lp .comp_area .logo-slu img {
      width: 180px;
    }
  }


/* ##############################################################################

    PAGE

############################################################################## */

/* hero
*************************************************** */
  .hero {
    margin-bottom: 0 !important;
  }
  .hero--catch {
    top: inherit;
    top: auto;
    bottom: 0;
    left: 0;
    width: 100%;
    transform: none;
    background-color: rgba(243,244,244,.3);
    padding: 48px 64px;
  }
  .hero--catch .ttl {
    font-size: 400%;
  }
  @media (max-width: 1400px) {
    .hero--catch {
      padding: 48px 32px;
    }
    .hero--catch .ttl {
      margin-bottom: 8px;
    }
  }
  @media (max-width: 960px) {
    .hero {
      height: calc(100svh - 80px) !important;
    }
    .hero--catch {
      writing-mode: horizontal-tb;
    }
    .hero--catch .ttl {
      font-size: 286%;
    }
    .hero--catch .head4 {
      font-size: 100%;
    }
  }
  @media (max-width: 560px) {
    .hero {
      height: calc(100svh - 50px) !important;
    }
    .hero--catch {
      padding: 24px 20px;
      background-color: transparent;
    }
    .hero--catch .ttl {
      margin-bottom: 16px;
    }
  }


/* about
*************************************************** */
  .about .inner {
    column-gap: 64px;
  }
  @media (max-width: 1400px) {
    .about .img_area {
      width: 400px;
      max-width: 100%;
    }
  }
  @media (max-width: 1064px) {
    .about .inner {
      row-gap: 40px;
    }
    .about .txt_area {
      width: 100%;
    }
    .about .img_area,
    .about .img_area img {
      width: 100%;
    }
  }

/* home_movs
*************************************************** */
  .home_movs .sect_pdg {
    padding-top: 64px;
  }
  .home_movs .mov_list {
    column-gap: 8px;
  }
  .home_movs .mov_list.v2 .mov_list--item {
    width: calc((100% - 8px*3) / 4);
    padding-top: 13.75%;
  }
  .home_movs .mov_list.v2 .mov_list--item img {
    object-fit: cover;
  }
  @media (max-width: 960px) {
    .home_movs .mov_list.v2 .mov_list--item {
      width: calc((100% - 12px*1) / 2);
      padding-top: 27.25%;
    }
  }
  @media (max-width: 560px) {
    .home_movs .mov_list.v2 .mov_list--item {
      width: calc((100% - 8px*1) / 2);
    }
  }

/* home_insta
*************************************************** */
  .home_insta .frame_wrap {
    padding-top: 0;
    padding-bottom: 0;
  }

/* prlx_img
*************************************************** */
  .prlx-sect {
    height: 42vw;
  }
  .prlx-sect .js-prlx {
    position: relative;
    width: 100%;
    height: 120%;
    top: -10%;
    transform: translate3d(-50%, -50%, 0); /* 初期位置は中央 */
    will-change: transform;
  }
  .prlx-sect-01 .js-prlx {
    background-image: url(../images/lp/exterior/prlx_img-01.jpg);
  }
  .prlx-sect-02 .bg_img {
    background-image: url(../images/lp/exterior/prlx_img-02.jpg);
  }
  @media (max-width: 1064px) {
    .prlx-sect .js-prlx {
      top: -15%;
    }
  }
  @media (max-width: 560px) {
    .prlx-sect .js-prlx {
      top: -20%;
    }
  }

/* reason
*************************************************** */
  .reason_list {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
  .reason_list--item {
    padding-bottom: 24px;
  }
  .reason_list--item .img_area img {
    width: 100%;
  }
  .reason_list--item .txt_area {
    padding-left: 16px;
    padding-right: 16px;
  }
  .reason_list--item .txt_area .head4 {
    min-height: 2.6em;
  }
  @media (max-width: 1920px) {
    .reason_list--item .txt_area .head4 {
      font-size: 133%;
    }
  }
  @media (max-width: 1740px) {
    .reason_list--item .txt_area .head4 {
      font-size: 120%;
    }
  }
  @media (max-width: 1600px) {
    .reason_list--item {
      width: calc((100% - 32px*2) / 3);
    }
    .reason_list--item .img_area img {
      width: 100%;
    }
    .reason_list--item .txt_area .head4 {
      font-size: 133%;
    }
  }
  @media (max-width: 960px) {
    .reason_list {
      gap: 16px;
    }
    .reason_list--item {
      width: calc((100% - 16px*2) / 3);
    }
    .reason_list--item .txt_area .head4 {
      font-size: 109%;
    }
  }
  @media (max-width: 800px) {
    .reason_list {
      -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
      justify-content: flex-start;
    }
    .reason_list--item {
      width: calc((100% - 16px*1) / 2);
    }
  }
  @media (max-width: 560px) {
    .reason_list--item {
      width: 100%;
    }
    .reason_list--item .txt_area .head4 {
      font-size: 120%;
      min-height: auto;
    }
  }

/* price_plan
*************************************************** */
  .price_plan_tabs {
    column-gap: 32px;
  }
  .price_plan_tab {
    padding: 12px 28px;
    cursor: pointer;
  }
  .price_plan_list::before {
    width: 100vw;
    left: 50%;
    translate: -50% 0;
  }
  .price_plan_list--item .item--in {
    padding-top: 32px;
    padding-bottom: 32px;
    column-gap: 64px;
  }
  .price_plan_list--item .img_area {
    width: 640px;
    max-width: 50%;
  }
  .price_plan_list--item .txt_area {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  .price_plan_list--item .desc {
    padding-top: 20px;
    padding-bottom: 20px;
    border-top-width: 1px;
    border-top-style: solid;
    border-bottom-width: 1px;
    border-bottom-style: solid;
  }
  .price_plan_list .slick-list,
  .price_plan_list .slick-track {
    overflow: visible;
  }
  .price_plan_list .slick-track {
    display: flex;
  }
  .price_plan_list .slick-slide {
    height: auto !important;
  }
  .price_plan .plan-slider__main-item .plan-slider__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .price_plan .plan-slider__nav {
    gap: 8px;
  }
  .price_plan .plan-slider__main-item {
    width: 100%;
    height: 395px !important;
  }
  .price_plan .plan-slider__nav-item {
    width: calc((100% - 8px*3) / 4);
    padding-top: 16.666%;
  }
  .price_plan .price-plan__slider .img-hor {
    object-fit: cover;
  }
  .price_plan .price-plan__slider .img-ver {
    object-fit: contain;
  }
  .price_plan .attn_list {
    column-gap: 16px;
  }
  .price_plan_tab::before {
    transform: translateX(-110%);
    animation-duration: .4s;
    animation-timing-function: cubic-bezier(0.86,0,0.07,1);
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-name: slide-rev_rgt;
  }
  .price_plan_tab::after {
    z-index: -10;
  }
  .price_plan_tab.is-active::before {
    animation-name: slide-to_rgt;
    opacity: 1;
  }
  .price_plan_tab.is-active .head4 {
    color: #fff;
    opacity: 1;
  }
  @media (any-hover: hover) {
    .price_plan_tab:hover::after {
      opacity: .5;
    }
    .price_plan .plan-slider__nav-item:hover .plan-slider__nav-img {
      scale: 1.025;
      opacity: .6;
    }
  }
  @media (max-width: 1400px) {
    .price_plan .plan-slider__main-item {
      height: 28vw !important;
    }
  }
  @media (max-width: 960px) {
    .price_plan_tabs {
      column-gap: 16px;
    }
    .price_plan_tab {
      padding: 12px 8px;
      text-align: center;
      width: calc((100% - 16px*2) / 3);
      word-break: keep-all;
    }
    .price_plan_tab .head4 {
      font-size: 100%;
    }
    .price_plan_list--item .img_area {
      margin-left: auto;
      margin-right: auto;
      max-width: 100%;
    }
    .price_plan .plan-slider__main-item {
      height: 52vw !important;
    }
  }
  @media (max-width: 768px) {
    .price_plan .plan-slider__main-item {
      height: 60vw !important;
    }
  }

/* work
*************************************************** */
  .work .posts-work {
    gap: 8px;
  }
  .work .posts-work .post {
    width: calc((100% - 8px*3) / 4);
  }
  .work .posts-work {
    width: 100%;
    max-width: 100%;
  }
  @media (max-width: 960px) {
    .work .posts-work .post {
      width: calc((100% - 8px*2) / 3);
    }
  }
  @media (max-width: 560px) {
    .work .posts-work .post {
      width: calc((100% - 8px*1) / 2);
    }
  }

/* area
*************************************************** */
  .area .area_detail {
    column-gap: 64px;
  }
  .area .txt_area .area_txt {
    word-break: keep-all;
    overflow-wrap: anywhere;
  }
  .area .txt_area .attn_list {
    margin-top: auto;
  }
  @media (max-width: 960px) {
    .area .img_area {
      margin-bottom: 40px;
    }
  }
  @media (max-width: 560px) {
    .area .img_area {
      margin-bottom: 24px;
    }
  }

/* faq
*************************************************** */
  .faq_list {
    column-count: 2;
    column-gap: 32px;
  }
  .faq_list--item {
    margin-top: -1px;
    padding-top: 28px;
    padding-bottom: 28px;
    padding-left: 16px;
    padding-right: 16px;
    border-top-width: 1px;
    border-top-style: solid;
    border-bottom-width: 1px;
    border-bottom-style: solid;
  }
  .faq_list--item .faq_txts {
    column-gap: 6px;
  }
  .faq_list--item .num {
    width: 44px;
  }
  .faq_list--item .txt {
    margin-top: 5px;
  }
  @media (max-width: 1400px) {
    .faq_list--item {
      padding-top: 20px;
      padding-bottom: 20px;
    }
    .faq_list--item .num {
      width: 32px;
    }
  }
  @media (max-width: 960px) {
    .faq_list {
      column-count: 1;
    }
    .faq_list--item .txt {
      margin-top: 1px;
    }
  }
  @media (max-width: 560px) {
    .faq_list--item {
      padding-left: 0;
      padding-right: 0;
    }
  }

/* company
*************************************************** */
  .company .img__txts {
    column-gap: 64px;
  }
  .company .img_area {
    position: absolute;
    top: 0;
    left: calc((100vw - 100%) / -2);
    width: calc(50% + (100vw - 100%) / 2 - 138px);
    height: 100%;
  }
  .company .img_area .bg_img {
    background-image: url(../images/lp/exterior/company_img@2x.jpg);
  }
  .company .txt_area {
    padding-left: 566px;
  }
  @media (min-width: 1920px) {
    .company .img_area {
      left: calc((1920px - 100%) / -2);
      width: calc(50% + (1920px - 100%) / 2 - 138px);
    }
  }
  @media (max-width: 1280px) {
    .company .img_area {
      position: relative;
      width: 80%;
      padding-top: 52%;
      left: auto;
      left: inherit;
      margin-left: auto;
      margin-right: auto;
      margin-bottom: 56px;
    }
    .company .txt_area {
      padding-left: 0;
    }
  }
  @media (max-width: 560px) {
    .company .img_area {
      width: 100%;
      margin-bottom: 32px;
      padding-top: 65%;
    }
  }

