/*
Theme Name: Socio Answer
*/
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Libre+Bodoni:ital,wght@0,400..700;1,400..700&display=swap');

.font-sans-en{
	font-family: "Inter", sans-serif;
}

.font-serif-en{
	font-family: "Libre Bodoni", serif;
}


.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}

*{
	box-sizing:border-box;
}

html{
	background-color:#fff;
	font-size:15px;
}

@media screen and (max-width: 576px) {
	html{
		font-size:14px;
	}
}


body{
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-style: normal;
	font-weight:400;
	display:flex;
	flex-direction:column;
	min-height:100vh;
	overflow-x:clip!important;
	line-height:1.5;
}

main{
	flex:1;

}

img {
	max-width:100%;
}

a{
	color:#646464;
}

.icon-external{
	position:relative;
	line-height:1;

}

.icon-external:after{
	position:absolute;
	content:'';
	display:inline-block;
	width:1em;
	height:1em;
	background-image:url(images/common/icon-external-black.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:contain;
	top:50%;
	transform:translate(0.2em , -50%);
}

.icon-external.white:after{
	background-image:url(images/common/icon-external-white.svg);
}

.full-width{
	width:100vw;
	margin:0 calc(50% - 50vw);
}

.full-width-right{
	width:50vw;
	margin:0 calc(50% - 50vw) 0 0;
}


.full-width-left{
	flex:1;
	width:50vw;
	margin:0 0 0 calc(50% - 50vw);
}
@media screen and (max-width: 768px) {
.full-width-right{
	width:100%;
	margin:0;
	}
.full-width-left{
	width:100%;
	margin:0;
	}
}


#home-logo img{
	width:136px;
}

@media screen and (max-width:576px) {
	#home-logo img{
		width:78px;
	}
}

button.pum-close.popmake-close{
	display:none;
}

.pum-container{
	max-width:80vw!important;
	display:flex;
	justify-content:center;
}

/* ________________________________________
 * Header
 * ________________________________________ */
header{
	z-index:15;
	position:fixed;
	width:100%;
	transition: all 0.3s ease;
	background-color:rgba(255,255,255,0);
}

header.scrolled{
/*	padding:7px 0;*/
	background-color:rgba(255,255,255,0.99);
}

.head__container {
	height:60px;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
}


.head__logo{
	padding:0.5rem;
	width:200px;
	transition:all 0.4s ease;
}

header.scrolled .head__logo{
	width:150px;
}

/*
header nav{
	background-color:#fff;
	border-radius:100vh;
	box-shadow:0px 3px 6px rgba(0,0,0,0.25);
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex:1;
	margin-right:1rem;
	padding-right:1.5rem;
	padding-left:1.5rem;
}



header nav .head__nav{
	flex:1;
	display:flex;
	justify-content:flex-end;
	opacity:1;
	pointer-events:auto;
	transition:all 0.3s ease;
}
*/


header nav .head__nav.is-hidden{
	opacity:0;
	pointer-events:none;
}

header nav .head__nav ul{
	display:flex;
}

header nav .head__nav ul li {
	margin-right:2.75rem;
}

header nav .head__nav ul li a div:nth-child(1){
	font-size:1.1rem;
	letter-spacing:0.05em;
	margin:0 0 0.3em;

}


header nav .head__nav ul li a div:nth-child(2){
	font-size:0.85rem;
}

header  .head__hamburger{
	width:60px;
	height:60px;
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	background-color:#3182ca;
	transition:all 0.3s ease;
}



header.scrolled  .head__hamburger{
/*	box-shadow:0px 2px 4px rgba(0,0,0,0.25);*/
}

header  .head__hamburger .text-menu{
	position:absolute;
	background-color:#3182ca;
	color:#fff;
	top:100%;
	left:0;
	width:60px;
	height:auto;
	display:flex;
	align-items:center;
	justify-content:center;
	padding-top:1.5rem;
	padding-bottom:1.5rem;
}


header  .head__hamburger .text-menu span{
	display:inline-block;
	transform:rotate(90deg);
	letter-spacing:0.1em;
	font-size:12px;
}



header  .head__hamburger > span{
	width:30px;
	height:3px;
	background-color:#fff;
	display:block;
	position:absolute;
	transition:all 0.3s ease;
}

body.is-active  .head__hamburger{
	background-color:transparent;
/*	box-shadow:0 0 0 transparent;*/
}

body.is-active header  .head__hamburger > span{
	background-color:#fff;
}



header  .head__hamburger > span:nth-child(1){
	transform:translatey(-10px);
}

header  .head__hamburger > span:nth-child(3){
	transform:translatey(10px);
}


header  .head__hamburger.is-active > span:nth-child(2){
	opacity:0;
}

header  .head__hamburger.is-active > span:nth-child(1){
	transform:translatey(0) rotate(45deg);
}

header  .head__hamburger.is-active > span:nth-child(3){
	transform:translatey(0) rotate(-45deg);
}

header  .head__drawer{
	z-index:9999;
}
header  .head__dropdown{
	position:fixed;
	top:0;
	left:30vw;
	z-index:-1;
	width:100vw;
	height:100vh;
	background-color:#3182ca;
	padding:4.25rem 1.5rem;
	transform:translate(100vw, 0);
	opacity:1;
	transition:all 0.6s cubic-bezier(0.4, 0.0, 0.2, 1) 0.3s;
	display:flex;
	align-items:flex-start;
}
@media screen and (max-width: 992px) {
header  .head__dropdown{
	left:5vw;
	}
}

header  .head__dropdown:before{
	background:#3182ca;
	opacity:0.75;
	content:'';
	width:100%;
	height:100%;
	display:block;
	position:absolute;
	top:0;
	left:0;
	z-index:-1;
	transition:all 0.25s cubic-bezier(0.4, 0.0, 0.2, 1) 0s;
}

header  .head__dropdown.is-active:before{
	left:-30vw;
		transition:all 0.25s cubic-bezier(0.4, 0.0, 0.2, 1) 0.25s;
}

header  .head__dropdown.is-active{
	transform:translate(0, 0);
	opacity:1;
	transition:all 0.4s cubic-bezier(0.4, 0.0, 0.2, 1);
}

@media screen and (max-width: 992px) {

}


header  .head__dropdown ul.head__dropdown--list{
	margin:0 0 1.5rem;
}

header  .head__dropdown ul.head__dropdown--list li{
	padding:0.75em 0;
}

header  .head__dropdown ul.head__dropdown--list li a{
	color:#fff;
}


header  .head__dropdown ul.head__dropdown--list li a div:nth-child(1){
	font-size:1.1rem;
	letter-spacing:0.05em;
	margin:0 0 0.3em;
}

header  .head__dropdown ul.head__dropdown--list li a div:nth-child(2){
	font-size:0.85rem;
}


header  .head__dropdown ul.head__dropdown--sns{
	display:flex;
	justify-content:space-evenly;
	margin:0 0 1.5rem;
}


.head__reservation{

}

.head__reservation a{
	height:100%;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	padding-right:2.5rem;
	padding-left:2.5rem;
	background-color:#92181E;
	color:#fff;
	border-radius:100vh;
	text-decoration:none;
	box-shadow:0px 3px 6px rgba(0,0,0,0.25);
}

