@charset "utf-8";
@media(max-width: 1200px) {
		.top_tile_item_thumb .top_tile_item_caption {
				padding: 0 25px;
		}
		.comingsoon_flex_txt {
				font-size: 18px;
		}
}
@media(max-width: 670px) {
		.verLandscape .comingsoon_flex_txt {
				font-size: 15px;
		}
}
@media(max-width: 430px) {
		.comingsoon_flex_txt {
				font-size: 17px;
		}
}
@media(max-width: 375px) {
		.comingsoon_flex_txt {
				font-size: 14px;
		}
}
/* =============== */
@media(max-width: 960px) {
		.top_tile_item_caption .section_title_en {
				font-size: 50px;
		}
		.top_news_flex {
				display: block;
		}
		.top_tile_item .section_title {
				margin-bottom: 0;
		}
}
@media(max-width: 767px) {
		/* SERVICE(new)：hover無し。テキスト→その画像を縦積み2セット */
		.top_service2_section {
				padding: 80px 0 90px;
		}
		.top_service2_inner {
				padding: 0 25px;
		}
		.service2_flag {
				font-size: 21px;
				margin: 0 0 40px;
		}
		.top_service2_body {
				display: block;
		}
		.top_service2_list {
				width: 100%;
		}
		.service2_item {
				padding: 32px 0;
		}
		.service2_item_no {
				font-size: 13px;
		}
		.service2_item_ttl {
				font-size: 26px;
		}
		.service2_item_desc {
				font-size: 16px;
		}
		/* SPは項目内画像を表示、右の共通ビジュアルは隠す */
		.top_service2_visual {
				display: none;
		}
		.service2_item_img {
				display: block;
				position: relative;   /* ::before の基準＋overflowでクリップ */
				overflow: hidden;
				width: 100%;
				height: 56vw;
				margin-top: 26px;
				border-radius: 2px;
				background-size: cover;
				background-position: center center;
				clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%); /* /service/ svc_block_visual と同じ斜めカット */
		}
		/* 2枚目は逆向きの斜め＝zigzag（/service/の .svc_block.reverse に倣う） */
		.service2_item:nth-of-type(2) .service2_item_img {
				clip-path: polygon(0 0, 94% 0, 100% 100%, 6% 100%);
		}
		/* /service/ の svc_block_img と同方式：拡大レイヤーを translateX で動かす（背景位置ずらしと違い、確実に動く） */
		.service2_item_img::before {
				content: "";
				position: absolute;
				top: 0;
				left: -20%;
				width: 140%;   /* 横に拡大＝可動域。overflow:hiddenで見切れをクリップ */
				height: 100%;
				background-image: inherit;   /* 親(.service2_img_01/02)の画像を継承 */
				background-size: cover;
				background-position: center center;
				will-change: transform;
				transform: translateX(var(--svcx, 0px));
		}
		/* NEWS(new)：1カラム */
		.top_news2_section {
				padding: 76px 0 90px;
		}
		.top_news2_inner {
				padding: 0 25px;
		}
		.top_news2_section .section_title {
				margin-bottom: 28px;
		}
		.news2_grid {
				grid-template-columns: repeat(2, 1fr);
				gap: 26px 14px;
		}
		.news2_card_body {
				padding: 13px 4px 6px;
		}
		.news2_card_ttl {
				font-size: 14px;
				line-height: 1.55;
		}
		.news2_more {
				margin-top: 38px;
		}
		/* CASE STUDY：縦積み・zigzag解除（写真上・テキスト下） */
		.top_casestudy_section {
				padding: 60px 25px 80px;
		}
		.cs_list {
				margin-top: 30px;
				gap: 26px;
		}
		.cs_card,
		.cs_card:nth-child(even) {
				flex-direction: column;
		}
		.cs_card_img {
				flex: none;
				aspect-ratio: 16 / 9;
		}
		.cs_card_body {
				flex: none;
				padding: 26px 22px 30px;
		}
		.cs_card_ttl {
				font-size: 19px;
		}
		/* SPは縦長になりやすいのでサブ見出し(リード)を非表示＝カードをコンパクトに */
		.cs_card_lead {
				display: none;
		}
		.cs_more {
				margin-top: 36px;
		}
}
@media(max-width: 767px) {
		.top_who_section {
				padding-top: 90px;
				padding-bottom: 80px;
		}
		.top_who_section .section_title_jp {
				font-size: 13px;
		}
		.top_who_section .section_title_en {
				font-size: 32px;
		}
		.top_who_section .section_title {
				margin-bottom: 30px;
		}
		.top_who_catch {
				font-size: 40px;
				line-height: 1.6;
				margin: 0 0 30px;
		}
		.top_who_body {
				margin: 0 0 35px;
		}
		.top_who_body p {
				font-size: 16px;
				line-height: 1.85;
				margin: 0 0 14px;
		}
		.top_who_link {
				font-size: 16px;
		}
		.top_who_link .arrowBaseS {
				margin-left: 15px;
		}
}
@media(max-width: 767px) {
		.fv_inner, .top_who_section, .top_about_section {
				padding-left: 25px;
				padding-right: 25px;
		}
		.top_news_section {
				padding-left: 0;
				padding-right: 0;
		}
		.fv_catch_lead {
				font-size: 8vw;
		}
		.fv_catch_en {
				font-size: 4vw;
		}
		.top_cont {
				margin-top: 200vh !important;
		}
		.fv_section .fv_scroll {
				position: absolute;
				width: 8px;
				right: 20px;
				bottom: 0;
				height: 140px;
		}
		.top_service_section_inner {
				padding: 0 25px;
		}
		.top_about_section {
				padding-top: 80px;
				padding-bottom: 60px;
		}
		.top_news_section_inner {
				display: flex;
				flex-direction: column-reverse;
				background: none;
		}
		.top_service_section {
				padding: 60px 0 130px;
		}
		.top_news_section {
				padding-top: 0;
				padding-bottom: 80px;
		}
		.top_news_flex {
				display: block;
				padding: 60px 25px 40px;
				background: #fff;
				margin-bottom: 40px;
		}
		.top_tile_flex {
				padding: 0 25px;
		}
}
@media(max-width: 840px) {
		.verPortrait .top_tile_item_caption .section_title_en {
				font-size: 42px;
		}
		.verLandscape .top_tile_item_caption .section_title_en {
				font-size: 38px;
		}
		.verLandscape .top_tile_item_thumb .top_tile_item_caption {
				padding: 0 20px;
		}
}
@media(max-width: 567px) {
		.top_about_section {
				padding-top: 70px;
		}
		.top_tile_flex {
				display: block;
				background: none;
				padding: 0 25px;
		}
		.top_tile_item {
				width: 100%;
				overflow: hidden;
				margin: 10px 0 0;
		}
		.top_tile_item_thumb .top_tile_item_caption {
				padding: 0 20px;
		}
		.top_tile_item .section_title {
				transform: translateY(-10px)
		}
		.top_about_flex {
				display: block;
		}
		.top_about_tile {
				width: 100%;
		}
		.top_about_tile_caption a {
				padding: 20px 20px 40px;
				min-height: inherit;
		}
		.top_about_tile_caption {
				width: calc(100% - 30px);
				top: -40px;
				min-height: inherit;
		}
		.top_about_tile_caption h4 {
				margin-bottom: 15px;
		}
		.aboutHdLeft, .aboutTileLeft, .aboutTileRight {
				height: auto !important;
		}
}
@media (min-width: 568px) and (max-width: 1194px) {
		.verLandscape .fv_catch_lead_pc {
				display: block;
		}
		.verLandscape .fv_catch_lead_sp {
				display: none;
		}
}
@media(min-width: 568px) {
		.fv_catch_lead_sp {
				display: none !important;
		}
}
@media(max-width: 567px) {
		.fv_catch_lead_pc {
				display: none !important;
		}
}
@media (max-width: 1194px) {
		.verLandscape .fv_section {
				height: 100vh !important;
				min-height: 100vh !important;
		}
		.verLandscape .fv_section.extraFF {
				background-image: url("../images/kv_mid.jpg");
				background-size: 100%;
				background-position: 0 0;
		}
		.verLandscape .fv_inner {
				height: auto;
				min-height: auto;
		}
		.verLandscape .top_cont {
				margin-top: 200vh !important;
		}
		.verLandscape .fv_inner {
				display: flex;
				align-items: flex-start;
		}
		.verLandscape .fv_section .fv_scroll {
				position: absolute;
				width: 8px;
				right: 20px;
				bottom: 0;
				height: 140px;
		}
		.verLandscape .fv_scroll::before, .verLandscape .fv_scroll::after {
				top: 50px;
		}
		.verLandscape .fv_scroll::after {
				animation: scrollIconEx 1.4s cubic-bezier(0.16, 1, 0.3, 1) infinite;
				transform-origin: center top;
		}
		.verLandscape .fv_catch {
				margin-top: calc(50vh - 90px);
		}
		.verLandscape .fv_catch_lead {
				font-size: 4.3vw;
				margin: 0 0 10px;
		}
		.verLandscape .fv_catch_en {
				font-size: 3vw;
		}
}
@media (max-width: 940px) {
		.verLandscape .extraFF .fv_catch {
				margin-top: 100px;
		}
		.verLandscape .fv_section.extraFF {
				height: 120vh !important;
				min-height: 120vh !important;
		}
		.verLandscape .top_cont.extraFF {
				margin-top: 120vh !important;
		}
		.verLandscape .fv_section.extraFF .fv_scroll {
				bottom: 50px;
		}
}
@keyframes scrollIconEx {
		0% {
				top: 50px;
				opacity: 1;
				transform: scaleY(1)
		}
		80% {
				top: 120px;
				opacity: 1;
				transform: scaleY(4)
		}
		100% {
				top: 120px;
				opacity: 0;
				transform: scaleY(4)
		}
}