@charset "UTF-8";
/*! Writen  by SCSS */
.title_wrap {
  display: flex;
  flex-direction: column;
  margin-bottom: clamp(30px, 4.167vw, 50px); }
  .title_wrap .sec_ttl + .read {
    margin-top: clamp(30px, 4.167vw, 50px); }
    @media screen and (max-width: 480px) {
      .title_wrap .sec_ttl + .read {
        margin-top: 20px; } }

.sec_ttl {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 10px;
  font-size: clamp(60px, 6.876vw, 110px); }
  @media screen and (max-width: 480px) {
    .sec_ttl {
      row-gap: 4px;
      font-size: 9.2vw; } }
  .sec_ttl .jp {
    font-size: clamp(14px, 1.125vw, 18px); }
    .sec_ttl .jp.white {
      color: #FFF; }
  .sec_ttl .big {
    line-height: 1.3; }

.read {
  font-size: clamp(15px, 1.5vw, 18px);
  line-height: 2.22; }
  @media screen and (max-width: 480px) {
    .read {
      line-height: 1.8; } }
  .read.white {
    color: #FFF; }

/*
.title_group{
	position: relative;
	overflow: hidden;
	margin-bottom:clamp_gm(40,1600,70);
	transform:translateX(-100%);
	transition:0.5s transform ease-in-out 0s;
	&.p-view{
		transform:translateX(0%);
		.title_wrap{
			transform:translateX(0%);
		}
	}
	&:before{
		content:"";
		position: absolute;
		inset:0;
		left:auto;
		width: cal_per(1600,1400);
		width: 100%;
		@include mq($br_sp){
			width: 100%;
		}
	}
	.title_wrap{
		transform:translateX(100%);
		transition:0.5s transform ease-in-out 0s;
		padding:clamp_gm(30,1600,50) 20px;
		margin-bottom:0;
		background: linear-gradient(to right, #3283c5 0%,#0060af 100%);
		@include mq($br_air){
			padding:25px 20px;
		}
		@include mq($br_sp){
			padding:20px 10px;
		}
		.title_in{
			position: relative;
			display: flex;
			align-items:center;
			justify-content: center;
			.sec_ttl{
				color:#FFF;
				position: relative;
				@include mq($br_sp){

				}
				.en{
					line-height: 0.85;
				}
			}

			.read{
				margin-top: 0;
				@include mq($br_sp){
					width: 100%;
					padding-top:15px;
					margin-top: 15px;
					border-top: 1px solid #FFF;
				}
				.small{
					display:block;
					font-size: 80%;
				}
			}
		}
	}
}
*/
.event_area {
  padding: clamp(80px, 11.667vw, 140px) 0 clamp(80px, 10vw, 120px); }
  @media screen and (max-width: 480px) {
    .event_area {
      padding: 60px 0 80px; } }
  .event_area .title_band {
    position: relative;
    padding-top: 50px; }
    @media screen and (max-width: 820px) {
      .event_area .title_band {
        padding-top: 20px; } }
    .event_area .title_band.p-view:before {
      clip-path: inset(0 0 0 0); }
    .event_area .title_band.p-view .title_group {
      visibility: visible;
      transform: translateX(0%); }
      .event_area .title_band.p-view .title_group .title_wrap {
        transform: translateX(0%); }
    .event_area .title_band:before {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      height: 85%;
      background: linear-gradient(140deg, #1e5ca9, #4589dc);
      clip-path: inset(0 0 0 100%);
      transition: 0.8s clip-path ease-in-out 0s; }
    .event_area .title_band .title_group {
      width: 87.5%;
      visibility: hidden;
      position: relative;
      overflow: hidden;
      margin-bottom: clamp(40px, 4.375vw, 70px);
      transform: translateX(-101%);
      transition: 0.5s transform ease-in-out 0.3s; }
      .event_area .title_band .title_group.left {
        margin-left: auto; }
      @media screen and (max-width: 820px) {
        .event_area .title_band .title_group {
          width: calc(100% - 30px); } }
      @media screen and (max-width: 480px) {
        .event_area .title_band .title_group {
          width: calc(100% - 20px); } }
      .event_area .title_band .title_group:before {
        content: "";
        position: absolute;
        inset: 0;
        left: auto;
        width: 87.5%;
        width: 100%; }
        @media screen and (max-width: 480px) {
          .event_area .title_band .title_group:before {
            width: 100%; } }
      .event_area .title_band .title_group .title_wrap {
        transform: translateX(101%);
        transition: 0.5s transform ease-in-out 0.3s;
        padding: clamp(30px, 3.125vw, 50px) 0;
        padding-left: clamp(30px, 3.125vw, 50px);
        margin-bottom: 0;
        background: linear-gradient(140deg, #000000, #525252); }
        @media screen and (max-width: 480px) {
          .event_area .title_band .title_group .title_wrap {
            padding: 20px 10px 20px 20px; } }
        .event_area .title_band .title_group .title_wrap .title_in {
          position: relative;
          display: flex;
          align-items: center; }
          @media screen and (max-width: 480px) {
            .event_area .title_band .title_group .title_wrap .title_in {
              flex-direction: column;
              align-items: flex-start; } }
          .event_area .title_band .title_group .title_wrap .title_in .sec_ttl {
            color: #FFF;
            position: relative;
            align-items: flex-start;
            padding-right: clamp(30px, 4.167vw, 50px);
            margin-right: clamp(30px, 4.167vw, 50px);
            border-right: 1px solid #FFF; }
            @media screen and (max-width: 480px) {
              .event_area .title_band .title_group .title_wrap .title_in .sec_ttl {
                padding-right: 0;
                margin-right: 0;
                border-right: none;
                flex-direction: row;
                column-gap: 10px;
                align-items: center; } }
            .event_area .title_band .title_group .title_wrap .title_in .sec_ttl .en {
              line-height: 0.85; }
          .event_area .title_band .title_group .title_wrap .title_in .read {
            margin-top: 0; }
            @media screen and (max-width: 480px) {
              .event_area .title_band .title_group .title_wrap .title_in .read {
                width: 100%;
                padding-top: 15px;
                margin-top: 15px;
                border-top: 1px solid #FFF; } }
            .event_area .title_band .title_group .title_wrap .title_in .read .small {
              display: block;
              font-size: 80%; }
  .event_area .event_slide_wrap {
    position: relative; }
    @media screen and (max-width: 768px) {
      .event_area .event_slide_wrap {
        padding-left: 20px; } }
    @media screen and (max-width: 480px) {
      .event_area .event_slide_wrap {
        padding-left: 0; } }
    @media screen and (max-width: 768px) {
      .event_area .event_slide_wrap .event_slide {
        overflow: visible; } }
    .event_area .event_slide_wrap .event_slide .swiper-slide {
      width: auto; }
      @media screen and (max-width: 768px) {
        .event_area .event_slide_wrap .event_slide .swiper-slide {
          width: 300px; } }
      @media screen and (max-width: 480px) {
        .event_area .event_slide_wrap .event_slide .swiper-slide {
          width: 70vw; } }
      .event_area .event_slide_wrap .event_slide .swiper-slide .event_ttl {
        font-size: clamp(12px, 1.667vw, 20px);
        display: flex;
        border-bottom: 1px solid #000;
        margin: 20px 0 30px;
        width: fit-content; }
        @media screen and (max-width: 768px) {
          .event_area .event_slide_wrap .event_slide .swiper-slide .event_ttl {
            margin: 10px 0 20px;
            font-size: 2.4vw; } }
        @media screen and (max-width: 480px) {
          .event_area .event_slide_wrap .event_slide .swiper-slide .event_ttl {
            font-size: 5vw; } }
      .event_area .event_slide_wrap .event_slide .swiper-slide .event_label {
        display: flex;
        justify-content: flex-start;
        column-gap: 10px; }
        .event_area .event_slide_wrap .event_slide .swiper-slide .event_label .label_txt {
          font-size: clamp(12px, 1.167vw, 14px);
          padding: 5px 10px;
          line-height: 1; }
          @media screen and (max-width: 768px) {
            .event_area .event_slide_wrap .event_slide .swiper-slide .event_label .label_txt {
              font-size: 14px; } }
          .event_area .event_slide_wrap .event_slide .swiper-slide .event_label .label_txt.label01 {
            background: #666;
            color: #FFF; }
          .event_area .event_slide_wrap .event_slide .swiper-slide .event_label .label_txt.label02 {
            border: 1px solid #000;
            color: #666; }
      .event_area .event_slide_wrap .event_slide .swiper-slide .event_txt {
        font-size: clamp(13px, 1.334vw, 16px);
        margin-top: 15px; }
        @media screen and (max-width: 768px) {
          .event_area .event_slide_wrap .event_slide .swiper-slide .event_txt {
            font-size: 15px; } }
    .event_area .event_slide_wrap .slide_arrow_wrap {
      margin-top: 40px;
      pointer-events: none; }
      @media screen and (max-width: 480px) {
        .event_area .event_slide_wrap .slide_arrow_wrap {
          position: absolute;
          inset: 0;
          bottom: auto;
          top: 22%;
          max-width: 100%;
          width: calc(100% - 40px);
          margin: 0 auto; } }
      .event_area .event_slide_wrap .slide_arrow_wrap .swiper-button-prev,
      .event_area .event_slide_wrap .slide_arrow_wrap .swiper-button-next {
        pointer-events: all; }
  .event_area .arrow_btn {
    margin-top: 60px; }
    @media screen and (max-width: 480px) {
      .event_area .arrow_btn {
        margin-top: 40px;
        transform: translateX(-10px); } }
  .event_area .other_event_group {
    margin-top: clamp(60px, 8.334vw, 100px);
    background: #eee;
    width: 44.17%; }
    @media screen and (max-width: 480px) {
      .event_area .other_event_group {
        width: 100%;
        max-width: 260px;
        margin: 50px auto 0; } }
    @media screen and (max-width: 480px) {
      .event_area .other_event_group .other_event_in {
        flex-direction: column; } }
    .event_area .other_event_group .other_event_in .other_ttl {
      flex-grow: 1;
      font-size: clamp(30px, 4.616vw, 60px);
      color: #FFF;
      text-align: center;
      background: linear-gradient(140deg, #000000, #525252);
      padding: 20px; }
      @media screen and (max-width: 480px) {
        .event_area .other_event_group .other_event_in .other_ttl {
          width: 100%;
          font-size: 8vw;
          padding: 15px 10px; } }
      .event_area .other_event_group .other_event_in .other_ttl .small {
        display: block;
        font-size: 70%; }
        @media screen and (max-width: 480px) {
          .event_area .other_event_group .other_event_in .other_ttl .small {
            display: inline-block;
            margin-right: 10px; } }
    .event_area .other_event_group .other_event_in .other_group {
      width: 56.61%;
      padding: 20px;
      justify-content: center;
      max-width: 860px;
      margin: 0 auto; }
      @media screen and (max-width: 480px) {
        .event_area .other_event_group .other_event_in .other_group {
          padding: 15px;
          width: 100%;
          justify-content: space-between;
          flex-direction: column; } }
      .event_area .other_event_group .other_event_in .other_group .other_link {
        display: flex;
        column-gap: 20px;
        align-items: center;
        /*&:nth-of-type(1){
        	padding-right:cal_per(860,30);
        	margin-right: cal_per(860,30);
        	border-right:1px solid #aaa;
        	@include mq($br_sp){
        		padding-right:0;
        		margin-right: 0;
        		border-right:none;
        		padding-bottom:15px;
        		margin-bottom: 15px;
        		border-bottom:1px solid #aaa;
        	}
        }*/ }
        @media screen and (max-width: 480px) {
          .event_area .other_event_group .other_event_in .other_group .other_link {
            width: 100%;
            justify-content: space-between; } }
        body:not(.mobile) .event_area .other_event_group .other_event_in .other_group .other_link:hover .circle {
          background: #333;
          color: #FFF; }
          body:not(.mobile) .event_area .other_event_group .other_event_in .other_group .other_link:hover .circle span {
            transform: translateX(4px); }
        .event_area .other_event_group .other_event_in .other_group .other_link .circle {
          background: #FFF;
          width: clamp(30px, 3.834vw, 46px);
          aspect-ratio: 1;
          display: flex;
          justify-content: center;
          align-items: center;
          border-radius: 50vw;
          color: #333;
          line-height: 1;
          transition: 0.3s all ease-in-out 0s; }
          .event_area .other_event_group .other_event_in .other_group .other_link .circle span {
            display: block;
            font-size: clamp(12px, 1.334vw, 16px);
            transition: 0.3s transform ease-in-out 0s; }

.brand_area {
  padding-bottom: clamp(80px, 8.125vw, 130px); }
  @media screen and (max-width: 480px) {
    .brand_area {
      padding-bottom: 80px; } }
  .brand_area .brand_main {
    position: relative;
    height: 530px;
    clip-path: inset(0 0 0 0);
    margin-bottom: clamp(80px, 8.125vw, 130px); }
    @media screen and (max-width: 1200px) {
      .brand_area .brand_main {
        height: 400px; } }
    @media screen and (max-width: 820px) {
      .brand_area .brand_main {
        margin-bottom: 60px; } }
    @media screen and (max-width: 480px) {
      .brand_area .brand_main {
        margin-bottom: 50px;
        height: 250px; } }
    .brand_area .brand_main:before {
      content: "";
      position: fixed;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background-position: top center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../images/top/main_brand.jpg"); }
      @media screen and (max-width: 480px) {
        .brand_area .brand_main:before {
          height: 100svh;
          background-image: url("../images/top/main_brand_sp.jpg"); } }
  .brand_area .brand_img_group {
    margin-bottom: clamp(80px, 11.667vw, 140px); }
    @media screen and (max-width: 480px) {
      .brand_area .brand_img_group {
        flex-direction: column; } }
    .brand_area .brand_img_group .brand_in {
      width: calc(100% / 3);
      position: relative;
      cursor: pointer;
      overflow: hidden; }
      @media screen and (max-width: 480px) {
        .brand_area .brand_img_group .brand_in {
          width: 100%; } }
      .brand_area .brand_img_group .brand_in:not(:last-child):after {
        content: "";
        position: absolute;
        inset: 0;
        left: auto;
        background: #FFF;
        width: 2px; }
      body:not(.mobile) .brand_area .brand_img_group .brand_in:hover .text_group {
        opacity: 1;
        pointer-events: all; }
      @media screen and (max-width: 480px) {
        .brand_area .brand_img_group .brand_in.p-view .text_group {
          clip-path: inset(0 0 0 0); } }
      .brand_area .brand_img_group .brand_in .image {
        position: relative; }
        .brand_area .brand_img_group .brand_in .image > img {
          width: 100%; }
        .brand_area .brand_img_group .brand_in .image .brand_logo {
          position: absolute;
          inset: 0;
          display: flex;
          justify-content: center;
          align-items: center;
          margin: 0 auto; }
          @media screen and (max-width: 480px) {
            .brand_area .brand_img_group .brand_in .image .brand_logo {
              bottom: auto;
              top: 20%; } }
          .brand_area .brand_img_group .brand_in .image .brand_logo.brand_logo01 {
            max-width: 437px;
            width: 82.15%; }
            @media screen and (max-width: 480px) {
              .brand_area .brand_img_group .brand_in .image .brand_logo.brand_logo01 {
                top: 30%; } }
          .brand_area .brand_img_group .brand_in .image .brand_logo.brand_logo02 {
            max-width: 254px;
            width: 47.75%; }
          .brand_area .brand_img_group .brand_in .image .brand_logo.brand_logo03 {
            max-width: 298px;
            width: 56.02%; }
      .brand_area .brand_img_group .brand_in .text_group {
        position: absolute;
        inset: 0;
        padding: 0 10px;
        display: flex;
        justify-content: center;
        align-items: center;
        background: rgba(0, 98, 178, 0.85);
        opacity: 0;
        transition: 0.5s opacity ease-in-out 0s;
        font-size: clamp(10px, 1.125vw, 18px);
        line-height: 2.22;
        color: #FFF;
        text-align: center;
        pointer-events: none; }
        @media screen and (max-width: 820px) {
          .brand_area .brand_img_group .brand_in .text_group {
            top: auto;
            opacity: 1;
            pointer-events: all;
            padding: 10px 5px;
            line-height: 1.8;
            font-size: 10px; } }
        @media screen and (max-width: 480px) {
          .brand_area .brand_img_group .brand_in .text_group {
            opacity: 1;
            transition: 0.7s clip-path ease-in-out 0.3s;
            clip-path: inset(0 100% 0 0);
            font-size: 12px; } }
  .brand_area .brand_merit_group {
    clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 50%, 0 0, 50% 5.5%);
    background: #ebece2;
    padding: clamp(100px, 10vw, 120px) 0 clamp(60px, 8.334vw, 100px); }
    @media screen and (max-width: 480px) {
      .brand_area .brand_merit_group {
        clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 50%, 0 0, 50% 4%); } }
    .brand_area .brand_merit_group .brand_merit_in .brand_merit_title {
      justify-content: center;
      align-items: flex-end;
      column-gap: 4.16%;
      margin-bottom: clamp(30px, 3.334vw, 40px);
      position: relative; }
      .brand_area .brand_merit_group .brand_merit_in .brand_merit_title .merit_title {
        font-size: clamp(34px, 4.167vw, 50px);
        text-align: center;
        position: relative;
        line-height: 1.3;
        position: relative; }
        .brand_area .brand_merit_group .brand_merit_in .brand_merit_title .merit_title .sub {
          display: block;
          font-size: 56%; }
        .brand_area .brand_merit_group .brand_merit_in .brand_merit_title .merit_title .big {
          font-size: 180%;
          display: inline-block;
          line-height: 1; }
        .brand_area .brand_merit_group .brand_merit_in .brand_merit_title .merit_title .merit_en {
          position: absolute;
          inset: 0;
          bottom: auto;
          text-align: center;
          z-index: -1;
          font-size: 220%;
          color: rgba(255, 255, 255, 0.5);
          transform: translateY(-50%);
          line-height: 1; }
      @media screen and (max-width: 480px) {
        .brand_area .brand_merit_group .brand_merit_in .brand_merit_title .deco {
          position: absolute; } }
      .brand_area .brand_merit_group .brand_merit_in .brand_merit_title .deco.deco01 {
        width: 8.84%; }
        @media screen and (max-width: 480px) {
          .brand_area .brand_merit_group .brand_merit_in .brand_merit_title .deco.deco01 {
            left: -5%;
            top: -5%;
            width: 18%; } }
      .brand_area .brand_merit_group .brand_merit_in .brand_merit_title .deco.deco02 {
        width: 9.34%;
        margin-bottom: 15px; }
        @media screen and (max-width: 480px) {
          .brand_area .brand_merit_group .brand_merit_in .brand_merit_title .deco.deco02 {
            right: -3%;
            bottom: 30%;
            width: 15%;
            margin-bottom: 0; } }
    .brand_area .brand_merit_group .brand_merit_in .brand_merit_box {
      margin-bottom: clamp(40px, 6.667vw, 80px); }
      @media screen and (max-width: 480px) {
        .brand_area .brand_merit_group .brand_merit_in .brand_merit_box {
          flex-wrap: wrap;
          gap: 15px 0; } }
      .brand_area .brand_merit_group .brand_merit_in .brand_merit_box .merit_box {
        width: 22.5%;
        text-align: center;
        padding: clamp(15px, 2.084vw, 25px) 10px;
        background: #FFF;
        border-radius: 10px;
        flex-direction: column;
        row-gap: clamp(20px, 2.5vw, 30px); }
        @media screen and (max-width: 480px) {
          .brand_area .brand_merit_group .brand_merit_in .brand_merit_box .merit_box {
            width: 48%;
            padding: 15px 10px;
            row-gap: 15px; } }
        .brand_area .brand_merit_group .brand_merit_in .brand_merit_box .merit_box .merit_num {
          width: fit-content;
          margin: 0 auto;
          font-size: clamp(34px, 4.167vw, 50px);
          color: #696d69;
          line-height: 1;
          padding-bottom: 10px;
          border-bottom: 1px solid #696d69; }
          @media screen and (max-width: 480px) {
            .brand_area .brand_merit_group .brand_merit_in .brand_merit_box .merit_box .merit_num {
              font-size: 30px; } }
        .brand_area .brand_merit_group .brand_merit_in .brand_merit_box .merit_box .merit_txt {
          font-size: clamp(15px, 1.667vw, 20px);
          margin: auto; }
          @media screen and (max-width: 480px) {
            .brand_area .brand_merit_group .brand_merit_in .brand_merit_box .merit_box .merit_txt {
              font-size: 14px;
              line-height: 1.5; } }
    .brand_area .brand_merit_group .brand_merit_in .brand_read_group {
      justify-content: center;
      align-items: center;
      column-gap: 1.66%;
      position: relative; }
      @media screen and (max-width: 960px) {
        .brand_area .brand_merit_group .brand_merit_in .brand_read_group {
          column-gap: 4%; } }
      @media screen and (max-width: 820px) {
        .brand_area .brand_merit_group .brand_merit_in .brand_read_group {
          column-gap: 2%; } }
      .brand_area .brand_merit_group .brand_merit_in .brand_read_group .text_group {
        flex-direction: column;
        row-gap: clamp(20px, 2.5vw, 30px);
        text-align: center; }
        @media screen and (max-width: 480px) {
          .brand_area .brand_merit_group .brand_merit_in .brand_read_group .text_group {
            row-gap: 15px; } }
        .brand_area .brand_merit_group .brand_merit_in .brand_read_group .text_group .merit_title {
          font-size: clamp(16px, 2.154vw, 28px);
          text-align: center;
          line-height: 1.3;
          position: relative; }
          @media screen and (max-width: 480px) {
            .brand_area .brand_merit_group .brand_merit_in .brand_read_group .text_group .merit_title {
              font-size: 18px;
              line-height: 1.8; } }
        .brand_area .brand_merit_group .brand_merit_in .brand_read_group .text_group .merit_read {
          font-size: clamp(11px, 1.231vw, 16px);
          line-height: 2.18; }
          @media screen and (max-width: 480px) {
            .brand_area .brand_merit_group .brand_merit_in .brand_read_group .text_group .merit_read {
              font-size: 13px; } }
      @media screen and (max-width: 480px) {
        .brand_area .brand_merit_group .brand_merit_in .brand_read_group .deco {
          position: absolute; } }
      .brand_area .brand_merit_group .brand_merit_in .brand_read_group .deco.deco03 {
        width: 13.09%; }
        @media screen and (max-width: 480px) {
          .brand_area .brand_merit_group .brand_merit_in .brand_read_group .deco.deco03 {
            left: -5%;
            top: -5%;
            width: 20%; } }
      .brand_area .brand_merit_group .brand_merit_in .brand_read_group .deco.deco04 {
        width: 11.75%; }
        @media screen and (max-width: 480px) {
          .brand_area .brand_merit_group .brand_merit_in .brand_read_group .deco.deco04 {
            right: -3%;
            top: 20%;
            width: 16%; } }

.modelhouse_area {
  position: relative;
  padding-bottom: clamp(80px, 7.5vw, 120px); }
  @media screen and (max-width: 480px) {
    .modelhouse_area {
      padding-bottom: 40px; } }
  .modelhouse_area .model_bg {
    position: absolute;
    right: 0;
    top: 130px;
    width: 75%;
    max-width: 1200px; }
    @media screen and (max-width: 820px) {
      .modelhouse_area .model_bg {
        top: 70px;
        width: 100%; } }
    .modelhouse_area .model_bg img {
      width: 100%; }
  .modelhouse_area .title_band {
    position: relative;
    padding-top: 50px; }
    @media screen and (max-width: 820px) {
      .modelhouse_area .title_band {
        padding-top: 20px; } }
    .modelhouse_area .title_band.p-view:before {
      clip-path: inset(0 0 0 0); }
    .modelhouse_area .title_band.p-view .title_group {
      visibility: visible;
      transform: translateX(0%); }
      .modelhouse_area .title_band.p-view .title_group .title_wrap {
        transform: translateX(0%); }
    .modelhouse_area .title_band:before {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      height: 85%;
      background: linear-gradient(140deg, #1e5ca9, #4589dc);
      clip-path: inset(0 0 0 100%);
      transition: 0.8s clip-path ease-in-out 0s; }
    .modelhouse_area .title_band .title_group {
      position: relative;
      overflow: hidden;
      margin-bottom: clamp(50px, 5vw, 80px);
      transform: translateX(-100%);
      transition: 0.5s transform ease-in-out 0.3s; }
      .modelhouse_area .title_band .title_group.p-view {
        transform: translateX(0); }
        .modelhouse_area .title_band .title_group.p-view .title_wrap {
          transform: translateX(0); }
      .modelhouse_area .title_band .title_group:before {
        content: "";
        position: absolute;
        inset: 0;
        right: auto;
        width: 75%;
        background: linear-gradient(140deg, #000000, #525252); }
        @media screen and (max-width: 820px) {
          .modelhouse_area .title_band .title_group:before {
            width: calc(100% - 30px); } }
        @media screen and (max-width: 480px) {
          .modelhouse_area .title_band .title_group:before {
            width: calc(100% - 20px); } }
      .modelhouse_area .title_band .title_group .title_wrap {
        padding: clamp(30px, 3.125vw, 50px) 0;
        transform: translateX(100%);
        margin-bottom: 0;
        transition: 0.5s transform ease-in-out 0.3s; }
        @media screen and (max-width: 480px) {
          .modelhouse_area .title_band .title_group .title_wrap {
            padding: 20px 0; } }
        .modelhouse_area .title_band .title_group .title_wrap .title_in {
          position: relative; }
          .modelhouse_area .title_band .title_group .title_wrap .title_in .sec_ttl {
            color: #FFF;
            position: relative;
            align-items: flex-start; }
  .modelhouse_area .model_group {
    position: relative;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: clamp(50px, 6.25vw, 100px) 3.33%; }
    @media screen and (max-width: 480px) {
      .modelhouse_area .model_group {
        justify-content: space-between;
        gap: 50px 0; } }
    .modelhouse_area .model_group .model_item {
      width: 22.5%; }
      @media screen and (max-width: 480px) {
        .modelhouse_area .model_group .model_item {
          width: 48%; } }
      .modelhouse_area .model_group .model_item .photo {
        position: relative;
        overflow: hidden; }
        body:not(.mobile) .modelhouse_area .model_group .model_item .photo:hover img {
          transform: scale(1.05); }
        .modelhouse_area .model_group .model_item .photo img {
          transition: 0.3s transform ease-in-out 0s; }
        .modelhouse_area .model_group .model_item .photo .wappen {
          position: absolute;
          left: 0;
          top: 0;
          font-size: clamp(12px, 1vw, 16px);
          color: #FFF;
          padding: 2px 10px;
          background: #333;
          /*
          &.exhibition{background:#02409a;}
          &.house{background:#00a0e9;}
          &.model{background:#90c31f;}
          */ }
      .modelhouse_area .model_group .model_item .text_link_group {
        width: calc(100% - 20px);
        margin: 0 auto;
        flex-direction: column;
        line-height: 1.4; }
        @media screen and (max-width: 480px) {
          .modelhouse_area .model_group .model_item .text_link_group {
            width: 100%; } }
        .modelhouse_area .model_group .model_item .text_link_group .text_group {
          flex-direction: column;
          justify-content: flex-start;
          row-gap: 15px;
          line-height: 1.4;
          margin: clamp(15px, 1.667vw, 20px) 0; }
          .modelhouse_area .model_group .model_item .text_link_group .text_group .item_name {
            font-size: clamp(13px, 1.385vw, 18px); }
            @media screen and (max-width: 480px) {
              .modelhouse_area .model_group .model_item .text_link_group .text_group .item_name {
                font-size: 15px; } }
            .modelhouse_area .model_group .model_item .text_link_group .text_group .item_name .small {
              display: block;
              font-size: 70%; }
          .modelhouse_area .model_group .model_item .text_link_group .text_group .item_read {
            font-size: clamp(11px, 1.077vw, 14px); }
            @media screen and (max-width: 480px) {
              .modelhouse_area .model_group .model_item .text_link_group .text_group .item_read {
                font-size: 12px; } }
        @media screen and (max-width: 480px) {
          .modelhouse_area .model_group .model_item .text_link_group .link_group {
            flex-direction: column;
            row-gap: 10px; } }
        .modelhouse_area .model_group .model_item .text_link_group .link_group a {
          display: block;
          width: 48%;
          border-radius: 50vw;
          text-align: center;
          padding: 8px 5px;
          font-size: clamp(11px, 1.231vw, 16px);
          color: #FFF;
          line-height: 1.4;
          transition: 0.3s all ease-in-out 0s; }
          @media screen and (max-width: 480px) {
            .modelhouse_area .model_group .model_item .text_link_group .link_group a {
              font-size: 16px;
              width: 100%; } }

.consult_area {
  padding: clamp(80px, 7.5vw, 120px) 0 60px; }
  @media screen and (max-width: 1200px) {
    .consult_area {
      padding: 80px 0 60px; } }
  @media screen and (max-width: 820px) {
    .consult_area {
      padding: 40px 0 20px; } }
  .consult_area .consult_group {
    position: relative;
    margin-bottom: clamp(150px, 15vw, 240px); }
    @media screen and (max-width: 820px) {
      .consult_area .consult_group {
        margin-bottom: 100px; } }
    .consult_area .consult_group.p-view .consult_bg,
    .consult_area .consult_group.p-view .consult_img {
      clip-path: inset(0 0 0 0); }
    .consult_area .consult_group .consult_bg {
      position: absolute;
      inset: 0;
      right: auto;
      width: 75%;
      top: 12%;
      background-position: top center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../images/top/bg_consult.jpg");
      clip-path: inset(0 100% 0 0);
      transition: 0.8s clip-path ease-in-out 0s; }
      @media screen and (max-width: 480px) {
        .consult_area .consult_group .consult_bg {
          top: 30px;
          bottom: -40px;
          width: calc(100% - 20px); } }
    .consult_area .consult_group .consult_in .title_wrap {
      position: relative;
      padding-bottom: clamp(80px, 6.25vw, 100px);
      margin-bottom: 0; }
      @media screen and (max-width: 480px) {
        .consult_area .consult_group .consult_in .title_wrap {
          padding-bottom: 50px; } }
      .consult_area .consult_group .consult_in .title_wrap .sec_ttl {
        align-items: flex-start;
        row-gap: 60px; }
        .consult_area .consult_group .consult_in .title_wrap .sec_ttl .en {
          font-size: clamp(14px, 1.125vw, 18px);
          color: #FFF; }
        @media screen and (max-width: 480px) {
          .consult_area .consult_group .consult_in .title_wrap .sec_ttl {
            row-gap: 30px; } }
      .consult_area .consult_group .consult_in .title_wrap .read {
        width: 46%;
        margin-top: clamp(20px, 2.5vw, 30px); }
        @media screen and (max-width: 480px) {
          .consult_area .consult_group .consult_in .title_wrap .read {
            width: 94%;
            margin-top: 20px; } }
      .consult_area .consult_group .consult_in .title_wrap .detail {
        max-width: 190px;
        width: 100%;
        margin-top: clamp(40px, 5vw, 80px);
        display: block;
        border-radius: 20px;
        text-align: center;
        padding: 5px 10px;
        background: #FFF;
        font-size: clamp(12px, 1.334vw, 16px); }
        @media screen and (max-width: 480px) {
          .consult_area .consult_group .consult_in .title_wrap .detail {
            margin-top: 40px;
            font-size: 16px; } }
        body:not(.mobile) .consult_area .consult_group .consult_in .title_wrap .detail:hover .arrow {
          transform: translateX(5px); }
        .consult_area .consult_group .consult_in .title_wrap .detail .arrow {
          display: inline-block;
          transition: 0.3s all ease-in-out 0s; }
    .consult_area .consult_group .consult_img {
      position: absolute;
      right: 0;
      top: 30%;
      width: 50%;
      clip-path: inset(0 0 0 100%);
      transition: 0.8s clip-path ease-in-out 0s; }
      @media screen and (max-width: 480px) {
        .consult_area .consult_group .consult_img {
          position: relative;
          top: auto;
          right: auto;
          width: calc(100% - 20px);
          margin-left: auto; } }
      .consult_area .consult_group .consult_img img {
        width: 100%; }
  .consult_area .suggestion_group {
    position: relative; }
    .consult_area .suggestion_group .brand_img {
      position: absolute;
      left: 0;
      top: 0;
      width: 79.38%;
      max-width: 1270px; }
      @media screen and (max-width: 480px) {
        .consult_area .suggestion_group .brand_img {
          top: 24%;
          width: 85%; } }
  .consult_area .suggestion_title_group {
    position: relative;
    margin-bottom: clamp(40px, 5vw, 60px); }
    @media screen and (max-width: 480px) {
      .consult_area .suggestion_title_group {
        margin-bottom: 30px; } }
    .consult_area .suggestion_title_group .suggestion_title_in .brand_bg_img img {
      width: 100%; }
    .consult_area .suggestion_title_group .suggestion_title_in .suggestion_title_group {
      position: absolute;
      inset: 0;
      margin: auto;
      display: flex;
      justify-content: center;
      align-items: center;
      text-align: center;
      flex-direction: column;
      row-gap: clamp(20px, 2.5vw, 30px); }
      @media screen and (max-width: 480px) {
        .consult_area .suggestion_title_group .suggestion_title_in .suggestion_title_group {
          row-gap: 25px; } }
      .consult_area .suggestion_title_group .suggestion_title_in .suggestion_title_group .check {
        width: 37.34%;
        margin: 0 auto; }
        @media screen and (max-width: 480px) {
          .consult_area .suggestion_title_group .suggestion_title_in .suggestion_title_group .check {
            width: 80%; } }
      .consult_area .suggestion_title_group .suggestion_title_in .suggestion_title_group .suggestion_title {
        font-size: clamp(26px, 3.385vw, 44px);
        color: #FFF; }
        @media screen and (max-width: 480px) {
          .consult_area .suggestion_title_group .suggestion_title_in .suggestion_title_group .suggestion_title {
            font-size: 6vw;
            line-height: 2; } }
        .consult_area .suggestion_title_group .suggestion_title_in .suggestion_title_group .suggestion_title .big {
          display: inline-block;
          font-size: 150%;
          line-height: 1; }
  .consult_area .suggestion_text_group {
    position: relative;
    flex-direction: column;
    text-align: center; }
    .consult_area .suggestion_text_group .suggestion_txt01 {
      font-size: clamp(18px, 2.334vw, 28px); }
      @media screen and (max-width: 480px) {
        .consult_area .suggestion_text_group .suggestion_txt01 {
          font-size: 22px; } }
    .consult_area .suggestion_text_group .text_group {
      flex-direction: column;
      row-gap: clamp(20px, 2.5vw, 30px);
      margin: clamp(20px, 2.5vw, 30px) 0 clamp(30px, 4.167vw, 50px); }
      @media screen and (max-width: 480px) {
        .consult_area .suggestion_text_group .text_group {
          margin: 20px 0 30px;
          row-gap: 15px; } }
      .consult_area .suggestion_text_group .text_group .suggestion_read {
        font-size: clamp(12px, 1.334vw, 16px);
        line-height: 2.18; }
        @media screen and (max-width: 480px) {
          .consult_area .suggestion_text_group .text_group .suggestion_read {
            font-size: 14px; } }
    .consult_area .suggestion_text_group .suggestion_txt02 {
      display: flex;
      justify-content: center;
      font-size: clamp(18px, 2.5vw, 30px);
      column-gap: 20px;
      color: #015497;
      line-height: 1.2; }
      @media screen and (max-width: 480px) {
        .consult_area .suggestion_text_group .suggestion_txt02 {
          font-size: 5.6vw;
          line-height: 1.5; } }
      .consult_area .suggestion_text_group .suggestion_txt02:before, .consult_area .suggestion_text_group .suggestion_txt02:after {
        content: "";
        border-color: #015497; }
      .consult_area .suggestion_text_group .suggestion_txt02:before {
        transform: skewX(20deg);
        border-left: 1px dashed; }
      .consult_area .suggestion_text_group .suggestion_txt02:after {
        transform: skewX(-20deg);
        border-right: 1px dashed; }
    .consult_area .suggestion_text_group .deco {
      position: absolute;
      pointer-events: none; }
      .consult_area .suggestion_text_group .deco.deco05 {
        left: 12%;
        top: 48%;
        width: 12%; }
        @media screen and (max-width: 480px) {
          .consult_area .suggestion_text_group .deco.deco05 {
            left: -4%;
            top: -8%;
            width: 20%; } }
      .consult_area .suggestion_text_group .deco.deco06 {
        right: 11%;
        top: 10%;
        width: 7.59%; }
        @media screen and (max-width: 480px) {
          .consult_area .suggestion_text_group .deco.deco06 {
            right: 1%;
            top: -9%;
            width: 11%; } }

/*	スライダー NEXT PREVの初期設定*/
.slide_arrow_wrap {
  max-width: 110px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between; }
  .slide_arrow_wrap .swiper-button-next, .slide_arrow_wrap .swiper-button-prev {
    width: 46px;
    height: auto;
    margin: 0; }
  .slide_arrow_wrap .swiper-button-prev,
  .slide_arrow_wrap .swiper-button-next {
    position: static; }
  .slide_arrow_wrap .swiper-button-prev:after,
  .slide_arrow_wrap .swiper-container-rtl .swiper-button-next:after,
  .slide_arrow_wrap .swiper-button-next:after,
  .slide_arrow_wrap .swiper-container-rtl .swiper-button-prev:after {
    content: none !important; }

/*# sourceMappingURL=top.css.map */