.head__reservation a div:nth-child(1){
	font-size:1.1rem;
	letter-spacing:0.05em;
	transform:translatex(-0.5em);
	margin:0 0 0.3em;
}

.head__reservation a div:nth-child(2){
	font-size:0.85rem;
}


@media screen and (max-width: 1200px) {
	header nav .head__logo{
	width:200px;
}

	header nav .head__nav{
		display:none;
	}
}

@media screen and (max-width: 576px) {



	header nav{
		margin:0;
		transition: width .25s ease 0.6s;
		padding-right:1rem;
		padding-left:1rem;
		width:50%;
		flex:0 1 auto;
		position:relative;
	}
	header nav .head__drawer{
		position:static;
	}

	header nav + .head__reservation{
		margin:0 0.6rem 0 0;
		transition:opacity 0.2s ease 1.2s, transform 0.2s ease 1.2s, width 0.3s linear 0.65s, margin 0s ease 0.9s;
		width:50%;
	}

	body.is-active header nav{
		width:100%;
		transition: width .3s ease 0.4s;
	}
	body.is-active  header nav + .head__reservation{
		margin:0;
		opacity:0;
		transform:translatex(-100%);
		width:0;
		transition:opacity 0.2s ease, transform 0.2s ease, width 0.2s ease 0.4s;
	}

	header nav .head__logo{
		width:100px;
		max-width:100%;
		margin-right:auto;
		margin-left:auto;
		transform:translatex(12px);
	}


header nav + .head__reservation a{
	padding-right:1.25rem;
	padding-left:1.25rem;
	}

header nav + .head__reservation a div:nth-child(1){
	font-size:0.7rem;
	letter-spacing:0.05em;
	transform:translatex(-0.5em);
	margin:0 0 0.3em;
}

header nav + .head__reservation a div:nth-child(2){
	font-size:1rem;
}


	header nav .head__dropdown{
		position:absolute;
		top:auto;
		bottom:1rem;
		right:1%;
		z-index:-1;
		width:98%;
		display:block;
		transform:translatey(1.5rem);
transition:opacity 0.25s ease, transform 0.25s ease;
		border-bottom-left-radius:0;
		border-bottom-right-radius:0;
		padding-bottom:3rem;
	}

	header nav .head__dropdown.is-active{
		transform:translatey(-1.5rem);
		opacity:1;
		transition:opacity 0.45s ease 0.6s, transform 0.45s ease 0.6s;
		pointer-events:auto;
	}

}


.menu {
max-width:90vw;
	width:30rem;
position:relative;
}
.menu .menu-item {}
.menu .menu-item  .menu-item-btn {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      background-color: transparent;
      cursor: pointer;
	color:#fff;
	font-size:1.5rem;
	font-weight:bold;
	padding:0.75rem 0;
	position:relative;
}

.menu .menu-item  .menu-item-btn:before {
	font-family:'Material Symbols Outlined';
	content:'\e313';
	display:inline-block;
	font-weight:100!important;
	color:#fff;
	font-size:2.5rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.25rem;
	transition:all 0.3s ease;
	transform-origin:50% 50%;
}

.menu .menu-item  .menu-item-btn.active:before{
	transform:rotate(540deg);
}



.menu .menu-item ul {
      display: none;
	margin:0 0 1.5rem 3.25rem;
}
 .menu .menu-item ul li {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        background-color: transparent;
      }
.menu .menu-item ul li a{
	color:#fff;
	padding:0.75rem 0;
}

.menu li a{
	color:#fff;
	font-size:1.25rem;
	padding:0.5rem 0;
	display:inline-block;
	font-weight:bold!important;
}

.menu li.button{
	background-color:#fff;
	margin:0.75rem 0;
}

.menu li.button a{
	color:#3182ca;
	padding:1.25rem 1.75rem 1.25rem 3.5rem;
	position:relative;
}

.menu li.button a:before{
	font-family:'Material Symbols Outlined';
	content:'\e5c8';
	display:inline-block;
	font-weight:200!important;
	font-size:1.5rem!important;
	position:absolute;
	top:1.1.25rem;
	left:1.5rem;
	
}


ul.header__nav{
	display:flex;
	justify-content:flex-end;
	align-items:center;
	height:100%;
}

ul.header__nav li{

	height:100%;
	display:flex;
	align-items:center;
}

ul.header__nav li a{
	color:#fff;
	padding:0 0.35rem;
	display:flex;
	font-size:1.1rem;
	align-items:center;
}

header.scrolled ul.header__nav li a{
	color:#000;
}

ul.header__nav li.recruit a{
	background-color:rgba(103,164,218,1);
	color:#fff!important;
	display:flex;
	width:100%;
	height:100%;
}

ul.header__nav li.contact a{
	background-color:rgba(49,130,202,1);
	color:#fff!important;
	display:flex;
	width:100%;
	height:100%;
}



.subMenu {
  position: absolute;
	top:100%;
  padding: 0;
  display: none;
	background-color:rgba(255,255,255,0.9);
}

.subMenu  li a{
	display:block;
	padding:0.75rem 1rem!important;
	color:#000!important;
}



/* ________________________________________
 * Footer
 * ________________________________________ */

footer{
	background-color:#3182ca;
	padding:4.5rem 0;
	color:#fff;
}

footer a{
	color:#fff;
}

footer h3{
	font-size:1.45rem;
	font-weight:500;
	margin:0 0 1.5rem;
	letter-spacing:0.075em;
}

footer ul.footer__menu li{
	margin:0 0 1rem;
}

.footer__logo{
	width:400px;
	max-width:90vw;
	margin:1rem auto 2.5rem auto;
}

.footer__nav{
	display:flex;
	flex-wrap:wrap;
	gap:1.25rem;
}

.footer__nav > div{
	width:calc(25% - 1rem);
}

ul.footer__nav--menu{
	margin:0 0 2.25rem;
}

ul.footer__nav--menu li a div:nth-child(1){
	font-size:1.1rem;
	letter-spacing:0.05em;
	margin:0 0 0.3em;
}

ul.footer__nav--menu li a div:nth-child(2){
	font-size:0.85rem;
}

.footer__nav--sns{
	display:flex;
	justify-content:space-evenly;
	margin:0 0 2.5rem;
}

.footer__copyright {
	text-align:center;
	margin:0 0 1rem;
}

footer .contact__button-container{
	display:flex;
	align-items:flex-start;
}



footer .contact__button{
	display:flex;
	align-items:center;
	background-color:#fff;
	padding:1rem;
	border-radius:0.75rem;
	color:#b9194b;
	font-weight:bold;
	letter-spacing:0.05em;
	font-size:1.25rem;
	box-shadow:2px 2px 0px rgba(0,0,0,0.3);
	position:relative;
	transition:all 0.3s ease;
}

footer .contact__button:before{
	font-family:'Material Symbols Outlined';
	content:'\e5c8';
	display:inline-block;
	font-weight:100!important;
	color:#fff;
	background-color:#b9194b;
	border-radius:100vh;
	width:1.5rem;
	height:1.5rem;
	font-size:1.5rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.5rem;
	transition:all 0.3s ease;
}

footer .contact__button:hover:before{
	background-color:rgba(185,25,75,0.7);
}
footer .contact__button:hover{
	color:rgba(185,25,75,0.7);
	background-color:rgba(255,255,255,0.75)
}

footer .material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}

