html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,main {margin:0;padding:0;border:0;font-size:100%;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main {display:block;}
body {font-family:Verdana,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1;}
ol,ul {list-style:none;}
blockquote,q {quotes:none;}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}
wbr:after {content:"\00200B";}

/*	TBS reset
============================== */
.alt {position:absolute;top:-5000px;left:-9999px;}
.clearfix:after {content:"";clear:both;display:block;}
.hide-txt {text-indent:110%;white-space:nowrap;overflow:hidden;}
.fp-causion {display:none;}
.nocontxt {-webkit-touch-callout: none;-webkit-user-select: none;user-select: none;-webkit-user-drag:none;}
.nocontxt img {pointer-events: none;}
@media all and (min-width:768px) {
.alt-pc {position:absolute;top:-5000px;left:-9999px;}
.clearfix-pc:after {content:"";clear:both;display:block;}
.hide-txt-pc {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
@media all and (max-width:767px) {
.alt-smp {position:absolute;top:-5000px;left:-9999px;}
.clearfix-smp:after {content:"";clear:both;display:block;}
.hide-txt-smp {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
div.embed-tbsplayer {
background-color:#000;
position:relative;
height:0;
padding-top:56.25%;
}
div.embed-tbsplayer .tbs-player {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
}
div.embed-tbsplayer-audio {
background-color:#fff;
}
div.embed-tbsplayer-audio .tbs-player {
height:46px;
}
div.lbx-overlay {
z-index:10000;position:absolute;background-color:#000;width:100%;height:100%;left:0;top:0;right:0;bottom:0;opacity:0.9;
}
/* ============================
	general hole
============================ */

/* whole
=============================================== */

body {
	font-family: "noto-sans-cjk-jp", Roboto, "Droid Sans", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight: 400;
	color: #333;
}

.alt { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.cover { background: url(/img/cover.gif); display: block; width: 100%; height: 100%; }
.lazy { display: block; position: relative; }

#container {
	text-align:center;
}


/* parts
=============================================== */

/* font style
-------------------------------- */

@font-face {
  font-family: 'Anton';
  src: url('/um/library/fonts/Anton/Anton-Regular.ttf') format('truetype');
	   font-weight:normal;
}

:root {
  --cl-orange:#ff6623;
  --cl-black:#171C26;
  --cl-darkgray:#33363B;
  --cl-darkgray2:#171C26;
  --cl-lightgray:#E6E6E6;
  --cl-lightgray2:#EFEFEF;
	--cl-white:#FFFFFF;
}

.orange { color: var(--cl-orange); }

.bold { font-weight: 700; }
.txtss { font-size: 70%; }
.txts { font-size: 80%; }
.txtb { font-size: 120%; }
.txtbb { font-size: 160%; }
.txtbbb { font-size: 200%; }


/* br point
-------------------------------- */

.br-pc { display: block; }
.br-smp { display: none; }

/* ---- Media Queries ---- */

@media all and (max-width: 767px) {

.br-pc { display: none; }
.br-smp { display: block; }

}


/* word br
-------------------------------- */

.wbr { display: inline-block; }


/* margin padding
-------------------------------- */

/* mg = margin */
/* pd = padding */
/* t = top */
/* b = bottom */

.mgt0 { margin-top:0!important; }
.mgt05 { margin-top:0.5em!important; }
.mgt1 { margin-top:1.0em!important; }
.mgt15 { margin-top:1.5em!important; }
.mgt2 { margin-top:2.0em!important; }
.mgt3 { margin-top:3.0em!important; }
.pdt0 { padding-top:0!important; }
.pdt05 { padding-top:0.5em!important; }
.pdt1 { padding-top:1.0em!important; }
.pdt15 { padding-top:1.5em!important; }
.pdt2 { padding-top:2.0em!important; }
.pdt3 { padding-top:3.0em!important; }
.mgb0 { margin-bottom:0!important; }
.mgb05 { margin-bottom:1.0em!important; }
.mgb1 { margin-bottom:1.0em!important; }
.mgb15 { margin-bottom:1.5em!important; }
.mgb2 { margin-bottom:2.0em!important; }
.mgb3 { margin-bottom:3.0em!important; }
.pdb0 { padding-bottom:0!important; }
.pdb05 { padding-bottom:0.5em!important; }
.pdb1 { padding-bottom:1.0em!important; }
.pdb15 { padding-bottom:1.5em!important; }
.pdb2 { padding-bottom:2.0em!important; }
.pdb3 { padding-bottom:3.0em!important; }
.mgtn05 { margin-top:-0.5em!important; }
.mgtn1  { margin-top:-1.0em!important; }
.mgtn15 { margin-top:-1.5em!important; }
.mgtn2  { margin-top:-2.0em!important; }
.mgtn3  { margin-top:-3.0em!important; }
.mgbn05 { margin-bottom:-0.5em!important; }
.mgbn1  { margin-bottom:-1.0em!important; }
.mgbn15 { margin-bottom:-1.5em!important; }
.mgbn2  { margin-bottom:-2.0em!important; }
.mgbn3  { margin-bottom:-3.0em!important; }

/* ============================
	general header
============================ */

/* gnav
=============================================== */

#gnav {
	background-color: var(--cl-darkgray);
}

#gnav.is-fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000;
}

#gnav ul {
	max-width:1200px;
	margin:auto;
	display: flex;
}

#gnav ul li {
	flex: 1;
	font-size: 18px;
}
.gnav-item {
	display: block;
	width: 100%;
	height: 100%;
	padding: 1.1em 0.5em 1.2em 0;
	box-sizing: border-box;
	border-bottom: var(--cl-darkgray) 0.3em solid;
	color: #fff;
	text-decoration: none;
	transition: background-color 0.2s ease;
}
@media (hover: hover) {
	a.gnav-item:hover {
		background-color: var(--cl-black);
		border-bottom-color: var(--cl-orange);
	}
}

