@charset "UTF-8";
/* CSS Document */





/*==================================================
					　 TOP
==================================================*/

main.home nav ul {
	gap: 3.5%;
}





/*==================================================
					　ビジョン
==================================================*/

.vision_wrap {
	display: grid;
	grid-template-columns: auto 440px;
	gap: 40px;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	padding-top: 8%;
}
.vision_textHeight {
	display: flex;
	flex-flow: column;
	justify-content: center;
	align-items: flex-start;
	width: 100%;
	height: 100%;
}

.text_only p {
	font-size: 16px;
	color: #fff;
	line-height: 2;
}
.vision_movie {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
}
.vision_movie video {
	width: 100%;
	height: 330px
}






/*==================================================
					ショールーム
==================================================*/

.image.room {
	width: 91.6%;
	margin: -0.6% 0 0 3.6%;
	position: relative;
}
.showroom .read {
	text-align: center;
	padding: 0.8% 0 0.4% 0;
	font-size: 1.3vw;
	background-color: rgba(255, 255, 255, 0.5);
	position: relative;
	z-index: 1;
}
.image.room .name_tag::before {
	content: "";
	font-family: 'gotham';
	font-size: 0.9vw;
	font-weight: bold;
	color: #fff;
	background-color: #751485;
	border-radius: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 6.3%;
	height: 3%;
	position: absolute;
}
.showroom_btn {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 5vw;
	height: 5vw;
	box-shadow: inset -5px -5px 10px 0px rgba(255, 255, 255, 0.4), inset 5px 5px 10px 0px rgba(0, 0, 0, 0.2);
	border-radius: 50%;
	position: absolute;
	cursor: pointer;
	transform-origin: center;
	animation-name: btn-blink;
	animation-duration: 1s;
	animation-direction: alternate;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}
.showroom_btn::before {
	content: "";
	display: block;
	width: 4vw;
	height: 4vw;
	border-radius: 50%;
	box-shadow: -5px -5px 10px 0px rgba(255, 255, 255, 0.4), 5px 5px 10px 0px rgba(0, 0, 0, 0.2);
}
.panel_btn {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 5vw;
	height: 5vw;
	box-shadow: inset -5px -5px 10px 0px rgba(255, 255, 255, 0.4), inset 5px 5px 10px 0px rgba(0, 0, 0, 0.2);
	border-radius: 50%;
	position: absolute;
	cursor: pointer;
	transform-origin: center;
	animation-name: btn-blink;
	animation-duration: 1s;
	animation-direction: alternate;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}