@media screen and (max-width: 992px) {

	.footer__nav > div{
		width:calc(100%);
	}

}

/* ________________________________________
 * Main
 * ________________________________________ */

main{

}


@media screen and (max-width: 576px) {
	main{
	padding-top:0px;
	}

}


/* ------------------------------------------------------------
 * Front Page
 * ------------------------------------------------------------ */

.transition__container{
	position:fixed;
	width:100%;
	height:100%;
	overflow:hidden;
	z-index:9999;
	pointer-events:none;
}

.transition__left{
	background-color:#fff;
	width:200vw;
	height:100vh;
	transform:skewX(-34deg);
	overflow:hidden;
	position:absolute;
	top:0;
	left:-150vw;
	transition:all 0.65s ease-in-out 0.75s;
}

.transition__right{
	background-color:#fff;
	width:200vw;
	height:100vh;
	transform:skewX(-34deg);
	overflow:hidden;
	position:absolute;
	top:0;
	right:-150vw;
	transition:all 0.65s ease-in-out 0.75s;
}

.transition__center{
	position:absolute;
	width:3rem;
	height:100vh;
	transform-origin:50% 50%;
	transform:skewX(-34deg) translatex(-50%);
	background-color:#b9194b;
	content:'';
	top:-100vh;
	left:calc(50% + 67.45vh);
	z-index:9999;
	overflow:hidden;

animation-name: transition__center;
animation-fill-mode:forwards;
animation-duration:2.5s;
animation-iteration-count:1;
animation-timing-function:ease-in-out;
animation-delay: 0.2s;
animation-direction:normal;
}

@keyframes transition__center{
  0% {
    top: -100vh;
	  left:calc(50% + 67.45vh);
  }
  40% {
    top: 0;
  left:50%;
  }
	90%{
    top: 0;
  left:50%;
		opacity:1;
	}
  100% {
    top: 0;
  left:50%;
	opacity:0;
  }
}


body.loaded .transition__left{
	left:-300vw;
}

body.loaded .transition__right{
	right:-300vw;
}



body.home section{
	padding:4.5rem 0;
}

body.home section:first-child{
	padding:0rem 0;
}

body.home section h2{

}


body.home section h2 span img {

}



body.home section h2{

}

/* ----------------------------------------
* Home - Hero
* ---------------------------------------- */

section#home__hero{
	height:100vh;
	position:relative;
	padding:0;
}

section#home__hero:after{
	position:absolute;
	width:3rem;
	height:100vh;
	transform-origin:50% 50%;
	transform:skewX(-34deg) translatex(-50%);
	background-color:#b9194b;
	content:'';
	top:0;
	left:50%;
}


section#home__hero .home__hero-top{
	position:relative;
	width:100%;
	height:60vh;

}

section#home__hero .home__hero-top:before{
    position   : absolute;
    content    : "";
    top     : 0px;
    left      : 0px;
    height     : 60vh;
    width      : 100vw;
    background :#fff;
    clip-path  : polygon(0% 0%, calc(50vw + 33.625vh) 0%, calc(50vw - 6.845vh) 100%, 0% 100%);
}

section#home__hero .home__hero-top:after{
    position: absolute;
	display:block;
    content: "";
    top: 0px;
	right:0px;
	width:calc(50vw  + 6.845vh) ;
	height:60vh;
	background-image:url(images/home/hero__top-bg.jpg);
	background-position:50% 50%;
	background-size:cover;
	background-repeat:no-repeat;
	z-index:-1;
}

section#home__hero .home__hero-top .container{
	position:relative;
	z-index:1;
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	height:100%;
}

section#home__hero .home__hero-bottom{
	height:40vh;
	position:relative;
	width:100%;
}

section#home__hero .home__hero-bottom:before{
    position   : absolute;
    content    : "";
    top     : 0px;
    right      : 0px;
    height     : 40vh;
    width      : 100vw;
    background :#fff;
    clip-path  : polygon(100% 0%, calc(50vw - 6.845vh) 0%, calc(50vw - 33.625vh) 100%, 100% 100%);
}

section#home__hero .home__hero-bottom:after{
    position: absolute;
	display:block;
    content: "";
    top: 0px;
	left:0px;
	width:calc(50vw  - 6.845vh) ;
	height:40vh;
	background-image:url(images/home/hero__bottom-bg.jpg);
	background-position:50% 50%;
	background-size:cover;
	background-repeat:no-repeat;
	z-index:-1;
}
section#home__hero .home__hero-bottom .container{
	position:relative;
	z-index:1;

	height:100%;
}



.hero__description{
	font-size:1.15rem;
	font-weight:bold;
	letter-spacing:0.075em;
	line-height:1.8;
}


.hero__button{
	display:flex;
	align-items:flex-start;
	background-color:#b9194b;
	padding:1rem;
	border-radius:0.75rem;
	color:#fff;
	font-weight:bold;
	letter-spacing:0.05em;
	font-size:1.25rem;
	box-shadow:2px 2px 0px rgba(0,0,0,0.3);
	position:relative;
	transition:all 0.3s ease;

}

.hero__button:before{
	font-family:'Material Symbols Outlined';
	content:'\e5c8';
	display:inline-block;
	font-weight:100!important;
	color:#b9194b;
	background-color:#fff;
	border-radius:100vh;
	width:1.5rem;
	height:1.5rem;
	font-size:1.5rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.5rem;
	transition:all 0.3s ease;
}

.hero__button:hover:before{
	color:rgba(185,25,75,1);
	background-color:rgba(255,255,255,01)

}
.hero__button:hover{
	background-color:rgba(185,25,75,0.7);
}


section#hero .material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}



.hero__copy {
	color:#b9194b;
	font-size:3.25rem;
	font-weight:bold;
	letter-spacing:0.075em;
	line-height:1.7;
	margin:auto 0;
}

a.scroll-down{
  display: inline-block;
  position: absolute;
  right: 40px;
  bottom: 0;
  z-index: 2;
  padding: 10px 10px 110px;
  overflow: hidden;
	color:#b9194b;
  font-size: 0.75rem;
  font-family: 'Inter', sans-serif;
  line-height: 1;
  letter-spacing: .075em;
  text-transform: uppercase;
  text-decoration: none;
  writing-mode: vertical-lr;
	transition:all 0.3s ease;
}

a.scroll-down:hover{
	color:rgba(185,25,75,0.4);
}

a.scroll-down::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 1px;
  height: 100px;
  background: #b9194b;
  animation: sdl 1.5s cubic-bezier(1, 0, 0, 1) infinite;
}
@keyframes sdl {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}



/* ----------------------------------------
* Home - Service
* ---------------------------------------- */

section#home__service{
	position:relative;
}


section#home__service:before{
/*	width:10rem;
	height:90rem;
	background-image:url(images/home/corporate-name.svg);
	background-repeat:no-repeat;
	background-position:100% 100%;
	background-size:contain;
	position:absolute;
	right:0;
	top:calc(100% - 4rem);
	transform:translate(0, -100%);*/
}

section#home__service h2{
/*	background-image:url(images/home/section__graphic-service.svg);
	background-position:50% 50%;*/
}



section#home__service .container{
	position:relative;
}


