@charset 'utf-8';
:root{
  /* color */
	--main-color: #1F2933;
	--blue-color: #004EA2;
	--sky-blue-color: #27B7E7;
	--ff-main: "Noto Sans JP", sans-serif;
	--ff-red-hat:"Red Hat Text", sans-serif;
	--ff-manrope:"Manrope", sans-serif;
	--ff-robot:"Roboto", sans-serif;
	--ff-inter:"Inter", sans-serif;
}

/* reset
------------------------------------------------ */
body,div,pre,p,a,img,form,fieldset,input,textarea,select,option,
dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,table,th,td,embed,object,
figure,figcaption {
	margin: 0;
	padding: 0;
}
html { height: 100%; font-size: 62.5%; }
body {
	width: 100%;
	height: 100%;
	background: #fff;
	-webkit-text-size-adjust: 100%;
	font-family: var(--ff-main);
	font-size: 1rem;
	line-height: 1.6;
	color: var(--main-color);
}
*,
*:before,
*:after { -webkit-box-sizing: border-box; box-sizing: border-box; }
ul,ol { list-style: none; }
img { /*width: auto;*/ height: auto; max-width: 100%; border: none; vertical-align: top; }
a{ text-decoration: none; }
a:hover { text-decoration: none; }

/* container
----------------------------------------------- */
#container { position: relative; width: 100%; overflow: hidden; font-size: 1rem; }
#container.container--overflow-unset{ overflow: inherit; }

@media only screen and (max-width: 1440px) and (min-width: 769px) {
	#container{ font-size: 0.694444vw; }
}

@media only screen and (max-width: 375px) {
	#container { font-size: 2.66vw; }
}

