body {
	background: #000;
	margin: 0;
	padding: 0;
	font-size: 18px;
	color: #FFF;
	position: relative;
}
body, textarea { 
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
	font-weight: 500;
}
.body-en{
  font-family: Verdana, Helvetica, Arial, sans-serif;
	text-align: justify;
}
.body-en h2,
.body-en h3{
	font-family: 'Open Sans Condensed', sans-serif;
}
.body-en .modal-body{
	text-align: left;
}
.body-en td,
.body-en th{
	text-align: left;
}
input, select { font-family: Arial, "ＭＳ Ｐゴシック", sans-serif; }

* {
    margin: 0;
    padding: 0;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{
	line-height: 1.4;
}
.h2-bg{
	text-align: center;
	background: url(../img/common/h2_bg.png) repeat-x;
	background-size: auto;
	background-position: center 2.4em;
	margin-top: -5.3em;
	text-shadow: 1px 2px 3px #783816,0px 0px 3px #783816; 
	position: relative;
	z-index: 10;
	padding-top: 2em;
}
.page .h2-bg:first-of-type{
	margin-top: 1em;
}
@media screen and (max-width:768px){
	.page .h2-bg:first-of-type{
		margin-top: 0em;
	}
}
@media screen and  (max-width:1360px){
	.h2-bg{
		background-size: 183%;
		background-position: center 67%;
	}
}
.h2-inner{
	background: url(../img/common/h2_inner.png) no-repeat center;
		line-height: 160px;
		white-space: nowrap;
	text-shadow: 1px 2px 3px #000,0px 0px 3px #000; 
}
.h3-edition {
	font-size: 1.5rem;
	display: block;
	padding: 0.3em 0em 0.2em;
	border-top: 1px solid #dcd36466;
	border-bottom: 1px solid #dcd36466;
	margin-bottom: 1em;
	background: linear-gradient(to right, #0000 0%, #000a 10%, #000a 90%, #0000 100%);
	text-align: center;
}
.h3-edition span{
	display: block;
}
.fs-060{
	font-size: 0.6em;
}
.fs-080{
}

@media screen and (max-width: 768px){
	.h2-inner{
		background-size: 300px;
		font-size: 0.6em;
	}
}
@media screen and (max-width: 450px){
	.h2-inner{
		background-size: 80%;
		font-size: 0.6em;
	}
}
p {
	padding:0px 0px;
	margin:0px 0px 25px 0px;
}
a {
	text-decoration:underline;
	color: inherit;
}
a:hover {
  text-decoration: none;
	color: inherit;
}

a:hover img {
	opacity:0.7;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}

img{
	max-width:100%;
}

hr{
	margin:2.5em 0px 2.5em 0px;
	border-top: 1px solid #FFF6;
}

.st-red{
	font-size: 120%;
	color: #C00;
}

li{
	list-style-type: none;
}

.footer {
	margin: 0;
	padding: 11em 2em 8em;
	font-size:0.8em;
	line-height: 1.7;
	color: #FFF;
	position: relative;
	text-align: center;
  background: linear-gradient(to bottom, transparent 20%, #000000);
}
/* .footer p{
} */
.footer li{
	display: block;
}

/*		common	--------------------------		*/
a img{
  transition-property: all;
  transition: 0.1s linear;
}
a img:hover{
	opacity: 0.7;
}

small{
	line-height: 1.1;
}
.cap-bg-orng{
	background-color: #fd9454;
	color: #FFF;
	padding: 4px 8px;
	margin-bottom: 0.5em;
}
.cap-bg-red{
	font-size: 1.2em;
	background-color: #dcd36466;
	color: #FFF;
	display: inline-block;
	padding:0 1em 0 0.5em;
}
.fs-110{font-size: 110%;}
.fc-red{color: #FF5E5E;}
.fc-blu{color: #546EB5;}

.mgb30{margin-bottom: 30px;}
.mgb50{margin-bottom: 50px;}

.text-center{
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
.table td, .table th{
	border-top: none;
}
@media screen and (max-width:768px){
	.pc-only{display: none!important;}
}
@media screen and (min-width:769px){
	.sm-only{display: none!important;}
}
@media screen and (min-width:1025px) , (max-width:500px){
	.br-footer{display: none!important;}
}
.btn{
	background-color: #e5004f;
	padding: 0.5em 1em;
	font-weight: bold;
	font-size: 1.2em;
	color: #fff;
	text-decoration: none;
	border-radius: 0.2em;
	width: 100%;
	max-width: 15em;
	white-space: nowrap;
	margin: 0.5em;
	text-shadow: none;
	box-shadow: 0px 0px 8px #ffffff;
}
@media screen and (max-width:768px) {
	.btn{
		font-size: 1.0em;
	}
}
.btn-nml{
	max-width: 100%;
	width: auto;
	background-color: #000000aa;
	border: 1px solid #FFFFFF66;
	border-radius: 3em;
	font-weight: normal;
	font-size: 1em;
	white-space: normal;
}
.btn-list{
	display: block;
	max-width: 25em;
	border: 1px solid #da88a4;
}
.btn-lang,
.btn-lang:hover,
.btn-lang:not(:disabled):not(.disabled).active,
.show>.btn-lang.dropdown-toggle{
	background: none;
	border: none;
	font-size: 0.8em;
	font-weight: normal;
	margin: 0;
}
.lang-en .btn{
	width: 100%;
}

a.btn:hover{
	color: #FFF;
	opacity: 0.7;
	transition-property: all;
	transition: 0.2s linear;
}
.div-btn{
	display: flex;
}
@media (max-width:1000px){
	.div-btn{
		display: block;
	}
	.btn2{
		display: block;
		margin-bottom: 0.5em;
		margin-left: auto;
		margin-right: auto;
	}
	.btn2 span{
		margin-top: 0px;
	}
}
@media (max-width:440px){
	.btn2{
		width: 100%;
		font-size: 0.9em;
	}	
}
a.btn2:hover{
	color: #FFF;
	opacity: 0.7;
	transition-property: all;
	transition: 0.2s linear;
}
.mh-1{
	max-height: 17vh;
}
.mh-2{
	max-height: 9vh;
}
.p-bk{
	background-color: #461719aa;
	padding: 0.5em;
	border-radius: 4px;
	width: 100%;
	max-width: 600px;
	margin: auto;
}
.cap-white{
	line-height: 1.4;
	font-size: 1.5rem;
	font-weight: bold;
	text-shadow: 0px 0px 2px #E4C499,0px 0px 3px #E4C499; 
	padding: 0.5em 0em;
	color:#3C230F;
	position: relative;
	border-top: 1px solid #6C2C2F;
	border-bottom: 1px solid #6C2C2F;
	background: linear-gradient(to right, #DDC29500 0%, #DDC295CC 10%, #DDC295EE 30%, #DDC295EE 70%, #DDC295CC 90%, #DDC29500 100%);
}
.cap-white-g{
	border-top: 1px solid #7D8989;
	border-bottom: 1px solid #7D8989;
	background: linear-gradient(to right, #C8D3D300 0%, #C8D3D3CC 10%, #C8D3D3EE 30%, #C8D3D3EE 70%, #C8D3D3CC 90%, #C8D3D300 100%);
}
.cap-white-b{
	color: #FFF;
	text-shadow: 0px 0px 2px #8d6b3f, 0px 0px 3px #8d6b3f;
	border-top: 1px solid #58130E;
	border-bottom: 1px solid #58130E;
	background: linear-gradient(to right, #84221900 0%, #842219CC 10%, #842219EE 30%, #842219EE 70%, #842219CC 90%, #84221900 100%);
}
.cap-bk-basic{
	width: 100%;
	line-height: 1.6;
	font-size: 1.4rem;
	font-weight: bold;
	/* text-shadow: 0px 0px 2px #E4C499,0px 0px 3px #E4C499;  */
	padding: 0.5em 0em;
	/* color:#3C230F; */
	border-top: 1px solid #6C2C2F;
	border-bottom: 1px solid #6C2C2F;
	background: linear-gradient(to right, #02020200 0%, #020202CC 10%, #020202CC 90%, #02020200 100%);
}
@media screen and (max-width:768px) {
	.cap-white,
	.cap-bk-basic{
		font-size: 1.0rem;
	}
}
.cap-twi{
	font-size: 1.5rem;
	max-width: 500px;
	padding: 0.5em 0em;
	border-top: 1px solid #1b95e0aa;
	border-bottom: 1px solid #1b95e0aa;
	background: linear-gradient(to right, #0000 0%, #000a 10%, #000a 90%, #0000 100%);
}
.cap-children{
	display: flex;
    align-items: center;
    justify-content: center;
		height: 2.5em;
}
.cap-children span{
	position: absolute;
}
.cap-children span img{
	height: 4em;
	margin-left: -2em;
}
/* .i-system::before{
	content: "";
	background-image: url(../img/system/i_system.png) left center no-repeat;
} */
.img-area-thum img{
	display: block;
	border-radius: 4px;
	width: 100%;
	position: relative;
	box-shadow: 0px 0px 8px #e4c499;
}

.img-area-3shot{
	position: relative;
}
.img-area-3shot div{
	position: absolute;
}
.img-area-3shot div:last-of-type{
	right: 0;
	bottom: 0;
}
.i-zoom{
	position: relative;
	display: block;
}
.i-zoom::before{
	position: absolute;
	right: -9px;
	bottom: 0;
	content: "\f00e";
	font-family: 'Font awesome 6 Free';
	z-index: 2;
	font-weight: 900;
	font-size: 1.5em;
	/* transform: rotate(90deg); */
}
.i-zoom-char::before{
	right: 30px;
}
.i-zoom:hover,
.pointer:hover{
	cursor: pointer;
}
.i-zoom-char a{
	width: 100%;
	background-size: 100%;
}
.i-zoom-char a img{
	width: 72%;
}
.div-edition a.i-question{
	display: inline-block;
	justify-content: center;
	position: relative;
	margin-right: -15px;
	max-width: 100%;
	display: block;
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin: auto;
}
.i-question::after{
	content: "\f059";
	font-family: 'Font awesome 6 Free';
	vertical-align: top;
}
.div-edition a.i-question::after{
	position: absolute;
	right: 0;
	top: 0;
}
a.i-question:hover img{
	opacity: 1;
}
.underline{
	text-decoration: underline!important;
}
/*		header	--------------------------		*/

#header{
	z-index: 99;
	height: 38px;
	background:#fff; 
	padding:0px 0em; 
	position: absolute;
	top:0;
	left: 0;
	display: block;
	width: 100%;
}

.body-en #header .cc2header-copy img{
	margin-top: 4px;
}
@media (max-width:879px){
	#header .cc2header-copy{
		display: none;
	}
	/* .page #header{
		display: none;
	} */
}
.gnavi{
	display: flex;
	align-items: center;
  background: linear-gradient(to bottom, #000000aa 55%, transparent);
	width: 100%;
	margin: 0 auto;
	z-index: 12;
	position: absolute;
	top: 38px;
	padding: 5px 15px;
	-webkit-backdrop-filter: blur(2px);
	        backdrop-filter: blur(2px);
	height: 112px;
}

.gnavi.collapse.show{
	display: flex;
}
.gnavi .collapsing{
	height: 100vh;

}
.gnavi-logo{
	 /* flex-grow: 1; */
	 /* width: 140px; */
	max-width: 14vw;
}
.gnavi ul{
	margin-bottom: 0;
}
.gnavi li{
	display: inline-block;
	margin: 0px 0px;
}
.gmenu{
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	/* flex: 1; */
	align-items: center;
	justify-content: center;
	margin-bottom: 0;
}
.gmenu li a{
	position: relative;
}
@media screen and (min-width:769px) {
	.gmenu{
		flex: 1;
	}	
}
@media screen and (max-width:1150px) and (min-width: 769px) {
	.gmenu li a img{
		height: 2.9vw;
	}	
}
.gmenu-br{
	width: 100%;
}	
@media screen and (min-width:1716px) {
	.gmenu-br{
		display: none;
	}	
}
/* @media screen and (max-width:1130px) {
	.gmenu li a img{
		height: 2.6vw;
	}
} */
.ul-lang{
	font-size: 0;
	white-space: nowrap;
	margin-left: 5px;
	margin-top: -50px;
}
@media screen and (max-width:768px){
	.ul-lang{
		margin-top: 0px;
		margin-bottom: 2em;
	}
}
.ul-lang li{
	font-size: 1rem;
	margin-left: 0;
	margin-right: 0;
}
.ul-lang li a{
		color: #FFF;
		text-decoration: none;
	border: 1px solid #FFF;
	padding:  0 0.2em 0 0.5em;
    height: 35px;
    line-height: 35px;
    display: inline-block;
		border-radius: 35px 0 0 35px;
		width: 2.6rem;
    text-align: center;
}
.gnavi a:hover{
	opacity: 0.7;
}
.ul-lang li:last-of-type a{
		border-radius: 0 35px 35px 0;
		border-left: none;
	padding:  0 0.5em 0 0.2em;
}
.ul-lang li a.active{
	background-color: #461719;
}
.ul-sns{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	/* flex-grow: 1; */
	margin-bottom: 0;
	position: relative;
	z-index: 2;
	font-size: 2em;
	white-space: nowrap;
	margin-top: -50px;
}
@media screen and (max-width:768px){
	.ul-sns{
		flex-grow: inherit;
		margin-top: auto;
	}
}
.ul-sns li {
	display: inline-block;
	margin:  0 5px;
	/* width: 1em; */
}
.ul-sns li a{
	font-family: sans-serif;
	border: 1px solid #FFF;
	border-radius: 1em;
	text-align: center;
	line-height: 1;
	height: 35px;
	width: 35px;
	line-height: 37px;
	font-size: 20px;
	color: #FFF;
	/* display: block; */
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}

@media screen and (max-width:1500px){
	.gmenu{
		display: block;
		/* max-width: 600px; */
	}
	.body-en .gmenu{
		/* max-width: 660px; */
	}
}

.gmenu-order{
	display: none;
}
.i-new::before{
	content: "";
	position: absolute;
	color: #FFF;
	width: 31px;
	height: 36px;
	left: -12px;
	top: -13px;
	background: url(../img/common/i_new.png) no-repeat;
	background-size: 100%;
	-webkit-animation: i-new-anim .5s infinite alternate ease-in-out;
	animation: i-new-anim .5s infinite alternate ease-in-out;
}
.i-new-t::before{
	left: 3%;
  top: -23.5%;
}
.i-new-bn::before{
	top: -13px;
	z-index: 3;
}

#bn-area-info .i-new::before{
	left: 4%;
}
@-webkit-keyframes i-new-anim {
  from {
    /* transform: translateY(0); */
		opacity: 1;
  }
  to {
    /* transform: translateY(5px); */
		opacity: 0;
  }

}
@keyframes i-new-anim {
  from {
    /* transform: translateY(0); */
		opacity: 1;
  }
  to {
    /* transform: translateY(5px); */
		opacity: 0;
  }

}
.navbar{
	display: none;
	background-color: #FFF;
	padding: 2px 2px 2px 5px;
}
.navbar button{
	float: right;
}
@media screen and (max-width:768px){
	.gnavi{
    display: flex;
		flex-flow: column;
    justify-content: center;
    align-items: center;
		top: 0;
		height: 100vh;
    background-image: none;
    background-color: rgba(0,0,0,0.7);
	}
	.gnavi ul{
		margin: 10px auto;
	}
	.gnavi-logo{
		display: none;
	}
	.gnavi .d-flex{
		display: block!important;
		text-align: center;
	}
/* .page .gnavi{
	visibility: hidden;
} */
	.gmenu li{
		display: block;
		margin: 3px;
	}
	.navbar{
		display: block;
	}
	.gnavi .sm-inline{
		display: inline-block;
		margin-left: -3px;
		margin-right: -3px;
	}
	.gmenu img{
	max-height: 4vh;
	}
}
.gmenu .gmenu-wrap{
	display: none;
}
@media screen and (max-width: 1500px){
	.gmenu .gmenu-wrap{
		display: block;
		width: 100%;
	}
}

/*		main			*******************************************/
.start-img{
	width: 100%;
	height: 110vh;
	/* max-height: 150vw; */
	background: url(../img/main/visual.jpg) no-repeat center center;
	background-size: cover;
	position: absolute;
	z-index: -1;
	/* display: none; */
	overflow: hidden;
}

@media screen and (max-width:768px){
	.start-img{
		background-image: url(../img/main/visual_m.jpg);
		background-position: center center;
	}
}

.bg {
  min-height: 110vh;
  width:auto;
  background-size: 100% auto;
	background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
	padding: 1.5em 0em 200px;
	position: relative;
}
.bg-w{
  background-size:cover;
}
@media screen and (max-width: 768px) {
	.bg,
	.bg-w {
		background-size: cover;
		/* background-attachment: scroll; */
	}
	.page .bg,
	.page .bg-w{
		padding-top: 0;
		padding-bottom: 0;
		margin-top: 0;
		margin-bottom: 0;
	}
}
#main{
  height: 100vh;
}

#main.bg{
	padding: 0;
	z-index: 9;
	overflow: hidden;
	min-height: 100vh;
}
.main_bg {
    display: block;
    position: absolute;
    /* top: 0; */
    left: 0;
    z-index: -1;
    width: 100%;
    height: calc(100vh - 38px);
    bottom: 0;
	}
.main_movie {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100vw;
		height: calc(100vh - 38px);
    min-width: 178vh;
    min-height: 56.25vw;
}
/* .main_movie::before{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(transparent 85%, #000 100%);
} */
.main_movie video {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.main-copy{
	position: absolute;
	top: 180px;
	left: 5vw;
}
.body-en .main-copy{
	top: auto;
	bottom: 14vh;
	left: 3vw;
}
@media screen and (max-width:768px){
	.main-copy {
			top: 50px;
			right: 5vw;
			left: auto;
	}
	.main-copy img{
			max-width: 30vw;
			max-height: 40vh;
	}
	.body-en .main-copy{
		width: 100%;
		top: 80px;
		text-align: center;
		left: auto;
		right: auto;
	}
	.body-en .main-copy img{
		max-width: 90vw;
	}
}
.main-logo{
	position: absolute;
	bottom: 11vh;
	left: 2vw;
	max-width: 350px;
}
.main-logo-m{
	display: none;
	text-align: center;
	position: absolute;
	bottom: 6vh;
	width: 100%;
}
.main-dxdl{
	position: absolute;
	right: 12px;
	top: 162px;
	width: 386px;
}
.main-dxdl-m{
	display: none;
	text-align: center;
	padding:0 0.5em 0px;
}
@media screen and (max-width:768px){
	.main-logo,
	.main-date,
	.main-dxdl{
		display: none;
	}
	.main-logo-m,
	.main-dxdl-m{
		display: block;
	}
}
.main-date{
	text-align: center;
	position: absolute;
	right: 2vw;
	bottom: 6vh;
	max-width: 350px;
}
.main-date-d{
	max-height: 48px;
}
/* .main-guideline{
	position: absolute;
	right: 15px;
	bottom: 0px;
	display: block;
	width: 220px;
} */
.main-guideline {
    position: absolute;
    right: 15px;
    top: 60px;
    display: block;
    width: 220px;
		max-width: 20%;
}
.main-guideline a{
	display: block;
	margin-bottom: 3px;
}
@media screen and (max-width:768px){
	.main-date{
		text-align: center;
		right: auto;
		max-width: 100%;
	}
	.main-guideline{
		position: relative;
		right: auto;
		bottom: auto;
		margin-top: 1em;
		max-width: 100%;
		width: 100%;
		top: 0px;
		text-align: center;
	}
	.main-guideline img{
		max-width: 44vw;
    margin: 0 auto;
    display: block;
	}
}
#page-top {
	position: fixed;
	bottom: 1rem;
	right: 1rem;
	text-align: right;
	margin: 0;
	z-index: 11;
}
#page-top a {
	color: #222;
	font-size: 2rem;
	display: block;
	text-align: center;
}
#page-top img{
	height: 3em;
}

.spec{
	position: relative;
	width: 100%;
	margin: auto ;
	padding-top: 2em;
	letter-spacing: 0.1em;
	font-size: 0;
}
.spec .container-wrap{
	padding: 1.5em 1em 0.1em;
	font-size: 1rem;
}

.spec dl{
	padding-bottom: 1.5em;
	margin: 0 auto;
}
.spec dl dt{
	text-align: right;
	font-weight: normal;
	font-size: 92%;
}
.spec p{
	font-size: 0.8em;
}
@media screen and (max-width: 767px){
	.spec dl dt,
	.spec p{
		text-align: left;
	}
	.spec dt,
	.spec dd{
		word-break: break-word;
	}
}
.spec dl dd{
	text-align: left;
	font-weight: bold; 
}
.spec .cero{
	position: absolute;
	right: 0;
	bottom: 20px;
}
.op4{
	opacity: 0.4;
}
@media screen and (max-width: 768px){
	.min-container{
		height: 70vh;
		/* display: flex;
		justify-content: center;
		align-items: center; */
	}
}
#about{
  background-image: url(../img/about/bg.jpg);
	background-position: center bottom;
}
/* #about::before {
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    width:100vw;
    height:100vh;
    background:url(../img/about/bg.jpg) no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
    content:"";
} */
#character{
  background-image: url(../img/character/bg.jpg);
}
#system{
  background-image: url(../img/system/bg.jpg);
}
#special{
  background-image: url(../img/special/bg.jpg);
}
#movie{
  background-image: url(../img/movie/bg.jpg);
}
#themesong{
  background-image: url(../img/themesong/bg.jpg);
}
#product{
  background-image: url(../img/product/bg.jpg);
	padding-bottom: 0;
}
#dlc{
  background-image: url(../img/dlc/bg.jpg);
}
#charity{
  background-image: url(../img/donation/bg.jpg);
}
#p-movie{
  background-image: url(../img/movie/bg2.jpg);
}
#ambassador{
  background-image: url(../img/ambassador/bg.jpg);
}
@media screen and (max-width:768px){
	#about{
		background-image: url(../img/about/bg_m.jpg);
	}
	#movie{
		background-image: url(../img/movie/bg_m.jpg);
	}
