@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Hind:wght@700&display=swap');

@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/YakuHanJP-Regular.woff2") format("woff2"),
    url("../fonts/YakuHanJP-Regular.woff") format("woff");
}

@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: bold;
  src: url("../fonts/YakuHanJP-Bold.woff2") format("woff2"),
    url("../fonts/YakuHanJP-Bold.woff") format("woff");
}

@font-face {
  font-family: "A_Goblin_Appears!";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/A_Goblin_Appears!.woff2") format("woff2"),
    url("../fonts/A_Goblin_Appears!.woff") format("woff");
}

@font-face {
  font-family: "misaki_gothic";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/misaki_gothic.woff2") format("woff2"),
    url("../fonts/misaki_gothic.woff") format("woff");
}


html { overflow-y:scroll; font-size: 62.5%}
ol, ul, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, h7, form, p { margin:0; padding:0; }
img { border:0; }
li { list-style-type:none; }

body {
  width:100%; margin:0; padding:0;
  font-size: 1.6em; line-height:1.5;
  color:#1E1E1E;
  background: #fff;
  font-family: "YakuHanJP", 'Noto Sans JP', "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif;
  letter-spacing: 0.05em;
  -webkit-text-size-adjust: 100%;

}
body.bg-gray {background-color: #f3f4f5;}

table th, table td { font-size:14px; }

a {
  overflow:hidden;
  -webkit-transition:.2s linear;
  -moz-transition:.2s linear;
  -o-transition:.2s linear;
  transition:.2s linear; }
a:link		{ color:#1E1E1E; text-decoration:none; }
a:visited	{ color:#1E1E1E; }
a:hover		{ opacity: 0.8; }
a:active	{ opacity: 0.8; }

img { max-width: 100%; height: auto;}

/* clearfix */
.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}

* html .clearfix { zoom: 1; } /* IE6 */  
*:first-child+html .clearfix { zoom: 1; } /* IE7 */  

.txt_c { text-align:center; }
.txt_l { text-align:left; }
.txt_r { text-align:right; }

.float_l { float:left; }
.float_r { float:right; }
.clear { clear:both; }

.serif { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif; }
.txt_dot{font-family: "misaki_gothic", serif; font-weight: 400; font-style: normal;}
.en { font-family: "Hind", serif;font-weight: 700;font-style: normal;letter-spacing: 0.03em }
.en_2 { font-family: "A_Goblin_Appears!", serif;font-weight: 400;font-style: normal;letter-spacing: 0.03em }
.bold  { font-weight:bold; }
.big   { font-size:120%; }
.small { font-size:88%; }
.red   { color:#c00; }
.mt10  { margin-top:10px; }
.mt20  { margin-top:20px; }

.shadow{box-shadow:10px 10px 20px 0 rgba(50,31,31,.06);}

.mfp-iframe-holder .mfp-close{background:#1e1e1e;width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0;border-radius:100%;opacity:1;right:0}

/* animation */
#loader-bg {display: none; position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; background-color: #fff; z-index:10000;}
#loader {display: none; position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; text-align: center; z-index: 100;}

.loader_box{position: relative; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
.loader_box .inner{width:100%;max-width:340px;position:relative}

@keyframes percentage{1%{content:"1%"}2%{content:"2%"}3%{content:"3%"}4%{content:"4%"}5%{content:"5%"}6%{content:"6%"}7%{content:"7%"}8%{content:"8%"}9%{content:"9%"}10%{content:"10%"}11%{content:"11%"}12%{content:"12%"}13%{content:"13%"}14%{content:"14%"}15%{content:"15%"}16%{content:"16%"}17%{content:"17%"}18%{content:"18%"}19%{content:"19%"}20%{content:"20%"}21%{content:"21%"}22%{content:"22%"}23%{content:"23%"}24%{content:"24%"}25%{content:"25%"}26%{content:"26%"}27%{content:"27%"}28%{content:"28%"}29%{content:"29%"}30%{content:"30%"}31%{content:"31%"}32%{content:"32%"}33%{content:"33%"}34%{content:"34%"}35%{content:"35%"}36%{content:"36%"}37%{content:"37%"}38%{content:"38%"}39%{content:"39%"}40%{content:"40%"}41%{content:"41%"}42%{content:"42%"}43%{content:"43%"}44%{content:"44%"}45%{content:"45%"}46%{content:"46%"}47%{content:"47%"}48%{content:"48%"}49%{content:"49%"}50%{content:"50%"}51%{content:"51%"}52%{content:"52%"}53%{content:"53%"}54%{content:"54%"}55%{content:"55%"}56%{content:"56%"}57%{content:"57%"}58%{content:"58%"}59%{content:"59%"}60%{content:"60%"}61%{content:"61%"}62%{content:"62%"}63%{content:"63%"}64%{content:"64%"}65%{content:"65%"}66%{content:"66%"}67%{content:"67%"}68%{content:"68%"}69%{content:"69%"}70%{content:"70%"}71%{content:"71%"}72%{content:"72%"}73%{content:"73%"}74%{content:"74%"}75%{content:"75%"}76%{content:"76%"}77%{content:"77%"}78%{content:"78%"}79%{content:"79%"}80%{content:"80%"}81%{content:"81%"}82%{content:"82%"}83%{content:"83%"}84%{content:"84%"}85%{content:"85%"}86%{content:"86%"}87%{content:"87%"}88%{content:"88%"}89%{content:"89%"}90%{content:"90%"}91%{content:"91%"}92%{content:"92%"}93%{content:"93%"}94%{content:"94%"}95%{content:"95%"}96%{content:"96%"}97%{content:"97%"}98%{content:"98%"}99%{content:"99%"}100%{content:"100%"}}
@keyframes loading{0%{width:0}100%{width:100%}}
@keyframes textanimation {0% {transform: translateY(2em);}100% {transform: translateY(0);}}

#loader .common_frame{padding:10px 15px}
#loader .bg{width:100%;height:16px;background-color:#000;-webkit-animation:loading 1.5s ease forwards;animation:loading 1.5s ease forwards}
#loader .num{color:#000}
#loader .num:after{content:"0%";display:block;text-align:center;font-size:2rem;color:#000;-webkit-animation:percentage 1.5s ease forwards;animation:percentage 1.5s ease forwards}
#loader .txt{display:flex;overflow:hidden;justify-content:center}
#loader .txt span{display:inline-block;transform:translateY(2em);animation:textanimation 1s forwards;font-size:2.6rem;margin-bottom:1rem}
#loader .txt span:first-child {color:#e60038; animation-delay:.1s}
#loader .txt span:nth-child(2){color:#49b1c9; animation-delay:.2s}
#loader .txt span:nth-child(3){color:#0049ff; animation-delay:.3s}
#loader .txt span:nth-child(4){color:#ffdf00; animation-delay:.4s}
#loader .txt span:nth-child(5){color:#ff5b2b; animation-delay:.5s}
#loader .txt span:nth-child(6){color:#e53e7f; animation-delay:.6s}
#loader .txt span:nth-child(7){color:#a3a3a3; animation-delay:.7s}
#loader .txt span:nth-child(8){color:#000; animation-delay:.8s}
#loader .txt span:nth-child(9){color:#000; animation-delay:.9s}
#loader .txt span:nth-child(10){color:#000; animation-delay:1s}


/* header */
.header{position:relative;width:100%;background:url(/img/header/header_bg.png) left top/810px auto repeat #fff;overflow:hidden;z-index: 10;}
.header_inner{display:flex;justify-content:space-between;align-items:flex-start;width:100%;margin:0 auto;padding:20px 20px 10px;z-index:1;position:relative;max-width:1500px;box-sizing:border-box}
.header_menu{width:auto;transition:.5s}
.header_nav{position:relative;transition:.5s}
.header_nav ul{display:flex;justify-content:flex-end;flex-wrap:wrap;max-width:100%}
.header_nav ul+ul{margin-top:2px}
.header_nav ul li{font-size:1.4rem;font-weight:700;text-align:center}
.header_nav ul li+li{margin-left:1.5em}
.header_nav ul li a{display:block;-ms-background-position:0% 0%;background-position:0 0;-webkit-transition:all .1s ease;transition:all .1s ease}
.header_nav ul li a.nav-top{background:rgba(0,0,0,0) linear-gradient(transparent 50%,#e60038 0) repeat scroll 0 0;-webkit-background-size:97% 200%;background-size:97% 200%}
.header_nav ul li a.nav-news{background:rgba(0,0,0,0) linear-gradient(transparent 50%,#49b1c9 0) repeat scroll 0 0;-webkit-background-size:97% 200%;background-size:97% 200%}
.header_nav ul li a.nav-schedule{background:rgba(0,0,0,0) linear-gradient(transparent 50%,#ffdf00 0) repeat scroll 0 0;-webkit-background-size:97% 200%;background-size:97% 200%}
.header_nav ul li a.nav-profile{background:rgba(0,0,0,0) linear-gradient(transparent 50%,#22ac38 0) repeat scroll 0 0;-webkit-background-size:97% 200%;background-size:97% 200%}
.header_nav ul li a.nav-discography{background:rgba(0,0,0,0) linear-gradient(transparent 50%,#e53e7f 0) repeat scroll 0 0;-webkit-background-size:97% 200%;background-size:97% 200%}
.header_nav ul li a.nav-movie{background:rgba(0,0,0,0) linear-gradient(transparent 50%,#ffdf00 0) repeat scroll 0 0;-webkit-background-size:97% 200%;background-size:97% 200%}
.header_nav ul li a.nav-shop{background:rgba(0,0,0,0) linear-gradient(transparent 50%,#22ac38 0) repeat scroll 0 0;-webkit-background-size:97% 200%;background-size:97% 200%}
.header_nav ul li a.nav-fanclub{background:rgba(0,0,0,0) linear-gradient(transparent 50%,#e60038 0) repeat scroll 0 0;-webkit-background-size:97% 200%;background-size:97% 200%}
.header_nav ul li a.nav-contact{background:rgba(0,0,0,0) linear-gradient(transparent 50%,#49b1c9 0) repeat scroll 0 0;-webkit-background-size:97% 200%;background-size:97% 200%}
.header_nav ul li a:hover,.header_nav ul li.current a{opacity:1;-ms-background-position:0% 50%;background-position:0 50%}
.header .header_sns{margin-top:15px}
.header_sns ul{display:flex;justify-content:flex-end}
.header_sns ul li{width:48px;height:48px}
.header_sns ul li+li{margin-left:10px}
.header_sns ul li img{width:100%;height:auto}
.header,.header_inner,.header_logo,.header_nav,.header_sns{transition:all .3s ease;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease}
.header_logo{width:122px}
.header_nav_toggle{display:none;position:absolute;right:8px;top:-2px;width:54px;height:63px;cursor:pointer;z-index:10;background:url(/img/header/menu.png) center/100% auto no-repeat;transition:.5s;animation:rotate-anime .3s linear}
.open .header_nav_toggle{background:url(/img/header/menu_close.png) center/100% auto no-repeat;animation:rotate-anime-2 .3s linear}

@keyframes rotate-anime {
  0%  {transform: rotateY(0);}
  50%  {transform: rotateY(180deg);}
  100%  {transform: rotateY(0);}
}
@keyframes rotate-anime-2 {
  0%  {transform: rotateY(0);}
  50%  {transform: rotateY(-180deg);}
  100%  {transform: rotateY(0);}
}

.header.fixed{position:fixed;top:0;z-index:10;}
.contents{padding:50px 15px 20px;text-align:left}
.contents p{margin-bottom:1em}
.contents p:last-child{margin-bottom:0}
.footer{padding:90px 20px 50px;overflow:hidden;position:relative;background:url(/img/common/footer_bg_img_01.png) right -3% top 8%/94px auto no-repeat,url(/img/common/footer_bg_img_02.png) left -4% top 28%/79px auto no-repeat #fff}
.footer_inner{text-align:center}
.footer_logo{width:100px;margin:0 auto}
.footer_sns,.footer_copy{margin-top:36px}
.footer_sns{display:flex;justify-content: center}
.footer_sns li{width:58px;height:58px}
.footer_sns li+li{margin-left:5px}
.footer_sns li img{width:100%;height:auto}
.footer_copy{font-size:1.5rem}


.fadein {opacity: 0.1; transform: translate(0, 50px); transition: all 500ms;}
.fadein.scrollin {opacity: 1; transform: translate(0, 0);}

.section {position: relative; overflow: hidden;}
.section_inner {position: relative; width: 1240px; margin: 0 auto;}

@media (min-width: 681px) {
.header.fixed .header_inner{padding:2px 20px 2px;align-items:center}
.header.fixed .header_sns{display:none}
.header.fixed .header_logo{width:100px}
.header_nav {padding-top: 10px;}
.header_nav ul li a{text-shadow:3px 3px 0 #fff,-3px 3px 0 #fff,-3px -3px 0 #fff,3px -3px 0 #fff;padding-bottom: 8px;}
.footer{max-width:680px;margin-right:auto;margin-left:auto;background:url(/img/common/footer_bg_img_01.png) right top 8%/94px auto no-repeat,url(/img/common/footer_bg_img_02.png) left 2% top 28%/79px auto no-repeat}
}


/* PC（1400px以下） */
@media (min-width: 1080px) {
#contents { width:1060px; margin:auto; padding:0; }
}
@media (max-width: 1400px) {
.header_inner {width: 100%; padding-left: 2%; padding-right: 2%; box-sizing: border-box;}
}
@media (max-width: 1300px) {
	.section_inner {width: 100%; padding-left: 2%; padding-right: 2%; box-sizing: border-box;}
}
/* タブレット */
@media (max-width: 1080px) {
.header_inner {padding: 30px 2%;}
.header_nav_line {display: none;}
.header_nav ul li { font-size: 1.5rem;}

.header.fixed .header_logo {margin-bottom: 0;}

#contents { padding-top:60px; }
}

@media(max-width: 1080px) and (min-width: 681px) {
.header .header_logo{width:80px}
.header_nav ul li{font-size:1.2rem}
.header_nav ul li a{letter-spacing:0}
.header.fixed .header_nav ul li+li{margin-left:1.5em}
.header_sns ul li{width:36px;height:36px}
}
/*スマホ*/
@media (max-width: 680px) {
.header{position:relative;overflow:inherit;background:#fff;}
.header_inner,.header_logo{width:100%;padding:0}
.header_inner{align-items:center;height:60px}
.header_logo{height: 100%; margin-bottom:0;box-sizing:border-box;background: url(/img/header/header_bg.png) left top / 405px auto repeat #fff;z-index: 10;}
.header_logo h1{padding:0 5px;z-index:10;position:relative}
.header_logo h1 a{display:inline-block}
.header_logo h1 img{height:57px}
.header_menu{position:absolute;top:60px;width:100%;transform:translateY(-500px);padding:30px 40px 20px;box-sizing:border-box;transition:.5s ease-in-out;background:url(/img/header/header_bg_img_01.png) left top 20%/86px auto no-repeat,url(/img/header/header_bg_img_02.png) right -6% top -3%/105px auto no-repeat,url(/img/header/header_bg_img_03.png) right 3% bottom 30%/84px auto no-repeat,url(/img/header/header_bg_img_04.png) left 3% bottom -7%/96px auto no-repeat #ebebeb;z-index:7;overflow:hidden}
.header_nav{top:0}
.header_nav ul{display:block}
.header_nav ul + ul {margin-top: 10px;}
.header_nav ul li{font-size:1.8rem;line-height:2;}
.header_nav ul li+li{margin-left:0;margin-top: .35em;}
.header_nav ul li.current{border-bottom:1px solid #e7ecef}
.header_sns ul li{width:58px;height:58px}
.header_sns ul li+li{margin-left:5px}
.header_sns ul{justify-content:center}
.header_nav_toggle{display:block}
.open .header_menu{transform:translateY(0)}
.open .header_sns{margin-top:26px}
.footer{padding: 50px 20px 30px;}
.footer_inner{display:block}
.footer_logo{width:80px;}
}