section#home__service .container:before{
	background-repeat:no-repeat;
	background-size:auto 100%;
	height:220px;
	width:360px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	background-image:url(images/home/section__graphic-service.svg);
	background-position:50% 50%;
	background-size:contain;
	content:'';
	position:absolute;
	left:50%;
	top:0%;
	transform:translate(-50%, 2.5rem);
	opacity:0;
	transition:all 0.45s ease 0.6s;
	z-index:-1;
}

section#home__service.is-show .container:before{
	transform:translate(-50%, 0);
	opacity:1;

}


/*
section#home__service .section__graphic{
	content:'';
	width:10rem;
	height:90rem;
	position:absolute;
	right:50%;
	top:0;
	background-image:url(images/home/section__graphic-service.svg);
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	background-size:contain;
}
*/

section#home__service .content__container{
	display:flex;
	flex-wrap:wrap;
	gap:2rem;
}

section#home__service .content__container .content__item{
	width:calc(33.3333333% - 1.333333333333333rem);
}



section#home__service .content__container .content__item .content__inner{
	background-color:#eeecec;
	border-radius:0.75rem;
	display:flex;
	flex-direction:column;
	height:100%;
	padding:1.5rem;
	transition:all 0.45s ease;
}



section#home__service .content__container .content__item .content__inner .content__image{
	width:40%;
	border-top-left-radius:0.75rem;
	border-bottom-left-radius:0.75rem;
}

section#home__service .content__container .content__item .content__inner .content__image img{
	border-top-left-radius:0.75rem;
	border-bottom-left-radius:0.75rem;
}

section#home__service .content__container .content__item .content__inner .content__text{
	width:60%;
	padding:1.75rem;
}

@media screen and (max-width: 1200px) {
	section#home__service .content__container .content__item{
		width:100%;
	}
	section#home__service .content__container .content__item .content__inner .content__image{
	width:25%;
	}
	section#home__service .content__container .content__item .content__inner .content__text{
	width:75%;
	}
}

section#home__service .content__container.main .content__item .content__inner h3{
	font-size:1.35rem;
	font-weight:bold;
	line-height:1.25;
	margin:0 0 1.25rem;
	background-image:url(images/home/service__icon-01.svg);
	background-repeat:no-repeat;
	background-position:100% 50%;
	height:6.5rem;
	display:flex;
	align-items:center;
}


section#home__service .content__container.main .content__item a:hover .content__inner{
	background-color:rgba(238,236,236,0.5);


}


section#home__service .content__container.main .content__item:nth-child(2) .content__inner h3{
	background-image:url(images/home/service__icon-02.svg);
}


section#home__service .content__container.main .content__item:nth-child(3) .content__inner h3{
	background-image:url(images/home/service__icon-03.svg);
}


section#home__service .content__container .content__item .content__inner .content__description{
	font-weight:bold;
	line-height:1.8;
	font-size:0.9rem;
}

section#home__service .content__container.main{
	margin:0 0 3.5rem;
}


section#home__service .content__container.sub .content__item .content__inner{
	background-color:transparent;
	display:flex;
	flex-direction:column;
	height:100%;
	padding:1.5rem;
	transition:all 0.45s ease;
}

section#home__service .content__container.sub .content__item a:hover .content__inner{
	background-color:rgba(238,236,236,0.5);

}

section#home__service .content__container.sub .content__item a{
	display:block;
}

section#home__service .content__container.sub .content__item .content__inner h3{
	font-size:1.35rem;
	font-weight:bold;
	line-height:1.25;
	margin:0 0 0.75rem;
	background-image:url(images/home/service__icon-sub01.svg);
	background-repeat:no-repeat;
	background-position:0% 50%;
	height:6.5rem;
	display:flex;
	align-items:center;
	padding-left:9.5rem;
}


section#home__service .content__container.sub .content__item:nth-child(2) .content__inner h3{
	background-image:url(images/home/service__icon-sub02.svg);
}


section#home__service .content__container.sub .content__item:nth-child(3) .content__inner h3{
	background-image:url(images/home/service__icon-sub03.svg);
}


section#home__service .content__container.sub .content__item:nth-child(4) .content__inner h3{
	background-image:url(images/home/service__icon-sub04.svg);
}


section#home__service .content__container.sub .content__item:nth-child(5) .content__inner h3{
	background-image:url(images/home/service__icon-sub05.svg);
}


section#home__service .content__container.sub .content__item a .content__inner .arrow{
	display:inline-block;
	position:relative;
	height:1rem;
	width:6rem;
	margin-left:auto;
	transition:all 0.45s ease;
}

section#home__service .content__container.sub .content__item a:hover .content__inner .arrow{
	transform:translate(1rem, 0);
}


section#home__service .content__container.sub .content__item .content__inner .arrow:before{
	content:'';
	display:block;
	width:6rem;
	height:1px;
	background-color:#b9194b;
	position:relative;
	transition:all 0.45s ease;
	right:0;
}



section#home__service .content__container.sub .content__item .content__inner .arrow:after{
	content:'';
	display:block;
	width:0.75rem;
	height:1px;
	background-color:#b9194b;
	position:absolute;
	transform-origin:100% 50%;
	transform:rotate(45deg) translatey(0.5px);
	right:0;
	left:auto;
	top:0;
	transition:all 0.45s ease;
}

section#home__service .content__container.sub .content__item a:hover .content__inner .arrow:before{
	width:7rem;
}

section#home__service .content__container.sub .content__item a:hover .content__inner .arrow:after{
	right:-1rem;
}

/* ----------------------------------------
* Home - Achievements
* ---------------------------------------- */

/*
section#home__achievements h2{
	background-image:url(images/home/section__graphic-achievements.svg);
	background-position:100% 50%;
}
*/


section#home__achievements{
	background-color:#eeecec;
}


section#home__achievements .container{
	position:relative;
}


section#home__achievements .container:before{
	background-repeat:no-repeat;
	background-size:auto 100%;
	height:220px;
	width:350px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	background-image:url(images/home/section__graphic-achievements.svg);
	background-position:100% 50%;
	background-size:contain;
	content:'';
	position:absolute;
	right:0;
	top:0%;
	transform:translatey(2.5rem);
	opacity:0;
	transition:all 0.45s ease 0.6s;
}

section#home__achievements.is-show .container:before{
	transform:translatey(0);
	opacity:1;

}

section#home__achievements .content__container{
	display:flex;
	flex-wrap:wrap;
	gap:2rem;
}

section#home__achievements .content__container .content__item{
	width:calc(50% - 1rem);
}



section#home__achievements .content__container .content__item .content__inner{
	background-color:#fff;
	border-radius:0.75rem;
	display:flex;
}

section#home__achievements .content__container .content__item .content__inner .content__image{
	width:40%;
	border-top-left-radius:0.75rem;
	border-bottom-left-radius:0.75rem;
}

section#home__achievements .content__container .content__item .content__inner .content__image img{
	border-top-left-radius:0.75rem;
	border-bottom-left-radius:0.75rem;
}

section#home__achievements .content__container .content__item .content__inner .content__text{
	width:60%;
	padding:1.75rem;
}

@media screen and (max-width: 1200px) {
	section#home__achievements .content__container .content__item{
		width:100%;
	}
	section#home__achievements .content__container .content__item .content__inner .content__image{
	width:25%;
	}
	section#home__achievements .content__container .content__item .content__inner .content__text{
	width:75%;
	}
}