.wrap,
.wrap-1050,
.wrap-900 { position: relative; margin: 0 auto; }
.wrap { max-width: 120em; }
.wrap-1050{ max-width: 105em; }
.wrap-900{ max-width: 90em; }
.body--blue{ background-color: #1A67B9; }
.img-object-cover img{ width: 100%; height: 100%; object-fit: cover; }
.comingsoon { padding: 120px 0; text-align: center; font-family: var(--ff-red-hat); font-size: 6rem; font-weight: 700; line-height: 1.2; color: #1A67B9; }

@media only screen and (min-width: 769px) {
	.sp { display: none !important; }
}

@media only screen and (max-width: 768px) {
	/* mobile 30% off */
  .wrap,
	.wrap-1050,
	.wrap-900{ padding: 0 1.5em; }
	.comingsoon { padding: 60px 0; font-size: 3.6rem; }
	.pc { display: none !important; }
}


/* header
------------------------------------------------ */
#header{ transition: background-color .2s ease; position: fixed; left: 0; top: 0; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; z-index: 9; }
.header-fixed{ background-color: var(--blue-color); }
.body--header--white #header { background-color: #fff; box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.12); }
.header__sitename{ padding-left: 3.4em; display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; }
.header__logo{ max-width: 14em; }
.header__sitetitle{ position: relative; padding-left: 1.5333em; font-weight: 700; font-size: 1.5em; font-family: var(--ff-red-hat); letter-spacing: 0.07em; color: #fff; }
.header__sitetitle::before{ content: ''; position: absolute; left: 0.6em; top: 0; width: 1px; height: 100%; background-color: #fff; transform: rotate(15deg);}
.body--header--white .header__sitetitle{ color: #444444; }
.body--header--white .header__sitetitle::before{ background-color: #444444; }
.body--header--white .header__logo{ position: relative; top: 0.4em; aspect-ratio: 290 / 88; overflow: hidden; }
.body--header--white .header__logo img { opacity: 0; }
.body--header--white .header__logo::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../img/share/logo-ejworks-2.png) no-repeat center center; background-size: 100%; }

.header__nav-ctaLink{ display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 22em; height: 8em; }
.header__nav-ctaLink span{ font-size: 2.4em; font-weight: 700; font-family: var(--ff-manrope); line-height: calc(36/24); color:#fff; }
.header__nav-ctaLink--entry{ position: relative; padding-left: 2.5em; background-color: var(--sky-blue-color);}
.header__nav-ctaLink--entry::before{ content:''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 5em; height: 2px; background-color: #fff; }
.header__nav-list{ height: 100%; }
.header__nav-link{ padding: 0 .8571em; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; height: 100%; font-size: 1.4em; color: #fff; }
.body--header--white .header__nav-link{ color: #1F2933; }
.body--header--white .header__nav-item:hover .header__nav-link{ color:var(--blue-color); background-color: #C9DCEF; }
.header__nav-item{ position: relative; }

.header__nav-sublist-item{ position: relative; padding-left: 3.3em; }
.header__nav-sublist-item::before{ content: ''; position: absolute; left: 0; top: 1.7em; width: 1.9em; height: 2px; background-color: #1EB9EE; }
.header__nav-sublist-item > a{ display: block; font-size: 1.4em; font-weight: 600; font-family: 'Manrope'; white-space: nowrap; color: #fff; line-height: calc(36/14); }


@media only screen and (min-width: 769px) {
	.header__nav{ display: inline-flex !important; flex-wrap: wrap; align-items: center; gap: 4.4em; }
	.header__nav-list{ display: inline-flex; flex-wrap: wrap; gap: 2em; }
	.header__nav-item{ height:100%; }
	.header__nav-item--has-child:hover .header__nav-sublist{ display: block; }
	.header__nav-sublist{ display: none; padding: 2em 2em 2em 0; position: absolute; left: 0; top: 100%; background-color: var(--blue-color); border-radius: 0 0 1.8em 1.8em; overflow: hidden; }

	.header__mobile-btns{ display:none; }
}

@media only screen and (max-width: 768px) {
	.header__sitename{ padding-left:1.5em; position:relative; z-index:1; }
	.header__sitetitle{ font-size:1em; }
	.header__logo{ max-width:9.8em; }
	/*.header__nav:not(.is-active){ display:none; }*/
	.header__nav{ display:none; }
	.header__nav{ align-items:flex-start; }
	.header__nav-ctaLink{ width:12em; height:4.5em; }
	.header__nav-ctaLink span{ font-size:1.68em; }
	.header__nav-ctaLink--entry{ padding-left:1.75em;  }
	.header__nav-ctaLink--entry::before{ width:3.5em; }

	.header__nav{ position:absolute; left:0; top:0; width:100%; height:100vh; padding-top: 6em; background:var(--blue-color); }
	.body--header--white .header__nav{ background-color:#fff; }
	.header__nav-list{ padding: 0 3.5em; width:100%; max-height:calc(100vh - 10em); overflow-y:auto; }
	.header__nav-link{ padding: .6em 0; justify-content:flex-start; }
	.header__nav-sublist-item{ font-size:.9285em; }
	.body--header--white .header__nav-sublist-item > a{ color:#1F2933; }

	.header__mobile-btns{ display:inline-flex; flex-wrap:wrap; position:relative; z-index:1; }
	.header__hamburger-btn{ position: relative; height: 100%; width: 5em; font-size: 1em; border:0; background:none; outline:none; }
	.header__hamburger-btn span{ position: absolute; display:block; width:3em; height:2px; border-radius: 1px; background-color: #fff; transition: rotate .2s ease; }
	.body--header--white .header__hamburger-btn span{ background-color:#1F2933; }
	.header__hamburger-btn span:nth-child(2){ left: 50%; top:50%; transform: translate(-50%, -50%); }
	.header__hamburger-btn span:nth-child(1){ top: 1.3em; left: 1em; }
	.header__hamburger-btn span:nth-child(3){ right: 1em; bottom: 1.3em;}
	.header__hamburger-btn.is-active span:nth-child(2){visibility: hidden;}
	.header__hamburger-btn.is-active span:nth-child(1){top:2.2em;left:1em;transform: rotate(45deg)}
	.header__hamburger-btn.is-active span:nth-child(3){ bottom: 2.1em; transform: rotate(-45deg);}


}

/* main

------------------------------------------------ */
#main { display: block; position: relative; width: 100%; }
.link-skipcontent {
    position: absolute;
    margin: -1px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
.color-blue{ color: var(--blue-color) !important; }
.color-white{ color:#fff; }
.text-center{ text-align: center; }

/* member lists
---------------------------*/
.members__lists{ display: flex; flex-wrap: wrap; gap: 2.6em; }
.members__item{ position: relative; border-radius: 3em; overflow: hidden; }
.members__item:after{ content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 50%; background-color: var(--blue-color); }
.members__item-link{ position: relative; z-index: 1; display: block; height: 100%; }
.members__item-pht{ position: relative; width: 100%; height: 44.9em; overflow: hidden; }
.members__info{ position: absolute; left: 0; bottom: 0; width: 100%; height: 17.9em; display: flex; flex-wrap: wrap; flex-direction: column; justify-content: flex-end; align-items: flex-start; background: linear-gradient(180deg, rgba(0, 78, 162, 0) 0%, var(--blue-color) 100%); }
.members__position{ padding: .47222em .8333em .47222em 1.388em; display: inline-flex; align-items: center; font-size: 1.8em; font-weight: 700; line-height: calc(28/18); color:#fff; background-color: #07325D; gap:.555em; }
.members__position sub{ font-size: 0.5em;  }
.members__year{ padding: .2666em 1em .2666em 1.6666em; display: inline-flex; flex-wrap: wrap; gap: 1em; font-size: 1.5em; font-weight: 900; line-height: calc(28/15); color: #07325D; background-color: #fff; }
.members__item-desc{ padding: 1.1111em 1.388em; font-size: 2em; line-height: calc(26/20); font-weight: 900; letter-spacing: 0.02em; color:#fff; background: url(../../_assets/img/icons/white_arrow.png) no-repeat calc(100% - 1.388em) calc(100% - 1.277em) / 1.444em auto; }

@media only screen and (min-width: 769px) {
	.members__item{ width: calc(380/1200 * 100%); }
}

@media only screen and (max-width: 768px) {
	.members__lists{ flex-direction:column; max-width:38em; margin:0 auto; }
}

/*
title
------------------------------*/
.title-1{ font-size: 6em; font-weight: 700; font-family: var(--ff-red-hat); line-height: calc(62/60); letter-spacing: 0.02em; color: var(--sky-blue-color); }
.title-1--ja{ margin-bottom: .375em; display: block; font-size: .4em; font-weight: 900; letter-spacing: 0.04em; line-height: calc(32/24); color: var(--blue-color); }
.title-1--icon{ display: block; }
.title-1--icon svg{ width: 4.333em; height: 1.2333em; line-height: 1; }
.title-2{ font-size: 6.4em; font-weight: 900; line-height: 1; letter-spacing: 0.04em; color: var(--blue-color); text-align: center; }
.title-2--sub{ margin-top: 1.25em; display: block; font-size: 0.25em; line-height: calc(24/16); color: var(--sky-blue-color); }

.title-3{ font-size: 4.6em; font-weight: 900; line-height: calc(66/46); letter-spacing: 0.04em; color: #07325D; }
.title-3--icon{ display: inline-flex; position: relative; top:.3913em; }
.title-3--icon svg{ width: 4.9565em; height: 1.413em; line-height: 1; }

.title-4{ font-size: 3.6em; font-weight: 900; line-height: 1.2; letter-spacing: 0.04em; color:var(--blue-color) }
.title-4--sub{ margin-top: 0.75em; display: block; font-size: .4444em; color:var(--sky-blue-color) }
.title-4--media{ max-width: 28.4375em; }

.title-5{ margin-bottom: .25em; font-size: 3.2em; font-weight: 900; line-height: calc(48/32); color: var(--blue-color); }
.title-5--en{ margin-bottom: .125em; display: block; font-size: .75em; font-weight: 600; font-family: var(--ff-red-hat); line-height: 1; color: var(--sky-blue-color); letter-spacing: 0.04em; }

.title-6{ font-size: 3em; font-weight: 900; line-height: calc(74/30); color: var(--blue-color); }
.title-6-faq{ width: 100%;  }

.title-7{ font-size: 3.1em; font-weight: 900; letter-spacing: 0.04em; line-height: calc(32/31); }
.title-7--en{ display: block; font-size: .48387em; font-weight: 700; font-family: var(--ff-red-hat); line-height: calc(20/15); letter-spacing: 0.05em; color: var(--sky-blue-color); }

.text-1{ font-size: 1.6em; font-weight: 400; color: #000; line-height: calc(24/16); }
.text-2{ font-size: 1.5em; font-weight: 400; line-height: calc(28/15); }
.text-2--media{ max-width: 29.6em; margin-top: 2.33333em; }
.text-2--vr-tour{ margin-top: 1.3333em; }
.text-3{ font-size: 1.5em; font-weight: 400; line-height: calc(32/15); }

@media only screen and (max-width: 768px) {
	.title-1{ font-size:4.2em; }
	.title-2{ font-size:4.48em; }
	.title-3{ font-size:3.2em; }
	.title-4{ font-size:2.52em; }
	.title-5{ font-size:2.24em; }
	.title-6{ font-size:2.1em; }
	.title-7{ font-size:2.17em; }

	.text-1,
	.text-2{ font-size:1.4em; }
	.text-2--media{ max-width:unset; margin-top:1em; }

}

/*
btn
--------------------*/
.btn-1{ padding: 1.34375em 1em; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 28.375em; margin: 0 auto; font-size: 1.6em; font-weight: 700; line-height: calc(24/16); text-align: center; color: #fff; background-color: var(--blue-color); border-radius: 1.5em; gap: .625em; }
.btn-1--external:after{ content: ''; width: 1.25em; height: 1em; background: var(--blue-color) url(../img/icons/window-restore-regular.png) no-repeat center / contain; }
.btn-1--entry{ margin-top: 1.25em; }
.btn-2{ display: inline-flex; align-items: center; gap: 2em; }
.btn-2 svg{ width: 5.6em; height: 5.6em; }
.btn-2-txt{ font-size: 2.4em; font-family: var(--ff-red-hat); font-weight: 600; line-height: calc(32/24); color: #000000; }
.btn-3{ padding:1.3333em .5555em; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 26.6666em; margin: 0 auto; font-size: 1.8em; font-weight: 700; line-height: calc(24/16); text-align: center; color: #fff; background-color: var(--blue-color); border-radius: 1.1111em; gap: .5555em; }
.btn-3--external:after{ content: ''; width: 1.2777em; height: 1.2777em; background: var(--blue-color) url(../img/icons/window-restore-regular.png) no-repeat center / contain; }
.btn-3--entry{ margin-top: 1.1111em; }

@media only screen and (max-width: 768px) {
	.btn-1{ width:100%; max-width: 19em; font-size:1.4em; border-radius:1.3571em; }
	.btn-2 svg{ width:3.9em; height:3.9em; }
	.btn-2-txt{ font-size:1.68em; }
	.btn-3{ width:100%; max-width: 20em; font-size:1.4em; border-radius:1.3571em; }
}


/*
sidebar
------------------*/
#sidebar{ width: 36em; padding-left: 12em; position: sticky; top: 10em; height: fit-content; }
.sidebar__item:not(:nth-child(-n+1)){ margin-top: 2.8em; }
.sidebar__item-link{ transition: color .3s ease; padding-left: 3.5em; position: relative; display: block; font-size: 2em; font-weight: 700; line-height: calc(28/20); color:#D9D9D9; }
.sidebar__item-link:before{ transition: background-color .3s ease; content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 2.45em; height: .7em; background-color: #D9D9D9; }
.sidebar__item-link.is-active{ color: var(--main-color); }
.sidebar__item-link.is-active::before{  background-color: var(--blue-color); }

@media only screen and (max-width: 768px) {
	#sidebar{ width:5em; padding-left:0; top:7em; }
	.sidebar__item-link{  font-size:1.6em; padding-left:1.5em; line-height:1.1em; }
	.sidebar__item-link::before{ height:100%; width:5px; }
	.sidebar__item:not(:nth-child(-n+1)){ margin-top: 1.5em; }
}

/*
footer
--------------------------- */
#footer{ padding: 6em 8em 3em 12em; background-color: var(--blue-color); color: #fff; }
.footer-row{ display: flex; flex-wrap: wrap; justify-content: space-between; }
.footer__logo{ display: block; max-width: 19.4em; }
.footer__company-link{ margin-top: 1em; display: inline-flex; font-weight: 700; font-size: 2em; line-height: calc(28/20); color: #fff; }
.fotoer__company-address{ font-size: 1.2em; font-weight: 400; font-style: normal; line-height: calc(23/12); }
.footer__company-twitter{ margin-top: 1.5em; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; max-width: 20.6em; height: 3.5em; border: 1px solid #fff; gap: 1.5em; border-radius: 2.4em; }
.footer__company-twitter span{ font-size: 1.4em; font-weight: 400; color:#fff; letter-spacing: 0.02em; }
.footer__links{ max-width: 64em; display: inline-flex; flex-wrap: wrap; gap: 5em 0; }
.footer__link{ flex: 0 0 16em; }
.footer__link-txten{ display: block; font-size: 1.2em; font-weight: 700; font-family: var(--ff-red-hat); letter-spacing: 0.05em; line-height: 1; color: var(--sky-blue-color); }
.footer__link-ttl{ display: block; margin-top: 0.6em; font-size: 2em; font-weight: 700; font-family: var(--ff-robot); line-height: calc(28/20); color:#fff; }
.footer__link-list{ margin-top: 1em; }
.footer__link-item{ position: relative; padding-left: 1em; }
.footer__link-item > a{ display: block; font-size: 1.2em; font-family: var(--ff-robot); font-weight: 400; line-height: calc(24/12); color: #fff; }
.footer__link-item::before{ content:'・'; position: absolute; left: -.2em; top: .4em; }

@media only screen and (max-width: 768px) {
	#footer{ padding:4.2em 2em 2.1em; }
	.footer-row{ flex-direction:column; gap:3em }
	.footer__links{ max-width:unset; width:100%; display:flex; gap:3.5em; }
	.footer__link{ flex:0 0 calc(50% - 1.75em); }
}

@media only screen and (max-width: 768px) and (min-width: 500px) {
	.footer__link{ flex:0 0 calc(33% - 3.5em); }
}


/*
drupal
--------------------------- */
.drupal-tabs { position: fixed; top: 180px; left: 30px; z-index: 100; display: flex; background-color: #000; padding: 10px; }
.drupal-tabs li { list-style: none; margin-right: 10px; font-size: 1.4rem; }
.drupal-tabs a { color: #fff; }

.content-login_user { max-width: 500px; margin: 10px auto; padding: 100px 0; }
.content-login_ttl { text-align: center; font-size: 1.8rem; font-weight: 700; }
.content-login_user .user-login-form { margin-top: 50px; }
.content-login_user .form-item { margin-top: 20px; }
.content-login_user label { display: block; font-size: 1.4rem; }
.content-login_user input { margin: 10px 0; padding: 10px; width: 100%; }
.content-login_user .description { font-size: 1.2rem; color: #999; }

.user-logged-in.toolbar-vertical #header { top: 39px; }
.user-logged-in.toolbar-horizontal #header { top: 79px; }