.panel_btn::before {
	content: "";
	display: block;
	width: 4vw;
	height: 4vw;
	border-radius: 50%;
	box-shadow: -5px -5px 10px 0px rgba(255, 255, 255, 0.4), 5px 5px 10px 0px rgba(0, 0, 0, 0.2);
}
@keyframes btn-blink {
	0%{
		opacity: 1;
		transform: scale(100%);
	}
	100%{
		opacity: 0;
		transform: scale(80%);
	}
}
.showroom .modal__bg.panel_bg {
	background-color: transparent;
}
.modal__content.panel_padding {
	padding: 0;
}
.modal__content.panel_vertical {
	width: auto;
}
img.panel_img {
	max-height: 80vh;
}
.modal__content .js-modal-close.panel_small {
	top: 3%;
	width: 30px;
	height: 30px;
}
.modal__content .in_col .text p.showroom_small_text {
	font-size: 0.8vw;
}
.image.room .cont_01 svg {
	width: 4.5%;
	top: 18%;
	left: 28%;
}
.image.room .name_tag.cont_01::before {
	content: "CV-5000";
	top: 26.8%;
	left: 24.8%;
}
.image.room .cont_01 .showroom_btn {
	top: 18%;
	left: 28%;
}
.image.room .panel_01 .panel_btn {
	top: 10.2%;
	left: 31.9%;
}
.image.room .cont_02 svg {
	width: 4.5%;
	top: 20%;
	left: 36%;
}
.image.room .name_tag.cont_02::before {
	content: "SOLOS";
	top: 30.7%;
	left: 33.2%;
}
.image.room .cont_02 .showroom_btn {
	top: 20%;
	left: 35%;
}
.image.room .panel_02 .panel_btn {
	top: 13.4%;
	left: 39.4%;
}
.image.room .cont_03 svg {
	width: 4.5%;
	top: 22.8%;
	left: 43.5%;
}
.image.room .name_tag.cont_03::before {
	content: "Chronos";
	top: 19.2%;
	left: 44.8%;
}
.image.room .cont_03 .showroom_btn {
	top: 22.8%;
	left: 43.5%;
}
.image.room .cont_04 svg {
	width: 3.5%;
	height: 17%;
	top: 24%;
	left: 49.1%;
}
.image.room .name_tag.cont_04::before {
	content: "Maestro2";
	top: 21.2%;
	left: 52.3%;
}
.image.room .cont_04 .showroom_btn {
	top: 22%;
	left: 48.6%;
}
.image.room .panel_04 .panel_btn {
	top: 28.9%;
	left: 51.6%;
}
.image.room .cont_05 svg {
	width: 4.5%;
	top: 29.1%;
	left: 59.2%;
}
.image.room .name_tag.cont_05::before {
	content: "MYAH";
	top: 39%;
	left: 58.6%;
}
.image.room .cont_05 .showroom_btn {
	top: 29.1%;
	left: 59.2%;
}
.image.room .panel_05 .panel_btn {
	top: 20.2%;
	left: 60.7%;
}
.image.room .cont_06 svg {
	width: 4.5%;
	top: 32.8%;
	left: 68.5%;
}
.image.room .name_tag.cont_06::before {
	content: "Triton";
	top: 42.2%;
	left: 68.2%;
}
.image.room .cont_06 .showroom_btn {
	top: 32.8%;
	left: 68.5%;
}
.image.room .panel_06 .panel_btn {
	top: 24.7%;
	left: 73.6%;
}
.image.room .cont_07 svg {
	width: 10.5%;
	top: 38.8%;
	left: 78.8%;
}
.image.room .name_tag.cont_07::before {
	content: "RDｘ";
	top: 46.4%;
	left: 80.4%;
}
.image.room .cont_07 .showroom_btn {
	top: 38.8%;
	left: 81.8%;
}
.image.room .panel_07 .panel_btn {
	top: 29.2%;
	left: 84.8%;
}
.image.room .cont_08 svg {
	width: 4.5%;
	top: 53.8%;
	left: 81.2%;
}
.image.room .name_tag.cont_08::before {
	content: "SL-D701";
	top: 53.7%;
	left: 75.3%;
}
.image.room .cont_08 .showroom_btn {
	top: 53.8%;
	left: 81.2%;
}
.image.room .cont_09 svg {
	width: 10.5%;
	top: 60.9%;
	left: 72.2%;
}
.image.room .name_tag.cont_09::before {
	white-space: pre;
	content: "IMAGEnet eカルテ\AV5クラウド";
	text-align: center;
	line-height: 1;
	width: 10.6%;
	height: 5.7%;
	border-radius: 7px;
	top: 60%;
	left: 68.4%;
}
.image.room .cont_09 .showroom_btn {
	top: 60.9%;
	left: 75.2%;
}
.image.room .cont_10 svg {
	width: 5.5%;
	height: 15%;
	top: 70.8%;
	left: 67.5%;
}
.image.room .name_tag.cont_10::before {
	content: "OMS-800";
	top: 66.9%;
	left: 62.8%;
}
.image.room .cont_10 .showroom_btn {
	top: 70.8%;
	left: 67.5%;
}
.image.room .panel_10 .panel_btn {
	top: 70%;
	left: 60%;
}
.image.room .cont_11 svg {
	width: 5.5%;
	height: 18%;
	top: 60.4%;
	left: 53.5%;
}
.image.room .name_tag.cont_11::before {
	content: "TRC-NW400";
	width: 8.5%;
	top: 56.5%;
	left: 52.4%;
}
.image.room .cont_11 .showroom_btn {
	top: 61.4%;
	left: 53.5%;
}
.image.room .panel_11 .panel_btn {
	top: 64%;
	left: 48%;
}
.image.room .cont_12 svg {
	width: 4.5%;
	top: 41.8%;
	left: 43.5%;
}
.image.room .name_tag.cont_12::before {
	content: "Harmony";
	top: 46%;
	left: 47.8%;
}
.image.room .cont_12 .showroom_btn {
	top: 41.8%;
	left: 43.5%;
}
.image.room .cont_13 svg {
	width: 4%;
	height: 18%;
	top: 35.7%;
	left: 30%;
}
.image.room .name_tag.cont_13::before {
	content: "NW500";
	top: 55.8%;
	left: 29.6%;
}
.image.room .cont_13 .showroom_btn {
	top: 36.7%;
	left: 29.4%;
}
.image.room .cont_14 svg {
	width: 4.5%;
	top: 36.3%;
	left: 21.5%;
}
.image.room .name_tag.cont_14::before {
	content: "TRK-3";
	top: 56.8%;
	left: 20.1%;
}
.image.room .cont_14 .showroom_btn {
	top: 36.3%;
	left: 20%;
}
.image.room .panel_14 .panel_btn {
	top: 41.2%;
	left: 24.8%;
}