section#home__achievements .content__container .content__item .content__inner .content__text h3{
	font-size:1.5rem;
	font-weight:bold;
	color:#b9194b;
	margin:0 0 1.25rem;
}

section#home__achievements .content__container .content__item .content__inner .content__text .content__description{
	font-weight:bold;
	line-height:1.8;
	font-size:0.9rem;
}

section#home__divider {
	width:100vw;
	height:auto;
	aspect-ratio:3840 / 1080;
	background-image:url(images/home/section__divider.jpg);
	background-size:101%;
	background-repeat:no-repeat;
	background-position:50% 505;


}




/* ----------------------------------------
* Home - News
* ---------------------------------------- */

.news__button-container{
	text-align:right;
}
.news__button{
	width:12rem;
	display:flex;
	align-items:center;
	justify-content:center;
	background-color:#b9194b;
	padding:1rem;
	border-radius:0.75rem;
	color:#fff;
	font-weight:bold;
	letter-spacing:0.05em;
	font-size:1.25rem;
	box-shadow:2px 2px 0px rgba(0,0,0,0.3);
	position:relative;
	margin-left:auto;
	transition:all 0.3s ease;

}

.news__button:before{
	font-family:'Material Symbols Outlined';
	content:'\e5c8';
	display:inline-block;
	font-weight:100!important;
	color:#b9194b;
	background-color:#fff;
	border-radius:100vh;
	width:1.5rem;
	height:1.5rem;
	font-size:1.5rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.5rem;
	transition:all 0.3s ease;
}

section#news .material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 24
}

.news__button:hover:before{
	color:rgba(185,25,75,1);
	background-color:rgba(255,255,255,01)

}
.news__button:hover{
	background-color:rgba(185,25,75,0.7);
}

ul.latest-posts{
	margin:0 0 3.5rem;
}

ul.latest-posts li{
	border-bottom:1px solid #646464;
}

ul.latest-posts li:first-child{
	border-top:1px solid #646464;
}

ul.latest-posts li a{
	padding:2.25rem 3rem 2.25rem 1rem;
	display:block;
	font-weight:bold;
	position:relative;
	line-height:1.6;
}

ul.latest-posts li a .post-date{
	display:inline-block;
	width:8rem;
}

ul.latest-posts li a .post-category{
	color:#b9194b;
	border:1px solid #b9194b;
	border-radius:0.35rem;
	padding:0.25rem;
	width:10rem;
	text-align:center;
	margin:0 2rem 0 0 ;
	display:inline-block;
	line-height:1;
}

ul.latest-posts li a:after{
	position:absolute;
	right:0;
	top:50%;
	transform:translate(0,-50%);
	font-family:'Material Symbols Outlined';
	content:'\e5c8';
	display:block;
	font-weight:100!important;
	color:#b9194b;
	border:1px solid #b9194b;
	border-radius:100vh;
	width:2.0rem;
	height:2.0rem;
	font-size:1.75rem!important;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-right:0.5rem;
	transition:all 0.45s ease;
}

ul.latest-posts li a:hover:after{
	color:rgba(185,25,75,0.35);
	border-color:rgba(185,25,75,0.35);
}

@media screen and (max-width: 992px) {
	ul.latest-posts li .post-title{
		display:block;
		margin:0.75rem 0 0 0;
	}


/* _________________________________________
 * Single Page
 * ________________________________________ */

.pageheader{
	padding:4.5rem 0;
}

.pageheader .pageheader__title--en{
	text-align:center;
	font-size:1.5rem;
	letter-spacing:0.05em;
	margin:0 0 0.5rem;
}

.pageheader .pageheader__title--jp{
	text-align:center;
	font-size:1.0rem;
}

	@media screen and (max-width::750px){
	body.page section > .container,
	section.gird-container{
		padding-right:1.5rem;
		padding-left:1.5rem;
	}
	}

/* ________________________________________
 * Shop info
 * ________________________________________ */

div.shop{
	position:relative;
}

a.shop__link{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}

div.shop .shop__thumb{
	margin:0 0 1rem;
}

div.shop .shop__header{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	margin:0 0 1rem;
}

div.shop .shop__name{
	font-weight:normal;
	color:#000;
}

div.shop .shop__name .en{
	font-size:1.25rem;
	letter-spacing:0.05em;
}
div.shop .shop__name .divider{
	font-size:1.1rem;
}

div.shop .shop__name .jp{
	font-size:0.85rem;
}

div.shop .shop__tel{
	font-size:1.1rem;
	letter-spacing:0.05em;
	margin:0 0 1rem;
}

div.shop .shop__address--en{
	letter-spacing:0.05em;
	font-size:0.9em;
	margin:0 0 0.5rem;
}

div.shop .shop__address--jp{
	font-size:0.9em;
	margin:0 0 1.5rem
}

div.shop .shop__googlemaps{
	margin-left:auto;
}
div.shop .shop__googlemaps > a{
	position:relative;
	display:flex;
	align-items:center;

}

div.shop .shop__googlemaps > a:before{
	position:absolutel;
	content:'';
	display:inline-block;
	width:20px;
	height:20px;
	background-image:url(images/common/icon-marker.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:contain;
	left:0;
}

/* ________________________________________
 * Shop info Single page
 * ________________________________________ */

.shop__menu a{
	background-color:rgba(146,24,30,1);
	color:#fff;
	text-align:center;
	display:block;
	border-radius:100vh;
	padding:0.5rem 1rem;
	letter-spacing:0.1em;
}

dl.shop__concept dt {
	text-align:center;
}

dl.shop__concept dt span {
  background:  rgba(255,255,255,1);
  cursor: pointer;
  font-size: 1em;
	letter-spacing:0.1em;
  padding: 0.5rem 3rem;
  position: relative;
	transition:all 0.3s ease;
display:inline-block;
	margin:0 auto;
	border-radius:100vh;
	font-weight:normal;
}


dl.shop__concept dt span:after {
	position: absolute;
	display:inline-block;
	content: '';
	width:11px;
	height:1px;
	background-color:#000;
	top: 50%;
	right: 11px;
	transition:all 0.3s ease;
}



dl.shop__concept dt span:before {
	position: absolute;
	display:inline-block;
	content: '';
	width:11px;
	height:1px;
	background-color:#000;
	top: 50%;
	right: 11px;
	transform:rotate(90deg);
	transform-origin:50% 50%;
	transition:all 0.3s ease;
}



dl.shop__concept dt span.open:after {
	opacity:0;
}

dl.shop__concept dt span.open:before {
	transform:rotate(360deg);
}


dl.shop__concept dt.open:before,
dl.shop__concept dt:hover:before,
dl.shop__concept dt:hover:after{
	background-color:transparent;
}

dl.shop__concept dd {
  display: none;
  padding: 0;
	margin:0;
	position:relative;
}

.shop__concept--en,
.shop__concept--jp{
	line-height:1.6;
}

.detail{
	line-height:1.4;
}

.detail__name{
	margin:0 0 2.25rem;
}

.detail__name--en{
	font-size:2.25rem;
	margin:0 0 0.25rem;
	letter-spacing:0.05em;
}

.detail__name--jp{
	font-size:1rem;
}

.detail__tel{
	font-size:1.1rem;
	margin:0 0 2.25rem;
}

.detail__address{
	margin:0 0 2.25rem;
}


.detail__address--en{
	margin:0 0 0.25rem;
}


.detail__address--jp{

}

.detail__googlemaps{
	margin:0 0 2.25rem;
}

.detail__googlemaps a{
	position:relative;
	display:flex;
	align-items:center;

}

.detail__googlemaps a:before{
	position:absolutel;
	content:'';
	display:inline-block;
	width:20px;
	height:20px;
	background-image:url(images/common/icon-marker.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:contain;
	left:0;
}

.detail__hours{
	margin:0 0 2.25rem;
	line-height:1.4;
}

.detail__credit{
	margin:0 0 2.25rem;
}

.detail__seat{
	margin:0 0 2.25rem;
}

.detail__seat--en{
	margin:0 0 0.25reml
}

.detail__seat--jp{

}

.detail__map{
	margin:0 0 1.5rem;
}

.detail__access{

}

.detail__access--en{
	margin:0 0 0.75rem;
	line-height:1.4;
}

.detail__access--jp{
	margin:0 0 0.25reml
	line-height:1.3;
}


#accordion{

	display:none;
  list-style: none;
  font-size: 16px;
  line-height: 1;
  margin: 0;
  padding: 0;
}
#accordion > li{
  padding: 0;
}
#accordion li a{
  display: block;
  position:relative;
  color: #333;
  text-decoration:none;
  text-shadow: 0 1px 1px rgba(255,255,255,.7);
  padding: 15px 45px;
  border-bottom: 1px solid #79bfd6;
  border-top: 1px solid #eef7fa;
  -moz-transition: .3s;
  -webkit-transition: .3s;
  -o-transition: .3s;
  -ms-transition: .3s;
  transition: .3s;
}
#accordion > li:first-child > a{
  border-top: 0px;
}
#accordion > li a:before {
  position: absolute;
  top: 50%;
  left: 15px;
  font: 24px/100% 'Typicons';
  content: "\0023";
  color: #2f7f99;
  margin-top: -10px;
  text-shadow: 1px 1px 0px rgba(255,255,255,.7);
}
#accordion li a:hover{
  color: #1b4958;
  background: rgba(0,0,0,.1);
  border-top-color: #c7e4ee;
}
.arrow{
  position:absolute;
  top:50%;
  right: 30px;
  width: 30px;
  height: 20px;
  line-height: 1;
  text-shadow: 0 -1px 0px rgba(0,0,0,.3);
  margin-top: -10px;
  color: #d4ebf2;
  -moz-transition: .3s;
  -webkit-transition: .3s;
  -o-transition: .3s;
  -ms-transition: .3s;
  transition: .3s;
}
.arrow:before{
  font: 30px 'Typicons';
  content: "7";
}
#accordion li > a:hover .arrow{
  color: #2f7f99;
}
.rotate {
  color:#2f7f99;
  -moz-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
#accordion li ul {
  list-style: none;
  background: #e1f1f6;
  margin: 0;
}
#accordion li ul li a{
  position:relative;
  background: none;
  line-height: 1;
  padding: 15px 70px;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #a0d2e2;
}
#accordion li ul li a:before {
  position: absolute;
  top: 50%;
  left:45px;
  content: "x";
  font:16px/100% 'Typicons';
  color: #2f7f99;
  margin-top: -8px;
  text-shadow: 1px 1px 0 rgba(0,0,0,.5);https://suntoplogi.staging-gig.com/wp-admin/plugins.php
  -moz-transition: .3s;
  -webkit-transition: .3s;
  -o-transition: .3s;
  -ms-transition: .3s;
  transition: .3s;
}
#accordion li ul li:first-child a{
  border-top: 0px;
  box-shadow: 0 7px 7px -7px rgba(0,0,0,.5) inset;
}
#accordion li ul li:last-child a{
  border-bottom: 1px solid #5fb3ce;
}
#accordion li ul li a:hover{
  background: #d4ebf2;
  border-top-color: #eef7fa;
}

}