#product{
  background-image: url(../img/product/bg_m.jpg);
	}
	#ambassador{
		background-size: contain;
	}
}
#ambassador .container > div:first-of-type > p:first-of-type {
    margin-top: 3rem;
}
@media screen and (max-width:768px){
	#ambassador .container > div:first-of-type > p:first-of-type {
			margin-top: inherit;
	}
}

.container{
	padding-bottom: 15px;
}
.container p{
	flex: auto;
}
.about-img {
	position: relative;
	max-width: 820px;
}
.about-img div{
	background-size: cover;
	display: block;
	border-radius: 5px;
	border: 1px solid #FFF;
	width: 35%;
}
.about-img div::before{
  content: "";
  display: block;
  padding-top: 64%;
}
.about-img01{
	background: url(../img/about/about_img01.jpg) no-repeat center;
	float: left;
}
.about-img02{
	background: url(../img/about/about_img02.jpg) no-repeat center;
	float: left;
	margin-left: -1.8vw;
	margin-top: 20px;
}
.about-img03{
	background: url(../img/about/about_img03.jpg) no-repeat center;
	float: right;
	margin-left: -5vw;
}

@media screen and (max-width: 768px){
	.about-img01,
	.about-img02,
	.about-img03{
		float: none;
		margin: 0 0 1em;
	}
	.about-img div{
		width: 100%;
	}
}
.box{
	background-color: rgba(0, 0, 0, 0.4);
	border-radius: 1em;
	padding: 2.5em;
	text-shadow: 1px 2px 3px #000,0px 0px 3px #000;
}
@media screen and (max-width:768px){
	.box{
		padding: 2.5em 1em;
	}
}
#bn-area{
	padding: 30px 0 120px;
	position: relative;
	/* z-index: 11; */
}
#bn-area hr{
	margin: 1em 0;
}
.story{
	line-height: 2.0;
	font-weight: bold;
	max-width: 740px;
	margin: auto;
}
.fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
}
.logo-25th img{
	width: 250px;
}
/* --- loading --- */
#loader-bg {
  /* display: none; */
  position: fixed;
  width: 100%;
  height: 100vh;
  top: 0px;
  left: 0px;
  background: #000;
  z-index: 98;
}
#loader {
  /* display: none; */
  position: fixed;
  top: 55%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  text-align: center;
  color: #fff;
  z-index: 99;
}
.donutSpinner {
    display: inline-block;
    border: 4px solid #CCC;
    border-left-color: #666;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    -webkit-animation: donut-spin 1.2s linear infinite;
            animation: donut-spin 1.2s linear infinite;
}
@-webkit-keyframes donut-spin {
    to {
        transform: rotate(1turn);
    }
}
@keyframes donut-spin {
    to {
        transform: rotate(1turn);
    }
}