/*==================================================
					ソリューション
==================================================*/

.solution main.topcon_screen .solution_cont .outline,
.solution main.mmc .solution_cont .outline,
.solution main.rdx .solution_cont .outline,
.solution main.mmwin .solution_cont .outline,
.solution main.harmony .solution_cont .outline,
.solution main.sedptc .solution_cont .outline {
	background: -moz-linear-gradient(-10deg, rgba(0, 95, 182, 1), rgba(138, 34, 153, 1));
	background: -webkit-linear-gradient(-10deg, rgba(0, 95, 182, 1), rgba(138, 34, 153, 1));
	background: linear-gradient(100deg, rgba(0, 95, 182, 1), rgba(138, 34, 153, 1));
}



/*//////////// ナビゲーションバー ////////////*/

.solution main nav {
	top: 50vh;
	transform: translateY(-65%);
	padding-top: 0;
}
.solution main nav li {
	margin: 15px auto;
	background-color: #fff;
}
.solution main nav li:first-of-type {
	margin-top: 0;
}
.solution main nav li:last-of-type {
	margin-bottom: 0;
}
.solution main nav li.topcon_screen,
.solution main nav li.mmc,
.solution main nav li.rdx,
.solution main nav li.mmwin,
.solution main nav li.harmony,
.solution main nav li.sedptc {
	color: #005fb6;
	background-color: rgba(255, 255, 255, 0.8);
}
.solution_btn {
	box-shadow: 0 0 13px rgba(0, 95, 182, .85);
}
.solution main nav li.topcon_screen.gradation,
.solution main nav li.mmc.gradation,
.solution main nav li.rdx.gradation,
.solution main nav li.mmwin.gradation,
.solution main nav li.harmony.gradation,
.solution main nav li.sedptc.gradation {
	color: #fff;
	background: -moz-linear-gradient(-10deg, rgba(0, 95, 182, 1), rgba(138, 34, 153, 1));
	background: -webkit-linear-gradient(-10deg, rgba(0, 95, 182, 1), rgba(138, 34, 153, 1));
	background: linear-gradient(100deg, rgba(0, 95, 182, 1), rgba(138, 34, 153, 1));
}
.active .overlay {
	pointer-events: none;
}



/*//////////// マップ ////////////*/

.solution_cont .map img.base {
	width: 100%;
	margin-bottom: 5.8%;
	transform: translate(-4.5%, 7%) scale(0.96);
}
.solution_cont .map .facility.fa_01 {
	width: 7.9%;
	top: 13.9%;
	left: 29.2%;
}
.solution_cont .map .facility.fa_02 {
	width: 7.1%;
	top: 10.4%;
	left: 38.1%;
}
.solution_cont .map .facility.fa_03 {
	width: 7.9%;
	top: 51.4%;
	left: 29%;
}
.solution_cont .map .facility.fa_04 {
	width: 7.9%;
	top: 52%;
	left: 45.8%;
}
.solution_cont .map .facility.fa_05 {
	width: 7.9%;
	top: 59.5%;
	left: 57%;
}
.solution_cont .map .facility.fa_06 {
	width: 7.9%;
	top: 61.6%;
	left: 22.7%;
}
.solution_cont .map .facility.fa_07 {
	width: 7.9%;
	top: 64.5%;
	left: 37.6%;
}
.solution_cont .map .facility.fa_08 {
	width: 7.9%;
	top: 75.4%;
	left: 20.5%;
}
.solution_cont .map .facility.fa_09 {
	width: 7.9%;
	top: 27.3%;
	left: 35.6%;
}
.solution_cont .map .facility.fa_10 {
	width: 7.9%;
	top: 26.5%;
	left: 58.1%;
}
.solution_cont .map .facility.fa_11 {
	width: 7.9%;
	top: 45.7%;
	left: 52.5%;
}
.solution_cont .map .facility.fa_12 {
	width: 7.9%;
	top: 21.1%;
	left: 20.3%;
}
.solution_cont .map .facility.fa_13 {
	width: 7.9%;
	top: 22.1%;
	left: 47.3%;
}
.solution_cont .map .facility.fa_14 {
	width: 7.9%;
	top: 34%;
	left: 27.2%;
}
.solution_cont .map .facility.fa_15 {
	width: 8.4%;
	top: 46.7%;
	left: 19.4%;
}
.solution_cont .map .facility.fa_16 {
	width: 7.9%;
	top: 21.8%;
	left: 9.8%;
}
.solution_cont .map .facility.fa_17 {
	width: 10.7%;
	top: 37.5%;
	left: 10.6%;
}
.solution_cont .map .facility.fa_18 {
	width: 7.9%;
	top: 47%;
	left: 3.8%;
}
.solution_cont .map .facility.fa_19 {
	width: 7.9%;
	top: 62.4%;
	left: 8%;
}
.solution_cont .map {
	background-color: #fff;
	overflow: hidden;
}