a.scroll-down{
  display: inline-block;
  position: absolute;
  right: 40px;
  bottom: 0;
  z-index: 2;
  padding: 10px 10px 110px;
  overflow: hidden;
  background-color: transparent;
	color:#fff;
  font-size: 14px;
  font-family: 'Inter', sans-serif;
  line-height: 1;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  writing-mode: vertical-lr;
}

a.scroll-down:hover{
	color:rgba(255,255,255,0.4);
}

a.scroll-down::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 1px;
  height: 100px;
  background: #fff;
  animation: sdl 1.5s cubic-bezier(1, 0, 0, 1) infinite;
}
@keyframes sdl {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}

.n2-padding{
	position:relative;
}



body.home #home__about {
	position:relative;
	z-index:1;
	overflow-x:clip;
}

body.home #home__about h2.section__title{
	position:absolute;
	right:0;
	top:0;
	font-size:7.5rem;
	line-height:1;
	transform:rotate(-90deg) translate(7%,11%);
	transform-origin:100% 100%;
	font-weight:600;
	z-index:99;
	text-transform:uppercase;
	color:#3182ca;
	white-space:nowrap;
	pointer-events:none;
/*	mix-blend-mode:difference;*/
}


body.home #home__service {
	position:relative;
	z-index:0;
}

body.home #home__service h2.section__title{
	position:absolute;
	left:0;
	top:0;
	font-size:7.5rem;
	line-height:1;
	transform:rotate(90deg) translate(-7%,-5%);
	transform-origin:0% 100%;
	font-weight:600;
	z-index:99;
	text-transform:uppercase;
	color:#3182ca;
/*	mix-blend-mode:difference;*/
}





.l-container {
  width: 100%;
  height: auto;
  position: relative;
overflow:hidden;
}

/* 左 */
.l-left-content {
  width: 50%;
max-width:660px;
  height: 100vh;
  background-color: #ffffff;
  position: fixed;
  top: 0;
  left: calc(50vw - 660px);
  z-index: -1;
}

.l-left-content__inner {
  height: 100%;
  display: flex;
flex-direction:column;
  align-items: center;
  justify-content: center;
  padding: 80px 40px;

width:

}

.p-left-content__title {
  font-weight: 700;
  font-size: 36px;
  line-height: 1.5;
  letter-spacing: 0.1em;
  text-align: center;
}

/* 右 */
.l-right-content {
  width: 50%;
  margin-left: auto;
min-height:100vh;
}
.l-right-content.--1 {

position:sticky;
top:0;

}
.l-right-content.--2 {
}
.l-right-content.--3 {
}
.l-right-content__inner {

}

.p-right-content__text {
  font-size: 20px;
  line-height: 3;
  letter-spacing: 0.1em;
  text-align:justify;

}
.p-right-content__text img{
object-fit:cover;
max-width:none;
max-height:100vh;
}

/* タイトルのフェードイン/フェードアウトの切り替わり設定 */
/* デフォルト（非表示状態にしておく） */
.js-scroll-element .l-left-content {
  cursor: default;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}
/* 表示時 */
.js-scroll-element .l-left-content.is-on {
  cursor: auto;
  pointer-events: auto;
  opacity: 1;
}
/* 非表示に切り替えるための設定 */
.js-scroll-element .l-left-content.is-off {
  opacity: 0;
}
/* フッター上で固定させる */
.js-scroll-element .l-left-content.is-absolute {
  opacity: 1;
  height: 100%;
  pointer-events: auto;
  cursor: auto;
  position: absolute;
  z-index: 1;
}
/* フッター上で固定させた要素内のコンテンツを下付きにする */
.js-scroll-element .l-left-content.is-absolute .l-left-content__inner {
  align-items: flex-end;
}