#top #gnav ul li:nth-child(1) a.gnav-item,
#introduction #gnav ul li:nth-child(2) a.gnav-item,
#spotlight #gnav ul li:nth-child(3) a.gnav-item {
	background-color: #51555B;
	border-bottom-color: var(--cl-orange);
}

.gnav-coming {
	position: relative;
}
.gnav-coming .gnav-item {
	opacity: 0.3;
}

.gnav-coming::before {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: url(../img/common/gnav_comingsoon.png) no-repeat center;
}

.gnav-item::before {
	content: "";
	display: inline-block;
	margin: auto 0.5em -0.45em 0;
	width: 1.8em;
	height: 1.8em;
	background-color: var(--cl-orange);
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
	transition: background-color 0.2s ease;
}

#gnav ul li:nth-child(1) .gnav-item::before {
	-webkit-mask-image: url(../img/common/gnav_icon_top.svg);
	mask-image: url(../img/common/gnav_icon_top.svg);
}

#gnav ul li:nth-child(2) .gnav-item::before {
	-webkit-mask-image: url(../img/common/gnav_icon_introduction.svg);
	mask-image: url(../img/common/gnav_icon_introduction.svg);
}

#gnav ul li:nth-child(3) .gnav-item::before {
	-webkit-mask-image: url(../img/common/gnav_icon_spotlight.svg);
	mask-image: url(../img/common/gnav_icon_spotlight.svg);
}

#gnav ul li:nth-child(4) .gnav-item::before {
	-webkit-mask-image: url(../img/common/gnav_icon_special.svg);
	mask-image: url(../img/common/gnav_icon_special.svg);
}

#top #gnav ul li:nth-child(1) a.gnav-item::before,
#introduction #gnav ul li:nth-child(2) a.gnav-item::before,
#spotlight #gnav ul li:nth-child(3) a.gnav-item::before{
	background-color: var(--cl-white);
}