/*==================================================
				グローバルネットワーク
==================================================*/

.global main {
	overflow: hidden;
}



/*//////////// 地域 ////////////*/

.global .main_content.area_world {
	background-image: url("images/global/gn_map.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	display: block;
	width: 100%;
	height: 100%;
	transform: translate(0, -1%);
}
.area_name {
	display: block;
	width: 100vw;
	height: 100vh;
	position: absolute;
	top: 0.8%;
	pointer-events: none;
}
.global .main_content nav p {
	font-size: 16px;
	letter-spacing: .2em;
	text-align: center;
	position: absolute;
	width: 9.4%;
	height: auto;
	aspect-ratio: 1/1;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	color: #fff;
	border: solid 2px rgba(255, 255, 255, 0.8);
	box-shadow: 0 0 15px -2px rgba(255, 255, 255, 0.5), 0 0 15px -2px rgba(255, 255, 255, 0.5) inset;
}
.global .main_content nav .apac {
	right: 44.1%;
	top: 15.7%;
}
.global .main_content nav .emea {
	left: 12.2%;
	top: 46.8%;
}
.global .main_content nav .americas {
	left: 76%;
	top: 46.8%;
}



/*//////////// 拠点 ////////////*/

.global_list {
	position: absolute;
}
.global_listItem{
	font-size: 1.4vh;
	line-height: 1.2;
	color: #fff;
	position: relative;
	cursor: pointer;
}
.global_listItem::before {
	content: "";
	background-image: url("images/global/map_icon.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	display: block;
	width: 10px;
	height: 16px;
	position: absolute;
}
.global_innerList li {
	display: block;
	margin-left: 1.4%;
	position: relative;
	font-size: 0.8vw;
}
.global_innerList li::before {
	content: "";
	background-color: #000;
	display: block;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	position: absolute;
	left: -1.4%;
}
.global_innerList li:nth-of-type(1)::before {
	top: 1vh;
}
.global_innerList li:nth-of-type(2)::before {
	top: 1vh;
}
.global_innerList li:nth-of-type(3)::before {
	top: 1vh; 
}
.global_innerList li:nth-of-type(4)::before {
	top: 1vh;
}
.item_01 {
	top: 39.1%;
	left: 58.2%;
}
.item_01 .global_listItem::before {
	top: 24%;
	left: -10%;
}
.item_02{
	top: 44.4%;
	left: 57.8%;
}
.item_02 .global_listItem::before {
	top: -162%;
	left: -8%;
}
.item_03{
	top: 48.5%;
	left: 57.8%;
}
.item_03 .global_listItem::before {
	background-image: none;
	background-color: #fff;
	display: block;
	width: 1%;
	height: 400%;
	top: -166%;
	left: -6%;
}
.item_04 {
	top: 54%;
	left: 57.8%;
}
.item_04 .global_listItem::before {
	display: none;
}
.item_05 {
	top: 38%;
	left: 38.8%;
}
.item_05 .global_listItem::before {
	top: 9%;
	left: 103%;
}
.item_06 {
	text-align: right;
	top: 41%;
	left: 46.7%;
}
.item_06 .global_listItem::before {
	top: -2%;
	left: 101%;
}
.item_07 {
	top: 50.3%;
	left: 32.3%;
}
.item_07 .global_listItem::before {
	top: 101%;
	left: 90%;
}
.item_08 {
	top: 50%;
	left: 47.1%;
}
.item_08 .global_listItem::before {
	top: 95%;
	left: 6%;
}
.item_09 {
	top: 57.4%;
	left: 39.3%;
}
.item_09 .global_listItem::before {
	top: 25%;
	left: 103%;
}
.item_10 {
	top: 58.8%;
	left: 49.1%;
}
.item_10 .global_listItem::before {
	top: 3%;
	left: -12%;
}
.item_11 {
	text-align: right;
	top: 79.3%;
	left: 47.6%;
}
.item_11 .global_listItem::before {
	top: 22%;
	left: 105%;
}
.item_12 {
	top: 20.4%;
	left: 11.5%;
}
.item_12 .global_listItem::before {
	top: 31%;
	left: -14%;
}
.item_13 {
	top: 28.6%;
	left: 9.5%;
}
.item_13 .global_listItem::before {
	background-image: url("images/global/map_icon-2.svg");
	top: 44%;
	left: -17%;
}
.item_13 .global_listItem::after {
	content: "";
	background-image: url("images/global/map_icon-3.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	display: block;
	width: 43%;
	height: 474%;
	position: absolute;
	top: -70%;
	left: -38%;
}
.item_14 {
	top: 33%;
	left: 9.6%;
}
.item_14 .global_listItem::before {
	top: -1%;
	left: -12%;
}
.item_15 {
	top: 30.5%;
	left: 85.9%;
}
.item_15 .global_listItem::before {
	top: 23%;
	left: -11%;
}
.item_16 {
	top: 33.6%;
	left: 85.6%;
}
.item_16 .global_listItem::before {
	top: -3%;
	left: -9%;
}
.item_17 {
	top: 38%;
	left: 77.6%;
}
.item_17 .global_listItem::before {
	top: 0%;
	left: -38%;
}



/*//////////// モーダルウィンドウ ////////////*/

.global .modal {
	position: absolute;
	top: -10vh;
	left: -13.1vw;
	width: 130%;
}
.yamagata_images {
	position: relative;
}
.modal__content .in_col .image.yamagata_images {
	height: auto;
}
.yamagata_images img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.yamagata_images img:nth-of-type(2) {
	animation-name: "yamagata-image-change";
	animation-duration: 12s;
	animation-iteration-count: infinite;
	animation-delay: 3s;
}
@keyframes yamagata-image-change {
	0%{
		opacity: 1;
	}
	25%{
		opacity: 0;
	}
	50%{
		opacity: 0;
	}
	75%{
		opacity: 1;
	}
	100%{
		opacity: 1;
	}
}
.global .area_world .modal__content .in_col .title_sub,
.global .area_world .modal__content .in_col .title:after {
	background: -moz-linear-gradient(left, rgba(0, 163, 173, .7), rgba(138, 34, 153, .7));
	background: -webkit-linear-gradient(left, rgba(0, 163, 173, .7), rgba(138, 34, 153, .7));
	background: linear-gradient(to right, rgba(0, 163, 173, .7), rgba(138, 34, 153, .7));
}
.global .area_world .modal__content .in_col .text p,
.global .area_world .modal__content .in_col .text ul {
	font-size: 0.8vw;
	letter-spacing: normal;
}
.global .area_world .modal__bg {
	background: -moz-linear-gradient(left, rgba(0, 163, 173, .7), rgba(138, 34, 153, .7));
	background: -webkit-linear-gradient(left, rgba(0, 163, 173, .7), rgba(138, 34, 153, .7));
	background: linear-gradient(to right, rgba(0, 163, 173, .7), rgba(138, 34, 153, .7));
	opacity: 0.8;
}
.world_arrow_wrap {
	display: none;
	width: 100vw;
	position: relative;
}
.world_arrow_prev::before,
.world_arrow_next::before {
	content: "";
	background-image: url("images/global/arrow_icon.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	display: block;
	width: 40px;
	height: 78px;
	position: absolute;
}
.world_arrow_prev::before {
	transform: scaleX(-1);
	top: -55.7vh;
	left: 2%;
}
.world_arrow_next::before {
	top: -55.7vh;
	right: 2%;
}



/*//////////// ダミー用 ////////////*/

.global .modal__content .in_col .image.dummy {
	width: 352px;
	height: 235px;
	background-color: #999;
}