/* フッター */
.l-footer {
  width: 100%;
  position: relative;
  z-index: 5;
visiblity:hidden;
height:0;
}

.p-footer__copyright {
  text-align: center;
}

.p-footer__copyright small {
  color: #fff;
  font-size: 14px;
  display: inline-block;
}








.grid-container {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  grid-gap: 32px 0;
}

.main_copy{
	padding-right:1.5rem;
	padding-left:1.5rem;
	z-index:10;
	position:relative;
}

@media screen and (min-width: 600px) {
  .grid-container {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 1fr;
    grid-gap: 32px 3.125vw;
  }

  .main_copy {
	  padding:0;
    grid-column: 2 / 8;
    grid-row: 1;
    align-self: flex-end;
    z-index: 2;
	  position:relative;
  }

  .main_img {
    grid-column: 3 / -1;
    grid-row: 1;
    z-index: 1;
  }

  .grid-container.inverse .main_copy {
    grid-column: 7 / 13;
    grid-row: 1;
    align-self: flex-end;
    z-index: 2;
/*	  text-align:right;*/
  }

  .grid-container.inverse .main_img {
    grid-column: 1 / 11;
    grid-row: 1;
    z-index: 1;
  }

}


.grid-container .button__detail{
	position:absolute;
	background-color:rgba(49, 130, 202, 1);
	display:flex;
	align-items:center;
	justify-content:center;
	width:3rem;
	height:3rem;
	color:#fff;
	bottom:0;
	right:0;
	transform:translate(50%, 50%);
	z-index:100;
}

.grid-container.inverse .button__detail{
	right:auto;
	left:0;
	transform:translate(-50%, 50%);
}




@media screen and (min-width: 750px) {
  .wrapper {
    display: flex;
    flex-wrap: wrap;
  }
  .wrapper:nth-of-type(2n) .text {
    order: -1;
  }
}
.wrapper:nth-of-type(2n + 1) {
}
.wrapper:nth-of-type(2n + 1) .title {
}
.wrapper:nth-of-type(2n + 1) .text {
}
.wrapper:nth-of-type(2n) .title {
}
.wrapper:nth-of-type(2n) .text {
}




@media screen and (min-width: 750px) {
.title,
.text {
    width: 50%;
  }
}

.title {
  font-weight: 400;
  line-height: 1.75;
  padding: 3rem 9rem;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
    position: sticky;
    top: 0;
    height: 100vh;

  }




@media screen and (max-width:992px){
	body.home h2.section__title{
		opacity:0.25;	
	}
	body.page h2.section__title span{
		font-size:2.75rem;
		padding:0;
	}
	.title{
		position:relative;
		height:auto;
		padding: 3rem 2rem;
	}
	.grid-container .button__detail{
		bottom:-32px;
	}
}

.text {
  font-size: 18px;
  line-height: 1.75;
  padding: 0;
}

.text img{
	object-fit:cover;
}

@media screen and (max-width: 750px) {
	.text img{
		width:100%;
		max-height:50vh;
	}
	.text.investment img{
	object-position:50% 80%;
	}
}


#home__service .button__detail{
	position:absolute;
	background-color:rgba(49, 130, 202, 1);
	display:flex;
	align-items:center;
	justify-content:center;
	width:4rem;
	height:4rem;
	color:#fff;
	bottom:0;
	right:0;
/*	transform:translate(50%, 50%);*/
}

#home__service .button__detail span{
	font-size:2rem!important;

}


body.home #home__contact{
	min-height:45rem;
	position:relative;
	overflow-x:clip;
	z-index:0;
	
}


body.home #home__contact h2.section__title{
	position:absolute;
	right:0;
	top:0;
	font-size:7.5rem;
	line-height:1;
	transform:rotate(-90deg) translate(7%,11%);
	transform-origin:100% 100%;
	font-weight:600;
	z-index:9;
	text-transform:uppercase;
	color:#3182ca;
/*	mix-blend-mode:difference;*/
}


body.home section{

}


body.home section#home__contact{
	padding-top:7.5rem;
	padding-bottom:7.5rem;
	overflow:hidden;
	background-color:#f5f5f5;

  background-image: linear-gradient(0deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px)),
                    linear-gradient(90deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px));
  background-size: 16px 16px;
  background-repeat: repeat;
  background-position: center center;


}
body.home section#home__contact h2 .title__en{
/*	-webkit-text-stroke: 1px #ec6c00;*/
	display:block;
}

body.home section#home__contact h2 .title__jp{
/*	color:#ec6c00;*/
	
}

body.home section#home__contact .about__copy{
	font-size:2.25rem;
	font-weight:normal;
	margin:0 0 1.25rem;
font-family: "Zen Old Mincho", serif;
}

body.home section#home__contact .about__description{
	font-size:1.0rem;
	font-weight:400;
}


body.home section#home__contact .about__image{
display:flex;
	gap:10px;

}

body.home section#home__contact .about__image > div{
/*	width:50%;*/
}

body.home section#home__contact .about__image .about__image-left{
	transform:translatey(6%);
	width:calc(55% - 5px);
}

body.home section#home__contact .about__image .about__image-right{
	width:calc(45% - 5px);
}


body.home section#home__contact .about__image #about__image-01{
	width:80%;
	margin-bottom:10px;
	margin-left:auto;
}

body.home section#home__contact .about__image #about__image-01 img{
	object-fit:cover;
	aspect-ratio:1 / 1.45;
}

body.home section#home__contact .about__image #about__image-02 img{
	object-fit:cover;
	aspect-ratio:1 / 1.05;
}
body.home section#home__contact .about__image #about__image-02{
	margin-bottom:10px;
}

body.home section#home__contact .about__image #about__image-03{
	width:80%;
	margin-bottom:10px;
}

body.home section#home__contact .about__image #about__image-03 img{
	object-fit:cover;
	aspect-ratio:1 / 1.15;
}
body.home section#home__contact .swiper.about{
	position:relative;
}

body.home section#home__contact .swiper.about:after{
	position:absolute;
	display:block;
	content:'';
	left:0;
	top:0;
	width:18rem;
	height:100%;
	background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);
	z-index:1;
}

@media screen and (max-width: 768px) {
	body.home section#home__contact .about__image{
		margin-left:0;
	}
	body.home section#home__contact .swiper.about:after{
	display:none;
	}
}

body.home section#home__contact .swiper.about .swiper-slide,
body.home section#home__contact .swiper.about .swiper-slide img{
    width: 100%;
    height: auto;
	border-radius:1.0rem;
}

body.home section#home__contact .swiper.about .swiper-wrapper {
    transition-timing-function: linear;
}

.button__contact{
	display:inline-block;
	text-align:center;
	padding:1.25rem 3.5rem;
	background-color:#3182ca;
	color:#fff;
	font-size:1.25rem;
	font-weight:bold;
}


@media screen and (max-width:750px){
	.table-contactform7 td,
	.table-contactform7 th{
		display:block;
		width:100%;
	}
	.table-contactform7 th{
		background-color:#eee;
	}
	.wpcf7-spinner{
		display:block;
	}
}