/* ---- Media Queries ---- */

@media all and (max-width: 767px) {

#gnav ul li {
	font-size: 12px;
}

.gnav-coming::before {
  background-size:70%;
}

}

/* ============================
	general main
============================ */

/* main title
=============================================== */

.maintitle {
	padding: 35px 0;
	line-height: 1.2;
}

.maintitle .en,
.maintitle .jp {
	display: block;
}

.maintitle .en {
	margin-bottom: 0.1em;
	font-family: 'Anton';
	font-size: 60px;
	font-weight: normal;
	letter-spacing: 0.01em;
}

.maintitle .jp {
	font-size: 18px;
	color: var(--cl-orange);
}

/* ---- Media Queries ---- */

@media all and (max-width: 767px) {

.maintitle {
	padding: 20px 15px;
}

.maintitle .en {
	font-size: 40px;
}

.maintitle .jp {
	font-size: 16px;
}

}



/* main box
=============================================== */

#main {
  max-width:1200px;
  margin: 0 auto;
	box-sizing: border-box;
}

#main .chapter {
	margin-bottom: 2.0em;
	border-bottom: var(--cl-lightgray) 1px solid;
}

#main .chapter:last-child {
	border-bottom: none;
}

#main .box {
	margin-bottom: 1.5em;
}

/* ---- Media Queries ---- */

@media all and (max-width: 767px) {

#main {
  width: 100%;
}

}



/* main parts
=============================================== */

#main .subtitle {
	padding-bottom: 0.5em;
	font-size: 180%;
	line-height: 140%;
	text-align:left;
}

#main .stitle {
	padding-bottom: 0.5em;
	font-size: 150%;
	line-height: 140%;
	text-align:left;
}

#main .sstitle {
	padding-bottom: 0.5em;
	font-size: 120%;
	line-height: 140%;
	text-align:left;
}

#main .text {
	padding-bottom: 0.7em;
	line-height: 170%;
	text-align:left;
}

#main .list {
	padding: 0 0 1.0em 1.2em;
	text-align:left;
}

#main .list li {
	padding-bottom: 0.5em;
	line-height: 170%;
	list-style-type: disc;
}

#main .list-nm {
	padding: 0 0 1.0em 1.2em;
	text-align:left;
}

#main .list-nm li {
	padding-bottom: 0.5em;
	line-height: 170%;
	list-style-type: decimal;
}

#main .list-clnm {
	padding-bottom: 1.0em;
	counter-reset: my-counter;
	list-style: none;
	text-align: left;
}

#main .list-clnm li {
	padding: 0 0 0.5em 1.4em;
	position: relative;
	line-height: 170%;
}

#main .list-clnm li:before {
	content: counter(my-counter);
	counter-increment: my-counter;
	border: 1px solid;
	border-radius: 50%;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 1.375em;
	width: 1.375em;
	font-size: 85%;
	line-height: 1;
	position: absolute;
	top: 0.35em;
	left: 0;
}

#main .btn {
	padding-bottom: 1.0em;
}

#main .btn.btn-center {
	text-align: center;
}

#main .btn.btn-right {
	text-align: right;
}

#main .btn p {
	display: inline-block;
	padding: 0 0.5em;
	box-sizing: border-box;
}

#main .btn p a {
	display: inline-block;
	position: relative;
	padding: 0.9em 2.5em 1.1em 1.5em;
	box-sizing: border-box;
	border-radius: 1000px;
	background-color: var(--cl-orange);
	font-size: 90%;
	font-weight: 700;
	color: #fff;
	text-decoration: none;
	text-align: center;
	line-height: 120%;
	transition: opacity 0.2s ease;
}
@media (hover: hover) {
	#main .btn p a:hover {
		opacity: 0.7;
	}
}

#main .btn p a::before {
	position: absolute;
	top: 50%;
	right: 1.0em;
	content: "";
	width: 0;
	height: 0;
	border-top: 0.35em solid transparent;
	border-bottom: 0.35em solid transparent;
	border-left: 0.55em solid #fff;
	transform: translateY(-50%);
}


