@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");
}

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:#000;
  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:#000; text-decoration:none; }
a:visited	{ color:#000; }
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; }
.en { font-family: 'Hind', sans-serif; }
.bold  { font-weight:bold; }
.big   { font-size:120%; }
.small { font-size:88%; }
.red   { color:#c00; }
.mt10  { margin-top:10px; }
.mt20  { margin-top:20px; }

/* 共通 */
#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_logo {width: 90%;}
.loader_logo img {width: 100%;}
.loader_box{position: relative; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
.loader_line {position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.loader_line div{-webkit-transition:all 0.5s;transition:all 0.5s;width: 100%;height: calc(100% / 7);transform: scaleX(0);}
.loader_line div:nth-child(odd) {transform-origin: left;}
.loader_line div:nth-child(even) {transform-origin: right;}
.active .loader_line div:nth-child(odd) {transform: scaleX(1);}
.active .loader_line div:nth-child(even) {transform: scaleX(1);}
.loader_line1 {background-color: #F8596C;}
.loader_line2 {background-color: #C3F17C;}
.loader_line3 {background-color: #FB8008;}
.loader_line4 {background-color: #FF2720;}
.loader_line5 {background-color: #DDDBD7;}
.loader_line6 {background-color: #FCE800;}
.loader_line7 {background-color: #A04FF6;}

.header {position: relative; width: 100%; background: url(../img/common/bg-line.svg) top center / 50% auto no-repeat #fff;}
.header_inner {display: flex; justify-content: space-between; width: 96%; margin: 0 auto; padding: 60px 0 30px;}
.header_nav {position: relative; margin-bottom: 20px;}
.header_nav ul {display: flex; justify-content: flex-end; flex-wrap: wrap; max-width: 100%;}
.header_nav ul li { font-size: 2rem; font-weight: bold; text-align: center;}
.header_nav ul li + li {margin-left: 1em;}
.header_nav ul li a {display: block;-ms-background-position: 0% 0%;background-position: 0% 0%;-webkit-transition: all 0.1s ease;transition: all 0.1s ease;}
.header_nav ul li a.nav-profile {background: rgba(0, 0, 0, 0) linear-gradient(transparent 50%, #FB8008 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%, #FF2720 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%, #FCE800 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%, #C3F17C 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%, #A04FF6 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%, #F8596C 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%, #DDDBD7 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_nav_line {position: absolute; bottom: 0; height: 2px; background-color:#000; -webkit-transition: all .3s ease; transition: all .3s ease;}
.header_sns ul {display: flex; justify-content: flex-end;}
.header_sns ul li {font-size: 2rem;}
.header_sns ul li + li {margin-left: 1em;}
.header, .header_inner, .header_logo, .header_nav, .header_sns {transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease;}
.header_logo {width: 400px;}

.header_nav_toggle {display: none; position: absolute; right: 10px; top: 13px; width: 34px; height: 36px; cursor: pointer; z-index: 10;}
.header_nav_toggle div {position: relative;}
.header_nav_toggle span {display: block; position: absolute; height: 3px; width: 100%; background: #1e2971; left: 0; -webkit-transition: .35s ease-in-out; -moz-transition: .35s ease-in-out; transition: .35s ease-in-out;}
.header_nav_toggle span:nth-child(1) {top: 0;}
.header_nav_toggle span:nth-child(2) {top: 11px;}
.header_nav_toggle span:nth-child(3) {top: 22px;}

.header.fixed {position: fixed; top: 0; z-index: 10;background: #fff;}
.header.fixed .header_inner {width: 96%; padding: 20px 0;}
.header.fixed .header_logo {width: 13%;}
.header.fixed .header_nav {margin-bottom: 0;}
.header.fixed .header_sns {display: none;}

.contents { padding:50px 20px 20px; text-align:left; }
.contents p { margin-bottom:1em; }
.contents p:last-child { margin-bottom:0; }

.footer {padding: 40px; letter-spacing: 0.09em;background: url(../img/common/bg-line.svg) bottom center / 50% auto no-repeat;}
.footer_inner {text-align: center;padding-bottom: 50px;}
.footer_logo {width: 100px;margin: 0 auto}
.footer_sns {display: flex; align-items: center;justify-content: center;margin: 30px 0}
.footer_sns dt {font-size: 1.8rem;}
.footer_sns dt i {margin-right: 0.5em;}
.footer_sns dt:after {content: ":"; display: inline-block; margin: 0 1.5em;}
.footer_sns dd {line-height: 1;}
.footer_sns dd img {height: 24px; width: auto;}
.footer_sns dd + dd {margin-left: 1em;}
.footer_sns dd a {display: block; font-size: 1.8rem;}
.footer_copy {font-size: 1.4rem;}

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

.bg_line {position: absolute; width: 100%; height: 100%; top: 0; left: 0; padding-left: 20%; z-index: 0; box-sizing: border-box;}
.bg_line ul {position: relative; width: 100%; height: 100%; border-left: 1px solid #e7ecef; overflow: hidden;}
.bg_line ul li {position: relative; float: left; box-sizing: border-box; height: 100%; width: 25%; border-right: 1px solid #e7ecef;}

.section {position: relative; overflow: hidden;}
.section-wt {position: relative; z-index: 1;}
.section-wt:before {content: ""; position: absolute; top: -100%; right: 0; width: 80%; height: 100%; background-color: #fff; -webkit-transition:	all 1s ease; transition:		all 1s ease;}
.section-wt.scrollbg:before {top: 0;}
.section_inner {position: relative; width: 1240px; margin: 0 auto;}


/* 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;}
  .header_logo {width: 26%;}

  .header.fixed .header_inner {width: 100%; padding-left: 2%; padding-right: 2%;}
}
@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_logo {margin-bottom: 20px;}
  .header_nav_line {display: none;}
  .header_nav ul li {font-size: 1.6rem;}

  .header.fixed .header_inner {align-items: center;}
  .header.fixed .header_logo {margin-bottom: 0;}

  #contents { padding-top:60px; }
}
@media (max-width: 800px) {
  .loader_logo img { max-width:70%;}

  .header_nav ul li { font-size: 1.5rem;}
  .header.fixed .header_nav ul li + li {margin-left: 0.25em;}
}
/*スマホ*/
@media (max-width: 680px) {
  .header {background: #fff}
  .header_logo,
  .header_inner {width: 100%; padding: 5px 0;}
  .header_logo {margin-bottom: 0; box-sizing: border-box;}
  .header_logo h1 {padding: 0 10px;}
  .header_logo h1 a {display: block;}
  .header_logo h1 img {height: 30px;}
  .header_menu {position: absolute; top: -500px; width: 100%; text-align: center; padding: 10px 0; -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; transition: .5s ease-in-out; background-color: #fff; z-index: 9;}
  .header_nav ul {display: block;}
  .header_nav ul li {font-size: 2rem; line-height: 2; border-bottom: 1px solid #e7ecef;}
  .header_nav ul li + li {margin-left: 0;}
  .header_nav ul li.current {border-bottom: 1px solid #e7ecef;}
  .header_sns ul {justify-content: center;}
  .header_nav_toggle {display: block;}
  .open .header_nav_toggle span {background-color: #d51542;}
  .open .header_nav_toggle span:nth-child(1) {top: 11px; -webkit-transform: rotate(315deg); -moz-transform: rotate(315deg); transform: rotate(315deg);}
  .open .header_nav_toggle span:nth-child(2) {width: 0; left: 50%;}
  .open .header_nav_toggle span:nth-child(3) {top: 11px; -webkit-transform: rotate(-315deg); -moz-transform: rotate(-315deg); transform: rotate(-315deg);}
  .open .header_menu {-moz-transform: translateY(548px); -webkit-transform: translateY(548px); transform: translateY(548px);}

  .header.fixed .header_inner {padding: 5px 0;}
  .header.fixed .header_logo {width: 100%;}
  .header.fixed .header_sns {display: block;}

  .footer {padding: 10px;}
  .footer_inner {display: block;}
  .footer_sns dt:after {margin: 0 0.5em;}
  .footer_sns dd {margin-bottom: 10px;}
  .footer_sns dd + dd {margin-left: 0.5em;}
}