/*===============================================
　SP
===============================================*/
@media (max-width:761px) {
	
	/* =========================================================================
 	TTL
	===========================================================================*/
	
	.mv_ttl_wrap{
		position:absolute;
		top: 50%;
		left: 7%;
		z-index: 30;
		transform: translate(0, -50%);
	}

	.mv_ttl_wrap h1{
		font-feature-settings: 'palt';
		line-height: 1.2;
		color: #fff;
		position:relative;
		padding: 5px 10px;
		box-sizing: border-box;
		text-align: center;
		border: 1px solid #fff;
		background: rgb(255, 255, 255, 0.15);
	}
	.mv_ttl_wrap h1 .eng_txt{
		font-family: 'Barlow', sans-serif;
		font-weight: 700;
		font-size: 2.2em;
		letter-spacing: 0.1rem;
	}

	.mv_ttl_wrap h1 .jp_txt{
		font-family: "Noto Sans SC", sans-serif;
		font-size: 1.6rem;
		font-weight: 500;
		letter-spacing: 0.1rem;
		margin: 0 0 0 8px;
	}

	.mv_ttl_wrap p{
		font-family: 'Barlow', sans-serif;
		font-weight: 600;
		font-size: 2.6rem;
		letter-spacing: 0.1rem;
		font-feature-settings: 'palt';
		line-height: 1.4;
		color: #fff;
		padding: 0 0 14px;
	}
	.mv_ttl_wrap p span{
		display: block;
		font-family: "Noto Sans SC", sans-serif;
		font-size: 1.4rem;
		font-weight: 400;
	}
	
	/* =========================================================================
 	TTL
	===========================================================================*/
	
	.mv_ttl_wrap_b{
		position:absolute;
		top: 50%;
		left: 7%;
		transform: translate(0, -50%);
	}

	.mv_ttl_wrap_b h1{
		font-feature-settings: 'palt';
		line-height: 1.0;
		color: #fff;
		position:relative;
	}

	.mv_ttl_wrap_b h1 .eng_txt{
		display:block;
		font-family: 'Barlow', sans-serif;
		font-weight: 600;
		font-size: 5.4rem;
		letter-spacing: 0.1rem;
	}

	.mv_ttl_wrap_b h1 .jp_txt{
		display:block;
		font-family: "Noto Sans SC", sans-serif;
		font-size: 1.8rem;
		font-weight: 500;
		letter-spacing: 0.1rem;
		padding: 10px 0 0;
	}
	
	#main_wrap_sec .btn_view{
		position:relative;
		z-index:30;
	}
	
	#main_wrap_sec .btn_view a{
		bottom:0;
		z-index: 30;
		box-sizing: border-box;
		background-color: #ffffff;
		color: #000;
		width: 96%;
		padding: 15px 0px 15px 34px;
		font-size: 1.5rem;
		letter-spacing: 0;
		position: relative;
		margin: -10px auto 0;
		border: 2px solid #000;
		font-weight: 600;
		font-family: "Noto Sans SC", sans-serif;
	}
	
	#main_wrap_sec .btn_view a::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 7%;
		width: 6%;
		height: auto;
		aspect-ratio: 28 / 20;
		background: url("/ch/global/img/icon_mail_b.svg") no-repeat;
		background-size: contain;
		z-index: -1;
		transform:translate(0, -50%);
	}



	/* =========================================================================
 	inview anime
	===========================================================================*/
	.lazy_fadein {
		opacity: 0;
	}
	.lazy_fadein_act {
		opacity: 1;
		transition: all 0.5s cubic-bezier(0, 0, 0, 0);
	}
	.lazy_fadeinLeft {
		opacity: 0;
		transform: translate(-50px, 0);
	}
	.lazy_fadeinRight {
		opacity: 0;
		transform: translate(50px, 0);
	}
	.lazy_fadeinLeft_active, .lazy_fadeinRight_active {
		transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
		transform: translate(0, 0);
		opacity: 1;
	}
	.lazy_fadeinUp, .lazy_fadeinUpA, .lazy_fadeinUpB, .lazy_fadeinUpC, .lazy_fadeinUpD {
		opacity: 0;
		transform: translate(0, 10px);
	}
	.lazy_fadeinUp_active {
		transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
		transform: translate(0, 0);
		opacity: 1;
	}
	.lazy_fadeinDownA, .lazy_fadeinDownB, .lazy_fadeinDownC, .lazy_fadeinDownD {
		opacity: 0;
		transform: translate(0, -10px);
	}
	.lazy_fadeinDown_active {
		transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
		transform: translate(0, 0);
		opacity: 1;
	}
	.lazy_fadeinUpCenter {
		opacity: 0;
		transform: translate(-50%, 10%);
	}
	.lazy_fadeinUpCenter_active {
		transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1);
		transform: translate(-50%, 0);
		opacity: 1;
	}
	.lazy_fadeinScaleA, .lazy_fadeinScaleB, .lazy_fadeinScaleC, .lazy_fadeinScaleD {
		opacity: 0;
		transform: scale(1.2);
	}
	.lazy_fadeinScale_active {
		transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
		transform: scale(1);
		opacity: 1;
	}
}
/* ============================================================
loading
==============================================================*/
@media (max-width:761px) {
	#loading{
		width:100vw;
		height:100vh;
		position:relative;
		background: #005bac;
	}

	.loadci{
		display:block;
		position: absolute;
		top:calc(50% - 30px);
		left: 50%;
		transform:translate(-50%, -50%);
		filter: brightness(0) invert(1);
		width:240px;
	}

	.loadci img{
		animation: loadcia 2.0s cubic-bezier(0, 0, 0.15, 1);
	}
	
	.loader,
	.loader:before,
	.loader:after {
	  border-radius: 50%;
	  width: 1.0em;
	  height: 1.0em;
		position: absolute;
		top:calc(50% + 10px);
		left:0;
	  -webkit-animation-fill-mode: both;
	  animation-fill-mode: both;
	  -webkit-animation: load7 1.8s infinite ease-in-out;
	  animation: load7 1.8s infinite ease-in-out;
	}
	.loader {
	  color: #ffffff;
	  font-size: 10px;
	  margin: 0 auto;
	  position: relative;
	  text-indent: -9999em;
	  -webkit-transform: translateZ(0);
	  -ms-transform: translateZ(0);
	  transform: translateZ(0);
	  -webkit-animation-delay: -0.16s;
	  animation-delay: -0.16s;
	}
	.loader:before,
	.loader:after {
	  content: '';
	  position: absolute;
	  top: 0;
	}
	.loader:before {
	  left: -2.5em;
	  -webkit-animation-delay: -0.32s;
	  animation-delay: -0.32s;
	}
	.loader:after {
	  left: 2.5em;
	}

	.load_txt {
		display:block;
		font-size: 1.2rem;
		color: #fff;
		position: absolute;
		top:calc(50% + 65px);
		left: 50%;
		transform:translate(-50%, -50%);
		animation: loadtxt 1.5s infinite ease-in-out;
	}
}