#wrap{
	position: relative;
}
/* --- video --- */

#bg-video{
 /* position: fixed; */
 position: absolute;
	left: 0;
 bottom: 0;
 min-width: 100%;
 min-height: 100%;
 width: auto;
 height: calc(100vh - 38px);
 z-index: -100;
 background-size: cover;
}

/* modal */

.modal-open {
  padding-right: 0px !important;
  overflow: auto;
}
.modal {
  padding-right: 0px !important;
}
.modal-content{
	background: none;
	border: none;
	/* width:100%;              横幅いっぱいにwidthを指定 */
	/* padding-bottom: 56.25%;  高さをpaddingで指定(16:9) */
	/* height:0px;              高さはpaddingで指定するためheightは0に */
	/* position: relative; */
	text-shadow: none;
	border-radius: 1em;
}
.modal-content-movie{
	width:100%;              /*横幅いっぱいにwidthを指定*/
	padding-bottom: 56.25%;  /*高さをpaddingで指定(16:9)*/
	height:0px;              /*高さはpaddingで指定するためheightは0に*/
	position: relative;
}
.modal-content .close{
	position: absolute;
	z-index: 99;
	font-size: 2em;
	border-radius: 2em;
	right: 0em;
	top: -1em;
	background-color: #000;
	border-radius: 1.3em;
	width: 1.3em;
	height: 1.3em;
}
@media (min-width: 576px) and (max-width: 991px){
	.modal-dialog {
			max-width: 90%;
			margin: 1.75rem auto;
	}
}
.modal-content iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.modal-backdrop.show{
	opacity: 0.7;
}