/* ------------------------------------------------------------
 * Page Common
 * ------------------------------------------------------------ */

.page__header {
	position:relative;
	margin:0 0 4.25rem ;
}

.page__header-title {
	position:absolute;
	top:0;
	left:0;
	display:flex;
	width:100%;
	height:100%;
	justify-content:center;
	align-items:center;
	text-align:center;
	z-index:1;
	font-size:2.75rem;
	color:#fff;
	text-shadow:1px 1px 1px rgba(0,0,0,0.8);
	letter-spacing:0.05em;
	font-weight:bold;
	line-height:1.3;
	padding-right:4.0rem;
	padding-left:4.0rem;
}

@media screen and (max-width:750px){
	.page__header-title{
		font-size:1.75rem;
	}
	.page__header img{
		object-fit:cover;
		aspect-ratio:100 / 85;
		
	}
}

table.table-basic{
	border:1px solid #ccc;
	border-collapse:collapse;
	width:100%;
}

table.table-basic th,
table.table-basic td{
	border:1px solid #ccc;
	padding:0.75rem;
}


table.table-striped tr:nth-child(odd){
	background-color:rgba(0,0,0,0.035);
}

table.table-striped tr:nth-child(even){
	background-color:rgba(0,0,0,0.015);
}


table.table-underline{
	border-top:1px solid #ccc;
	border-collapse:collapse;
	width:100%;
}

table.table-underline th,
table.table-underline td{
	border-bottom:1px solid #ccc;
	padding:0.75rem;
}


body.page:not(.home) section{
	margin-bottom:4.5rem;	
}
	
.text-blue{
	color:rgba(49,130,202,1);
}



h2.section__title{
	margin:3rem 0 3rem;
}
h2.section__title .en{
	font-family: 'Inter', sans-serif;
	font-size:5.25rem;
	font-weight:600;
	color:rgba(49,130,202,1);
	letter-spacing:0.025em;
}

h2.section__title .ja{
	font-size:1.25rem;
	font-weight:bold;
	margin-top:0.5em;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color:rgba(49,130,202,1);
	letter-spacing:0.1em;

}


h2.section__title .en {
  display: flex;
  overflow: hidden;
	justify-content:center;
}

h2.section__title .en span {
  display: block;
	padding:0 0.025em;
  transform: translate(0, 105%);
  transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;
	line-height:1;
}

h2.section__title .en.-visible span {
  transform: translate(0, 0);
}

h2.section__title .en span:nth-child(2) {
  transition-delay: 0.06s;
}
h2.section__title .en span:nth-child(3) {
  transition-delay: 0.12s;
}
h2.section__title .en span:nth-child(4) {
  transition-delay: 0.18s;
}
h2.section__title .en span:nth-child(5) {
  transition-delay: 0.24s;
}
h2.section__title .en span:nth-child(6) {
  transition-delay: 0.30s;
}
h2.section__title .en span:nth-child(7) {
  transition-delay: 0.36s;
}
h2.section__title .en span:nth-child(8) {
  transition-delay: 0.42s;
}
h2.section__title .en span:nth-child(9) {
  transition-delay: 0.48s;
}
h2.section__title .en span:nth-child(10) {
  transition-delay: 0.54s;
}
h2.section__title .en span:nth-child(11) {
  transition-delay: 0.6s;
}
h2.section__title .en span:nth-child(12) {
  transition-delay: 0.66s;
}
h2.section__title .en span:nth-child(13) {
  transition-delay: 0.72s;
}
h2.section__title .en span:nth-child(14) {
  transition-delay: 0.78s;
}
h2.section__title .en span:nth-child(15) {
  transition-delay: 0.84s;
}
h2.section__title .en span:nth-child(16) {
  transition-delay: 0.90s;
}
h2.section__title .en span:nth-child(17) {
  transition-delay: 0.96s;
}
h2.section__title .en span:nth-child(18) {
  transition-delay: 1.02s;
}


h3.section__title{
	color:rgba(49,130,202,1);
	font-size:1.75rem;
	font-weight:bold;
	margin:0 0 1.5rem;
}

h3.section__title span{
	background-color:rgba(49,130,202,1);;
	color:#fff;
	width:auto;
	min-width:1.6em;
	height:1.6em;
	padding:0.3em;
	display:inline-block;
	text-align:center;
	line-height:1em;
}


ul.list {
list-style: none;
margin:0;
}

ul.list li ul {
list-style: none;
margin-left:1em;
}

ul.list li,
ul.list li ul li{
padding-left: 1em;
text-indent: -1em;
margin-bottom:0.5em;
}

ul.list li:before {
  font-family:'Material Symbols Outlined';
  content: '\e5c8';
margin-right:0.1em;
	position:relative;
	top:0.1em;
}

ul.list li ul li:before {
  font-family:'Material Symbols Outlined';
  content: '\e5cc';
margin-right:0.1em;

}

.btn-basic{
	background-color:rgba(49,130,202,1);
	color:#fff;
	padding:0.75rem 1.5rem;
	display:inline-block;
	transition:all 0.3s ease;
}

.btn-basic .inner{
	display:flex;
	align-items:center;
}

.btn-basic .inner span{
	margin:0 0 0 0.5rem;
	display:inline-block;
	transition:all 0.3s ease;
}


.btn-basic:hover{
	background-color:rgba(49,130,202,0.8);

}

.btn-basic:hover .inner span{
	transform:translate(0.5rem, 0);
}


/* ------------------------------------------------------------
 * Page Profile
 * ------------------------------------------------------------ */

.profile__access-map{
	border:1px solid #ddd;
	margin:0 0 1.5rem;
	background-color:#f8f9fa;
}

.profile__access-text {
	padding:1rem;
	border-top:1px solid #ddd;
}

.profile__access-map iframe{
/*	border-top-left-radius:0.75rem;
	border-top-right-radius:0.75rem;*/
}

.profile__access-item .inner{
	background-color:#f8f9fa;
	border:1px solid #ddd;
	padding:1rem;
	height:100%;
/*	border-radius:0.75rem;*/
}


/* ------------------------------------------------------------
 * Page Investment
 * ------------------------------------------------------------ */
.list-group-item{
	display:block;
	padding:0.75rem 2rem;
	border-radius:100vh;
	box-shadow:-3px -3px 6px rgba(255,255,255,1), 3px 3px 6px rgba(0,0,0,0.05);
	background-color:#fbfbfb;
	margin:0 0 1.25rem;
	position:relative;
}

.list-group-item span{
	color:#fff;
	background-color:rgba(49,130,202,1);
	width:1.5rem;
	height:1.5rem;
	border-radius:100vh;
	display:flex;
	align-items:center;
	justify-content:center;
	position:absolute;
	left:0.75rem;
	
}


table input,
table textarea{
	border:1px solid #ccc;
}

.required-contactform7 {
    padding: 3px 6px;
    background: #3182ca;
    color: #fff;
    border-radius: 0px;
    margin-left: 3px;
    font-size: 80%;
}

.wpcf7-spinner{
	display:block;
}

.wpcf7-list-item label{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:0.5rem;
}

.privacy-policy{
	margin:1rem 0;
	height:16em;
	overflow-y:auto;
	padding:2rem 1rem;
	background-color:#f5f5f5;
}