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;
}

/* ============================
	common css
============================ */

/*  General
=============================================== */

body { background:#012823; }

#con-body { background:transparent; font-family:kinto-sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, Roboto, "Droid Sans", sans-serif; font-weight:400; font-style:normal; color:#333; /* for ios */ -webkit-text-size-adjust: 100%; }

a { color:#B32705; }

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




/*  General Parts
=============================================== */

.bold { font-weight:700; }

.cover { background:url(/img/cover.gif); display:block; width:100%; height:100%; }

.lazy { display:block; position:relative; }


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

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

.nl-orange { color:#FF6A31; }
.pl-red { color:#EA2C3A; }
.deepred { color:#920C30; }

.blue { color:#3953C9; }
.red { color:#B32705; }
.yellow { color:#FDEB3D; }


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

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

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

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

}


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

.wbr { display:inline-block; }



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

.mov_yt { width:100%; margin:0 0 20px 0; }
.mov_yt_inner { position:relative; width:auto; height:0; padding-top:56.25%; }
.mov_yt_inner iframe { position:absolute; left:0; top:0; width:100%; height:100%; }


/*  Header
=============================================== */
#header { width:980px; margin:auto; padding:10px; box-sizing:border-box; }
#logo { position:relative; width:100%; height:0; padding-top:23.469387755102%; }
#logo a { position:absolute; display:block; left:0; top:0; width:100%; height:100%; background-image:url(../img/common/header-s0323.jpg); background-position:center center; background-repeat:no-repeat; background-size:cover; text-indent:-9999px;  /* hover fade */ transition: opacity 0.2s ease-out; }
@media (hover: hover) { #logo a:hover { opacity:0.7; } }

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

@media all and (max-width: 767px) {
#header { width:auto; }
#logo { padding-top:23.469387755102%; }
#logo a { background-image:url(../img/common/header-s0323.jpg); }
}


/* gnav
=============================================== */
#gnav { margin-bottom:20px; background:rgb(7,14,19); background:linear-gradient(0deg, rgba(7,14,19,1) 0%, rgba(60,68,73,1) 50%, rgba(7,14,19,1) 100%); }
#gnav ul { display:flex; flex-wrap:wrap; width:980px; margin:auto; text-align:center; }
#gnav ul li { display:flex; align-items:stretch; background:rgb(7,14,19); background:linear-gradient(0deg, rgba(7,14,19,1) 0%, rgba(60,68,73,1) 50%, rgba(7,14,19,1) 100%); }
#gnav ul li:nth-child(1) { width:20%; }
#gnav ul li:nth-child(2) { width:25%; }
#gnav ul li:nth-child(3) { width:20%;  }
#gnav ul li:nth-child(4) { width:15%; }
#gnav ul li:nth-child(5) { width:20%; }


#gnav ul li a { text-decoration:none; }
.gnav-link { display:block; width:100%; header:100%!important; padding:2.0em 0; box-sizing:border-box; border-left:#000 1px solid; display:flex; justify-content:center; align-items:center; text-shadow:0px 2px 4px rgba(0,0,0,1.0); /* hover fade */ transition: text-shadow 0.4s ease-out; }
@media (hover: hover) { a.gnav-link:hover { text-shadow:0px 0px 10px rgba(253,235,61,1.0); } }
.gnav-link.gnav-coming { opacity:0.4; }
#gnav ul li:last-child .gnav-link { border-right:#000 1px solid; }
.gnav-link .en, .gnav-link .jp { display:block; }
.gnav-link .en { font-family:'Anton'; font-weight:400; font-size:220%; color:#fff; margin-bottom:0.3em; }
.gnav-link .jp { font-weight:700; font-style:normal; font-size:110%; color:#FDEB3D; }

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

@media all and (max-width: 767px) {
#gnav ul { width:auto; }
#gnav ul li:nth-child(1) ,#gnav ul li:nth-child(2),#gnav ul li:nth-child(3)  { width:33.3333333%; }
#gnav ul li:nth-child(4),#gnav ul li:nth-child(5) { width:50%; }

.gnav-link:nth-child(1),.gnav-link:nth-child(2),.gnav-link:nth-child(4){ border-left:none; border-right:#000 1px solid; }
.gnav-link:nth-child(3),.gnav-link:nth-child(5){ border-right:none; }
.gnav-link .en { display:none; }
.gnav-link .jp { font-size:4.8vw; line-height:120%; }
}



/*  Main
=============================================== */

#main { width:980px; margin:auto; }
.s{font-size:85%;}
#snav { margin-bottom:20px; padding:15px 15px 0 15px; box-sizing:border-box; border-radius:20px; background: rgb(255,106,49); background: linear-gradient(90deg, rgba(255,106,49,1) 0%, rgba(234,44,58,1) 100%); font-feature-settings:"palt"; text-align:center; /* for space */ font-size:0; }
#snav li { display:inline-block; margin:0 15px 15px 0; vertical-align:middle; /* for space */ font-size:1.3rem; }
#snav li a { color:#fff; text-decoration:none; font-weight:700; /* hover fade */ transition: opacity 0.2s ease-out; }
.nobr { display:none; }

@media (hover: hover) { #snav li a:hover { opacity:0.5; } }
#snav li a::before { content:"▶︎"; font-size:50%; margin:-0.25em 0.5em auto 0; display:inline-block; vertical-align:middle; }

.box { margin-bottom:40px; }
.box-hd { margin-bottom:20px; text-align:center; }
.box-ttl { color:#fff; }
.box-ttl .en, .box-ttl .jp { display:block; text-shadow:0px 2px 4px rgba(0,0,0,0.2); }
.box-ttl .en { margin-bottom:5px; font-size:320%; font-family:'Anton', sans-serif; font-weight:400; letter-spacing:0.02em; }
.box-ttl .jp { font-weight:900; font-style:normal; font-size:110%; }
.box-body { padding:40px; background-color:#fff; border-radius:40px; color:#333; }

.subttl { margin-bottom:0.8em; padding:0.5em 0.7em; background-color:#121D22; border-radius:10px; color:#fff; font-size:120%; line-height:130%; }
.chapter { margin-bottom:30px; }
.chapter .txt { margin-bottom:1.0em; line-height:160%; }

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

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

#main { width:94%; margin:0 3%; }

#snav li { font-size:1.1rem; }

.box-ttl { font-size:80%; }
.box-body { padding:15px; border-radius:15px; }

.subttl { font-size:100%; }
.chapter .txt { font-size:90%; }
.nobr { display:block; }
}
/* br point
-------------------------------- */

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

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

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

}

/* top-attention
=============================================== */
.br_smp { display: -webkit-block; display: block; }
@media all and (min-width: 768px) {.br_smp{ display: none; } }

/*  Footer
=============================================== */

#footer { text-align:center; margin:0 0 15px 0; color:#fff; }

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

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

#footer { width:94%; margin:0 3% 3% 3%; }

}


/* banner / top-banner
-------------------------------- */

#banner-list { /* for space */ font-size:0;margin-top:10px; }
#banner-list li { display:inline-block; vertical-align:middle; /* for space */ font-size:1rem; }

.banner { position:relative; width:100%; height:0; }
.banner a { position:absolute; display:block; left:0; top:0; width:100%; height:100%; background-position:center center; background-repeat:no-repeat; background-size:cover; text-indent:-9999px; /* hover fade */ transition: opacity 0.2s ease-out; }
@media (hover: hover) { .banner a:hover { opacity:0.5; } }

#f-banner { width:980px; margin:auto; }

#bn-tver,
#bn-paravi { width:48%; margin:0 1% 2% 1%; }
#bn-yt-big { width:48%; margin:0 26% 2% 26%; }
#bn-yt-wbc { width:48%; margin:0 26% 2% 26%; }

#bn-tiktok,#bn-tw,#bn-fb,#bn-insta { width:20%; margin:0 1% 2% 1%; }

#top-banner #bn-tver,
#top-banner #bn-yt-wbc,
#top-banner #bn-paravi,
#top-banner #bn-yt-big { width:100%; margin:0 0 5% 0; }

#top-banner #bn-insta { width:48%; margin:0 0% 4% 0; }
#top-banner #bn-fb { width:48%; margin:0 4% 4% 0; }
#top-banner #bn-tiktok { width:48%; margin:0 4% 4% 0; }

#bn-yt-big .banner { padding-top:23.4%;  }
#bn-yt-wbc .banner { padding-top:23.4%; }
#bn-tiktok .banner,#bn-tw .banner,#bn-insta .banner,#bn-fb .banner { padding-top:33.478%; }

#bn-fb .banner a,#bn-tw .banner a,#bn-tiktok .banner a,
#bn-insta .banner a { border:2px #fffcdb solid; box-shadow:0px 2px 4px rgba(0,0,0,0.2); }


#bn-yt-big .banner a { background-image:url(../img/common/bn_big_yt.jpg); }
#bn-fb .banner a { background-image:url(../img/common/bn_fb.jpg); }
#bn-tiktok .banner a { background-image:url(../img/common/bn_tiktok.jpg); }
#bn-tw .banner a { background-image:url(../img/common/bn_tw.jpg); }
#bn-insta .banner a { background-image:url(../img/common/bn_insta.jpg); }

/* ---- Media Queries ---- */
@media all and (max-width: 767px) {
#f-banner { width:auto; }
#bn-yt-wbc,#bn-tver,#bn-paravi,#bn-yt-big { width:100%; margin:0 0 2% 0; }

#bn-tw,#bn-insta { width:48.5%; margin:0 3% 3% 0; }
#bn-fb { width:48.5%; margin:0 0 3% 0; }
#bn-tiktok { width:48.5%; margin:0 0 3% 0; }
}


/* f-copy
-------------------------------- */

#f-copy { font-size:90%; line-height:120%; text-shadow:0px 2px 2px rgba(0,0,0,0.2); }
#f-copy a { color:#FDEB3D; }
#f-copy a:hover { text-decoration:none; }

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

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

#f-copy { font-size:80%; }

}


/* f-share
-------------------------------- */

#f-share,
#f-share-btn { display:flex; justify-content:center; align-items:center; }
#f-share { width:11.0em; margin:0 auto 20px auto; border:#fff 1px solid; border-radius:2.0em; padding:0.7em; font-size:130%; }
#f-share-ttl { font-size:85%; }
#f-share-ttl::after { content:""; display:inline-block; vertical-align:bottom; width:0.5em; height:0.5em; margin:auto 0.2em 0.1em 0.3em; background:url(../img/common/f_btn_share_arrow.png) center center no-repeat; background-size:auto 100%; }
#f-share-btn li { width:1.8em; height:1.8em; margin-left:0.4em; }
#f-share-btn li a { display:block; width:100%; height:100%; border-radius:50%; background-position:center center; background-repeat:no-repeat; background-size:cover; text-indent:-9999px; /* hover fade */ transition: opacity 0.2s ease-out; }
@media (hover: hover) { #f-share-btn li a:hover { opacity:0.5; } }
#f-share-btn-tw a {  background-image:url(../img/common/f_btn_share_tw.png); }
#f-share-btn-fb a {  background-image:url(../img/common/f_btn_share_fb.png); }
#f-share-btn-tiktok a {  background-image:url(../img/common/f_btn_share_tiktok.png); }
#f-share-btn-line a {  background-image:url(../img/common/f_btn_share_line.png); }


/* pagetop
-------------------------------- */

#pagetop { position:fixed; z-index:10; bottom:-200px; right:20px; padding-bottom:20px; }
#pagetop a { display:block; width:3.0em; height:3.0em; border-radius:3.0em; background:url(../img/common/pagetop.png) center center no-repeat; background-size:cover; box-shadow:1px 1px 4px rgba(0,0,0,0.2); text-indent:-9999px; outline:none; }


/*eof*/