.close{
	display: block;
	width: 3em;
	margin-left: auto;
}
.modal-info .modal-content .close{
	color: #FFF;
	top: 5px;
	right: 5px;
	/* border: 2px solid #FFF; */
}
.modal-info .modal-body{
	background-color: #000000CC;
	border-radius: 1em;
	border: 1px solid #666;
	padding: 1em 1.5em;
	font-size: 16px;
}
.modal-info-light .modal-body{
	background-color: #EFDEB9;
	color: #6C2C2F;
}
.modal-info .modal-body > *:first-child{
	padding-right: 25px;
}
.modal-info ol{
	margin-left: 1em;
}
.modal-info ol li{
	list-style-type:decimal;
	padding-bottom: 0.8em;
}
.modal-info ol li ol{
	margin-top: 0.8em;
}
.modal-info ol li li{
	list-style-type: lower-alpha;
}
.modal-info ol li li li{
	list-style-type: disc;
}
#bn-area .modal-info hr{
	border-color: #6C2C2F;
	margin: 0em 0 1.5em;
}
.movie-thum{
	display: flex;
	justify-content: center;
	align-items: center;
}
.movie-thum:hover{
	opacity: 0.7;
	cursor: pointer;
}
.movie-thum img{
	border-radius: 4px;
	width: 100%;
	position: relative;
	box-shadow: 0px 0px 8px #e4c499;
}
.movie-thum::before{
	position: absolute;
	content: url(../img/common/btn_play.png);
	z-index: 2;
	/* max-width: ; */
}
.timeline{
	text-align: center;
	display: flex;
	flex-flow: column;
	justify-content: center;
	align-items: center;
}
.twitter-follow-button{
	margin-left: 0.7em;
	vertical-align: middle;
}
.twitter-timeline{
	background-color: #000a;
}
.box-char a{
	background: url(../img/character/char_frame.png) left top no-repeat;
	display: block;
	width: 242px;
	height: 262px;
	position: relative;
	margin: auto;
}
.box-char-g a{
	background: url(../img/character/char_frame_g.png) left top no-repeat;
}
.box-char-b a{
	background: url(../img/character/char_frame_b.png) left top no-repeat;
}
.box-char-b .i-zoom-char::before{
	right: -10px;
}
.box-char-b a span{
	font-size: 0.9em;
	line-height: 1.7;
}