/* ---- Media Queries ---- */

@media all and (max-width: 767px) {

#main .subttl {
  font-size: 155%;
}

#main .sttl {
  font-size: 140%;
}

#main .ssttl {
  font-size: 110%;
}

#main .chapter {
  margin-bottom: 1.5em;
}

#main .box {
  margin-bottom: 1.0em;
}

}



/* youtube
-------------------------------- */

.mov-yt {
	max-width:1000px;
	margin: auto;
	aspect-ratio: 16 / 9;
}

.mov-yt iframe {
	width: 100%;
	height: 100%;
}

/* ============================
	general footer
============================ */

/* general
=============================================== */

.footer {
	background-color: var(--cl-darkgray);
	color: #fff;
}

.footer-inner {
	padding: 50px 25px;
	box-sizing: border-box;
}

.f-copyright {
	margin-top: 30px;
	text-align: center;
	font-size: 15px;
	line-height: 1.5;
}

.f-copyright a {
	color: var(--cl-orange);
}

/* ---- Media Queries ---- */

@media all and (max-width: 767px) {

.footer-inner {
	padding: 20px 10px;
}

.f-copyright {
font-size: 13px;
}

}


/* f-bn-branding
=============================================== */

.f-bn {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 20px;
	margin-bottom: 30px;
}

.f-bn li a {
	transition: opacity 0.2s ease;
}

@media (hover: hover) {
	.f-bn li a:hover {
		opacity: 0.7;
	}
}

.f-bn li img {
	width: 100%;
	height: auto;
}

.f-bn-branding {
	width: 588px;
	aspect-ratio: 1176 / 294;
}


/* f-sns-link
=============================================== */

.f-sns-link {
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: #000 1px solid;
}

.f-sns-link .title {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 20px;
	text-align: center;
}

.f-sns-link ul {
	display: flex;
	justify-content: center;
	gap: 50px;
}

.f-sns-link ul li a {
	display: flex;
	align-items: center;
	color: #fff;
	font-size: 16px;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

@media (hover: hover) {
	.f-sns-link ul li a:hover {
		opacity: 0.7;
	}
}

.f-sns-link ul li a .name {
	margin-left: 13px;
}

.f-sns-link ul li a img {
	width: 56px;
	aspect-ratio: 1 / 1;
}

/* ---- Media Queries ---- */

@media all and (max-width: 767px) {

	.f-sns-link {
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.f-sns-link .title {
		font-size: 16px;
	}

	.f-sns-link ul {
		gap: 20px;
	}

	.f-sns-link ul li a .name {
		display: none;
	}

	.f-sns-link ul li a img {
		width: 48px;
	}

}


/* f-sns-share
=============================================== */

.f-sns-share {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 20px;
	margin-bottom: 30px;
}

.f-sns-share ul {
	display: flex;
	gap: 32px;
}

.f-sns-share ul li a {
	transition: opacity 0.2s ease;
}

@media (hover: hover) {
	.f-sns-share ul li a:hover {
		opacity: 0.7;
	}
}


.f-sns-share ul li a img {
	width: 56px;
	aspect-ratio: 1 / 1;
}

/* ---- Media Queries ---- */

@media all and (max-width: 767px) {

	.f-sns-share {
		flex-direction: column;
	}

	.f-sns-share ul {
		gap: 20px;
	}

	.f-sns-share ul li a img {
		width: 48px;
	}

}


/* pagetop
=============================================== */

#pagetop {
	position: fixed;
	z-index: 10;
	bottom: -200px;
	right: 20px;
	padding-bottom: 20px;
}

#pagetop img {
	width: 64px;
	aspect-ratio: 1 / 1;
}

/* ---- Media Queries ---- */

@media all and (max-width: 767px) {

#pagetop img {
	width: 44px;
}

}


/*eof*/