.box-char a:hover img{
	opacity: 1;
}
.box-char a:hover{
	cursor: pointer;
	opacity: 0.7;
	transition: 0.5s;
}
.box-char a span{
	position: absolute;
	z-index: 2;
	left: 0;
	bottom: 19px;
	text-align: center;
	width: 242px;
	font-weight: bold;
	color: #FFF;
	/* text-shadow: none; */
}


/* special */

.box-endcard a{
	background: url(../img/special/endcard_frame.png) left top no-repeat;
}
.box-endcard img{
	border-radius: 100%;
	border: 2px solid #E0BA89;
	width: 180px;
	position: absolute;
	left: 28px;
	top: 27px;
}
.box-endcard a span{
	text-shadow: none;
	color: #461719;
}
.box-endcard .i-zoom::before{
	right: 5px;
}
@media screen and (max-width:767px){
	/* .modal-endcard{
			display: flex;
			align-items: center;
	} */
	.modal-endcard .modal-dialog-centered{
		align-items: inherit;

	}
	/* .modal-endcard .modal-dialog-centered .modal-content{
		    padding-bottom: 100%;
	} */
}
.box-designer{
	background-color: #EAE4D1EE;
	text-shadow: none;
	color: #3C230F;
	position: relative;
	margin: 0 2em;
}
@media screen and (max-width:768px){
	.box-designer{
		margin: 0 1em;
	}
}
.box-designer::before{
	content: "";
	position: absolute;
	display: block;
	left: -20px;
	top: -20px;
	background: url(../img/common/i_gear.png) no-repeat left top;
	background-size: 100%;
	width: 90px;
	height: 64px;
	transform: rotate(155deg);
}
.box-designer::after{
    content: "";
    position: absolute;
    display: block;
    right: -20px;
    bottom: -20px;
    background: url(../img/common/i_gear.png) no-repeat left top;
	background-size: 100%;
    width: 90px;
    height: 64px;
    transform: rotate(-25deg);
}
.box-designer p{
	margin-bottom: 10px;
}
.box-designer img{
	border-radius: 200px;
}
.box-designer .ds-name{
	font-weight: bold;
	font-size: 1.2em;
}
.box-designer .ds-position span{
		font-size: 0.8em;
    background: linear-gradient(transparent 50%, #E0BA89AA 0%);
    padding: 0 0.5em;
}
.col-15, .col-sm-15, .col-md-15, .col-lg-15 {
	position: relative;
	min-height: 1px;
	padding-right: 0px;
	padding-left: 0px;
	width: 242px;
	/* height: 262px; */
}
.col-15 a, .col-sm-15 a, .col-md-15 a, .col-lg-15 a {
	/* background-size: 100%; */
}
.col-15 img, .col-sm-15 img, .col-md-15 img, .col-lg-15 img {
	/* width: 72%; */
}
@media (min-width: 768px) {
  .col-sm-15 {
    width: 20%;
    flex: 0 0 20%;
  }
}
@media (min-width: 992px) {
  .col-md-15 {
    width: 20%;
    flex: 0 0 20%;
  }
}
@media (min-width: 1200px) {
  .col-lg-15 {
    width: 20%;
    flex: 0 0 20%;
  }
	.col-lg-15 a{
		width: 100%;
		background-size: 90%;
		height: 208px;
		background-position: center top;
	}
	.col-lg-15 img{
	width: 66%;
top: 22px;
    left: 34px;
	}
	.col-lg-15 a span{
		width: 100%;
	}
	.body-en .col-lg-15 a span{
		font-size: 15px;
		bottom: 23px;
	}
}
/* .col-15{
  width: 20%;
  flex: 0 0 20%;
} */
.modal-endcard p{
	margin-bottom: 0;
	text-align: center;
}
.modal-endcard .close{
	top: 0;
	background: none;
}
.modal-endcard .row{
	justify-content: center;
	align-items: center;
	padding: 0 15px;
}
.modal-endcard .endcard-name{
	font-size: 1.2em;
	text-align: center;
}
.modal-endcard .endcard-icon img{
	border-radius: 100%;
	width: 320px;
	margin-bottom: 0.5em;
}
.modal-endcard .modal-body > .row::before{
    content: "";
    position: absolute;
    display: block;
    left: -30px;
    top: -40px;
    background: url(../img/common/i_gear.png) no-repeat left top;
    width: 150px;
    height: 103px;
    transform: rotate(155deg);
}
.modal-endcard .modal-body::after{
    content: "";
    position: absolute;
    display: block;
    right: -40px;
    bottom: -50px;
    background: url(../img/common/i_gear.png) no-repeat left top;
    width: 150px;
    height: 103px;
    transform: rotate(-25deg);
}
@media screen and (max-width:768px){
	.modal-endcard .modal-body > .row::before{
    left: -40px;
    top: -40px;
    transform: rotate(155deg) scale(0.6);
	}
	.modal-endcard .modal-body::after{
    right: -40px;
    bottom: -40px;
    transform: rotate(-25deg) scale(0.6);
	}
}
.endcard-pro span,
.endcard-mes span,
.endcard-sns span{
	/* background-color: #461719;
	color: #FFF;
	display: inline-block;
	padding: 0.2em 0.5em;
	margin-bottom: 5px; */
	font-size: 0.8em;
	/* color: #666; */
	background: linear-gradient(transparent 50%, #E0BA89AA 0%);
	line-height: 2.5;
	padding: 0 0.5em;
}
p.endcard-pro {
	margin-bottom: 0.5em;
	padding-bottom: 1.5em;
	text-align: left;
}
.endcard-name{
	letter-spacing: 0.1em;
	font-weight: bold;
}
.endcard-name a{
	display: inline-block;
	margin: 0 0.2em;
}
.endcard-name img{
	vertical-align: middle;
	max-height: 21px;
}
.endcard-name i{
	font-size: 21px;
}
.endcard-name .fa-twitter{
	color: #1DA1F2;
}
.endcard-name ul{
	display: flex;
}
.endcard-name li{
	font-size: 0;
	padding: 0.2em;
	width: 28px;
	/* display: inline-block; */
}
.modal-dialog-endcard {
    min-height: calc(100vh - 60px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: auto;
}
@media(max-width: 768px) {
  .modal-dialog-endcard {
    min-height: calc(100vh - 20px);
  }
}

.modal-endcard .modal-body{
	background: url(../img/special/endcard_b01.png) right center no-repeat;
	background-size: cover;
	border-radius: 1em;
	color: #222;
}
.modal-endcard .modal-body .row .col-lg:last-of-type{
	padding-bottom: 3em;
}
#endcard_01 .modal-body{
	background-image: url(../img/special/endcard_b01.png);
}
#endcard_02 .modal-body{
	background-image: url(../img/special/endcard_b02.png);
}
#endcard_03 .modal-body{
	background-image: url(../img/special/endcard_b03.png);
}
#endcard_04 .modal-body{
	background-image: url(../img/special/endcard_b04.png);
}
#endcard_05 .modal-body{
	background-image: url(../img/special/endcard_b05.png);
}
#endcard_06 .modal-body{
	background-image: url(../img/special/endcard_b06.png);
}
#endcard_07 .modal-body{
	background-image: url(../img/special/endcard_b07.png);
}
#endcard_08 .modal-body{
	background-image: url(../img/special/endcard_b08.png);
}
#endcard_09 .modal-body{
	background-image: url(../img/special/endcard_b09.png);
}
#endcard_10 .modal-body{
	background-image: url(../img/special/endcard_b10.png);
}
.modal-endcard .modal-body a,
.modal-endcard .modal-body a:hover,
.modal-endcard .modal-body a:active{
	color:#461719;
}
.modal-endcard .modal-body::before{
    content: "";
    background-color: #fff4e9db;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 1em;
}

/* products */

.ul-order li{
	margin-bottom: 0.5em;
	padding: 5px;
}
#bn-area .ul-order {
    margin: 0em 0em 1em;
}
#bn-area .ul-order li{
	margin-bottom: 0;
}
#bn-area-sub{
	margin-top: -100px;
	padding-top: 100px;
}
.ul-order li a{
	display: block;
	background: #666;
	border-radius: 2em;
	text-align: center;
	text-decoration: none;
	color: #FFF;
	padding: 0.5em 0;
	border: 2px solid #FFF;
	line-height: 2rem;
	font-size: 0.9em;
}
.ul-order li a .notes{
	font-size: 0.7em;
}
#bn-area .ul-order li a{
	line-height: 1.5rem;
}
.ul-order li a:hover{
	opacity: 0.7;
}
.ul-order li a.no-link{
	opacity: 0.4;
}
.ul-order li a.a-ns{
	background:linear-gradient(#E6001233, #E60012CC);
}
.ul-order li a.a-ps{
	background:linear-gradient(#0070D133, #0070D1CC);
}
.ul-order li a.a-st{
	background:linear-gradient(#112C5F33, #112C5FCC);
}
.ul-order li a.a-xb{
	background:linear-gradient(#107C1033, #107C10CC);
}
.ul-order li a.a-eg{
	background:linear-gradient(#2A2A2A33, #2A2A2ACC);
}
.ul-order li a.a-dm{
	background:linear-gradient(#99999933, #999999CC);
}
.ul-order li a.a-ios{
	background:linear-gradient(#1F91EB33, #1F91EBCC);
}
.ul-order li a.a-and{
	background:linear-gradient(#00a17333, #00a173CC);
}

/* store-area */
.div-edition{
	/* display: inline-block; */
	/* width: auto; */
}
.div-edition a{
	display: inline-block;
	color: #FFF;
	text-decoration: none;
	font-size: 80%;
}
.btn-buy{
	position: relative;
    background-color: #c8161d;
    border: 0;
    border-radius: 3px;
    display: inline-block;
    color: #6d2c2f;
    padding: 0.5em 1.5em 0.5em 2.3em;
    font-size: 1.1rem;
    margin: 15px auto 0px;
    text-shadow: 0px 0px 4px #000;
    border: 1px solid #ff5a60;
		cursor: pointer;
		border-radius: 2px;
		min-width: 10em;
}
.btn-buy:hover{
	opacity: 0.7;
}
.body-en .btn-buy{
    /* font-size: 1.0rem; */
    font-size: 0.8rem;
}
.btn-buy:not([href]):not([tabindex]){
	color: #FFF;

}
.btn-buy::before{
    content: "\f054";
    font-family: 'Font awesome 6 Free';
    font-weight: bold;
    padding-right: 0.5em;
    font-size: 0.7em;
    line-height: 2;
    left: 2em;
		vertical-align: middle;
		margin-left: -1.3em;
}
.popover-body {
	font-size: 0.9em;
}
.btn-form{
		position: relative;
    background-color: #ed5f23;
    border: 0;
    border-radius: 3px;
    display: inline-block;
    color: #FFF;
    padding: 0.5em 1.5em;
    font-size: 1.1rem;
    margin: 2rem auto;
    text-shadow: 0px 0px 4px #000;
    border: 1px solid #ff5a60;
		cursor: pointer;
		border-radius: 2px;
		max-width: inherit;
}
.div-edition i{
	position: absolute;
	right: 0;
	top: -0.7em;
}

#a-switch{
	margin-top:-130px;
  padding-top:130px;
}

.info-img{
	border-radius: 0.5em;
	max-width: 600px;
	margin: 0.5em auto;
	display: block;
}

#charity h4{
	font-size: inherit;
	font-weight: bold;
}
.tbl-nml th,
.tbl-nml td{
	vertical-align: top;
	padding: 0.5em;
}
.tbl-nml tr{
	border-top: 1px solid #AAA;
}
.tbl-nml tr:last-of-type{
	border-bottom: 1px solid #AAA;
}
.tbl-nml th{
	white-space: nowrap;
}
.tbl-nml ul{
	margin-bottom: 0px;
}
@media screen and (max-width:768px){
	.tbl-nml th,
	.tbl-nml td{
		display: block;
	}
	.tbl-nml td{
		padding-top: 0px;
		padding-left: 1em;
	}
}
.message{
	background-color: #EFDEB9;
	color: #6C2C2F;
	border-radius: 1em;
	border: 1px solid #CCC;
	padding: 2em 1.5em;
	text-shadow: none;
	margin-bottom: 1.5em;
}
.message p:last-of-type{
	margin-bottom: 0px;
}
.store-link-area hr{
	margin: 1em 0px 1em 0px;
}
.store-link-area .ul-order{
    margin: 0em 0em 1em;
}
.store-link-area .ul-order li{
	margin-bottom: 0px;
}
.store-link-area .ul-order li a{
	line-height: 1.5rem;
}
#dlc1,
#dlc2,
#dlc3{
	margin-top:-115px;
  padding-top:115px;
}
.a-info{
	display: block;
	width: 100%;
	background-color: #EFDEB9;
	color: #6C2C2F;
	border-radius: 5px;
}
.d-b-indent{
	display: block;
	margin-left: 1em;
	text-indent: -1em;
}
.box-movie div[class^="col-"]{
	display: flex;
	flex-direction: column;
}
.box-movie div .p-bk{
	height: 100%;
}
.slider.carousel-inner_bn {
		/* width: 90%; */
		margin: 0 auto 0px;
}

.carousel-inner_bn .slick-slide img {
		width: auto;
		height: 100%;
}

.carousel-inner_bn {
		width: 100%;
}
.carousel-inner_bn a{
	position: relative;
}
.carousel-inner_bn .slick-list {
	padding-top: 11px!important;
}

.carousel-inner_bn .slick-slide {
		margin: 0px 5px;       
}

.carousel-inner_bn .slick-track{
		height: 185px;
}
@media screen and (max-width: 630px){
	.ss-pointer-none{
		pointer-events: none;
	}
	.ss-pointer-none::before{
		display: none;
	}
}
.slider-bn {
  display: flex;
	align-items: center;
	justify-content: center;
  /* animation: loop-slide 30s infinite linear 1s both; */
}

.slick-dots li button:before{
	color: #FFF;
	opacity: 0.35;
	content: '';
	border: 7px solid #FFF;
	border-radius: 50%;
	height: 7px;
	width: 7px;
}
.slick-dots li button:focus:before{
	opacity: 0.35;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: #FFF;
}

.slick-dots{
	bottom: -15px;
}
.slider-bn-wrap{
	position: relative;
	z-index: 11;
}
	/* @media screen and (max-width:499px) {
		.slider-bn-wrap a{
			display: flex;
		}
	} */
.slick-dots li button:hover:before{
	opacity: 1;
}

.modal-body a img:hover{
	opacity: 1;
	-webkit-filter: brightness(1.1);
	        filter: brightness(1.1);
}
.ul-nml{
margin-left: 1.5rem;
}
.ul-nml li{
	list-style-type: disc;
}
.a-link{
	padding-top: 110px;
	margin-top: -110px;
}
.ul-dash{
	margin-left: 0.5rem;
}
.ul-dash li::marker{
	list-style-type: none;
	content: "－ ";
}
.secretlink-home{
	display: none!important;
}
.secretlink-page{
	display: block!important;
}
.home .secretlink-home{
	display: block!important;
}
.home .secretlink-page{
	display: none!important;
}
.modal-body .table-bordered td, .modal-body .table-bordered th {
    border: 1px solid #333;
		vertical-align: middle;
}
.row-amb{
	position: relative;
	font-size: 1.0rem;
}
.row-amb::before{
    content: "";
    display: block;
    width: 200px;
    height: 200px;
    background: url(../img/ambassador/badge.png) left top no-repeat;
    opacity: 0.5;
    position: absolute;
    top: -7rem;
    right: -1em;
    transform: rotate(16deg);
    background-size: contain;
    mix-blend-mode: plus-lighter;
}
@media screen and (max-width: 767px){
	.row-amb::before{
    width: 20vw;
    height: 20vw;
    top: -5rem;
    overflow: hidden;
    right: 0rem;
	}
}
.img-area-thum.row-amb img{
	max-height: 330px;
	width: auto;
	margin: auto;
}
.ul-amb{
    display: flex;
    justify-content: center;
}
@media screen and (max-width: 475px) {
	.ul-amb{
		flex-flow: wrap;
	}
}
.ul-amb li{
	padding: 0.3rem;
}
@media screen and (max-width:475px) {
.ul-amb li{
    width: 30vw;
}
}
.li-amb-photo img{
    max-width: 150px;
    -o-object-fit: contain;
       object-fit: contain;
    border-radius: 100%;
    border: 3px solid #EFDEB9;
    -o-object-fit: cover;
       object-fit: cover;
    aspect-ratio: 1/1;
		margin-left: auto;
		margin-right: auto;
}
@media screen and (max-width:991px) {
	.li-amb-photo img{
			max-width: 100%;
	}
}
.li-amb-name{
	font-size: 0.8rem;
	text-align: center;
	padding-top: 0.8rem;
}
.btn-nml:hover{
  opacity: 0.7;
}
.row-white{
  background-color: #FFF; 
  padding: 1rem; 
  border-radius: 5px;
}
.row-white p{
	margin-bottom: 5px;
}
.row-white img{
  display: block;
  margin: auto;
}
.ul-order-row{
  flex-flow: column;
  text-align: center;
  margin-right: -5px;
}
.ul-order-row li {
    margin-bottom: 0;
    padding: 2px;
}
.ul-order-row li a.a-st {
    background: linear-gradient(#112C5FCC, #112C5F);
}
.ul-order-row li a.a-eg {
    /* background-color: #2A2A2A; */
    background: linear-gradient(#2A2A2ACC, #2A2A2A);
}
.modal-body-amb-pr{
	background: right center no-repeat;
    background-size: cover;
    border-radius: 1em;
}
.modal-body-amb-pr *{
	position: relative;
}
.modal-body-amb-pr::before {
    content: "";
    background-color: #000000cc;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 1em;
}
#profile_001 .modal-body-amb-pr{
	background-image: url(../img/ambassador/ph_001.jpg);
}
#profile_002 .modal-body-amb-pr{
	background-image: url(../img/ambassador/ph_002.jpg);
}
#profile_003 .modal-body-amb-pr{
	background-image: url(../img/ambassador/ph_003.jpg);
	background-position-y: -7rem;
}
#profile_004 .modal-body-amb-pr{
	background-image: url(../img/ambassador/ph_004.jpg);
}
#profile_005 .modal-body-amb-pr{
	background-image: url(../img/ambassador/ph_005.jpg);
}
#profile_006 .modal-body-amb-pr{
	background-image: url(../img/ambassador/ph_006.jpg);
	background-position-y: -4rem;
}
@media (min-width: 992px) {	
	.a-small{
			font-size: 0.8rem!important;
			line-height: 1.1!important;
			padding: 0.7rem 0.2rem!important;
			border-radius: 3rem!important;
	}
}
.bn-trim{
	overflow: hidden;
}
.bn-trim > a >  div{
	top: -23%;
	position: relative;
}
.bn-trim > a >  div > img{
	width: 352px!important;
}
@media screen and (max-width: 489px) {
	.bn-trim{
		height: 49vw;
	}
.bn-trim > a >  div > img{
	width: 100%!important;
}
}
.anim-blink{
	-webkit-animation: i-new-anim .7s infinite alternate ease-in-out;
	animation: i-new-anim .7s infinite alternate ease-in-out;
}
.tag-new{
    background-color: #DA526B;
    color: #FFF;
		font-weight: bold;
    border-radius: 0.3rem;
    display: inline-block;
    padding: 0.2rem 0.3rem;
    line-height: 1;
    margin: 0rem;
		font-size: 0.8rem;
}
.row-fit {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin: 0 auto;
}

/* modal-video */
.modal-video {
	opacity: 1;
	transition: opacity 0.3s ease;
}
.modal-video.modal-video-close {
	opacity: 0;
}
.modal-video-movie-wrap {
	animation: slideIn 0.3s ease-out forwards;
}
@keyframes slideIn {
	from {
		transform: translateY(-50px);
		opacity: 0;
	}
	to {
		transform: translateY(0);
		opacity: 1;
	}
}
.modal-video.modal-video-close .modal-video-movie-wrap {
	animation: slideOut 0.3s ease-in forwards;
}
@keyframes slideOut {
	from {
		transform: translateY(0);
		opacity: 1;
	}
	to {
		transform: translateY(-50px);
		/* 下にスライドアウト */
		opacity: 0;
	}
}
@media (min-width: 576px) and (max-width: 991px) {
	.modal-video-body {
		max-width: 90%;
		margin: 1.75em auto;
	}
}
@media (min-width: 992px) {
	.modal-video-body {
		max-width: 800px
	}
}
@media (min-width: 1200px) {
	.modal-video-body {
		max-width: 1140px
	}
}
button.modal-video-close-btn {
	color: #FFF;
	/* display: block; */
	/* width: 3em; */
	margin-left: auto;
	font-family: sans-serif;
	position: absolute;
	z-index: 99;
	font-size: 2rem;
	border-radius: 2rem;
	right: -0.5em;
	top: -1.4em;
	background-color: #000;
	border-radius: 1.3em;
	width: 1.3em;
	height: 1.3em;
	line-height: 1;
	font-size: 2.0em;
	font-weight: bold;
}
.close:hover {
	color: #FFF;
}
button.modal-video-close-btn:before, button.modal-video-close-btn:after {
	display: none;
}
.modal-video-movie-wrap {
	/* -webkit-filter: drop-shadow(0px 0px 5px #1effc8);
	filter: drop-shadow(0px 0px 5px #1effc8); */
}
.modal-video-inner {
	padding: 10px 0px;
	box-sizing: border-box;
}
/* modal-video end */