@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Acme&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@700&display=swap');

/*====================================
/*
/* BASE
/*
/*===================================*/
html{
height: 100%;/*-- フッターを最下部に固定するための指定 --*/
font-size: 62.5%; /*-- ベースのフォントサイズを10pxに指定 各要素のフォントサイズ指定はremで --*/
}

body{
font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI","Noto Sans Japanese","ヒラギノ角ゴ ProN W3", Meiryo, sans-serif;/*-- ヒラギノ・メイリオ系 --*/
color: #2D334A;
font-size: 1.4em;
-webkit-text-size-adjust: 100%;/*-- iOSのSafariで意図せずフォントサイズが大きくなるのを防ぐ --*/
min-height: 100vh; /*-- フッターを最下部に固定するための指定 --*/
display: flex; /*-- フッターを最下部に固定するための指定 --*/
flex-direction: column; /*-- フッターを最下部に固定するための指定 --*/
width: 100%;
height: 100vh;
background: #FFFFFE;
animation: fadeIn 3s ease 0s 1 normal;
-webkit-animation: fadeIn 3s ease 0s 1 normal;
}

@keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}

.contents {
flex: 1; /*-- フッターを最下部に固定するための指定 --*/
}

/*====================================:
/*
/* COMMON
/*
/*===================================*/

/*-- 画像のマウスイベントを無効に --*/
img {
pointer-events: none;
}

/*====================================
 テキストリンク
====================================*/
a {
text-decoration: none;
color: #272343;
}

a:link,
a:visited {
text-decoration: none;
color: #272343;
}

a:hover,
a:active {
text-decoration: underline;
color: #272343;
}

/*====================================
 ページトップへ戻る
====================================*/
.gotop {
position: fixed;
bottom: 1em; right: 1em;
z-index: 3;
}

.gotop a {
border: solid 4px rgb(203,206,208,.8);
border-radius: 50%;
width: 60px;
height: 60px;
display: block;
transition: .5s ease;
}

.gotop a span::before {
content: "";
display: block;
width: 30%;
height: 30%;
border-left: 4px solid rgb(203,206,208,.8);
border-top: 4px solid rgb(203,206,208,.8);
border-radius: 10%;
transform: translate(-50%, 0) rotate(45deg);
position: absolute;
top: 38%; left: 50%;
}

.gotop a:link,
.gotop a:visited {
}

.gotop a:hover,
.gotop a:active {
opacity: .6;
}

/*====================================
/*
/* FOOTER
/*
/*===================================*/
footer {
width: 100%;
/*background: #E3F6F5;*/
background: #16161a;
color: #FFFFFE;
}

footer .inner {
width: 96%;
margin: 0 auto;
padding: 3em 0 2em;
}

footer .inner a {
text-decoration: none;
color: #FFFFFE;
}

footer .inner a:link,
footer .inner a:visited {
text-decoration: none;
color: #FFFFFE;
}

footer .inner a:hover,
footer .inner a:active {
text-decoration: underline;
color: #FFFFFE;
}
/*----------------------
 アーカイブリンク
----------------------*/
.ft_link_list {
font-family: 'Acme', sans-serif;
margin: .6em 0 0;
line-height: 1.4em;
}

.ft_link_list .item {
display: inline-block;
}

.ft_link_list .item::after {
content: "・";
}

.ft_link_list .item:last-child::after {
content: "";
}

/*----------------------
 フッターインフォ
----------------------*/
.ft_info {
font-size: 1.1rem;
line-height: 1.8em;
margin: 3em 0 0;
}

.ft_info .term {
display: inline-block;
}

.ft_info .term::after {
content: "：";
}

.ft_info .desc {
display: inline-block;
}

/*----------------------
 コピーライト
----------------------*/
.credit {
font-size: 1.0rem;
line-height: 1.4em;
margin: 4em 0 0;
text-align: center;
}

/*----------------------
 SNS
----------------------*/
.sns_info {
background: #e9ecef;
text-align: center;
padding: 2em 0;
}

.sns_list {
display: flex;
justify-content: center;
gap: 1em;
}

.sns_list .item {
width: 2em;
height: 2em;
line-height: 2em;
border-radius: 50%;
background: #2D334A;
font-size: 2.6rem;
transition: .5s ease;
}

.sns_list .item i {
color: #FFF;
}

.sns_list .item:hover {
opacity: .6;
cursor: pointer;
}

/*====================================
/*
/* HEADER
/*
/*===================================*/
header {
width: 100%;
background: #FFFFFE;
text-align: center;
position: fixed;
z-index: 9999;
}

header .inner {
width: 96%;
height: 6em;
margin: 0 auto;
display: flex;
align-items: center;
position: relative;
}

header h1 {
width: 16em;
height: auto;
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%, -50%);
}

header h1 img {
width: 100%;
}

/*----------------------
 ナビゲーション
----------------------*/
nav {
font-family: 'Poppins', sans-serif;
display: block;
position: fixed;
top: -100vh; left: 0; bottom: 0;
width: 100%;
height: 100vh;
background: rgba(255, 255, 255, 1);
overflow-x: hidden;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
transition: all .5s ease;
padding-top: 6em;
text-align: center;
z-index: 8888;
}

nav.open  {
top: 0;
}

nav .main_menu {
line-height: 0;
}

nav .main_menu > .item {
width: 100%;
height: 3em;
line-height: 3em;
white-space: nowrap;
font-size: 1.6rem;
cursor: pointer;
}

nav .main_menu > .item a {
width: 100%;
height: 100%;
color: #272343;
display: block;
text-decoration: none;
}

nav .main_menu > .item a:link,
nav .main_menu > .item a:visited {
color: #272343;
text-decoration: none;
}

nav .main_menu > .item a:hover,
nav .main_menu > .item a:active {
color: #272343;
background: #F2F4F6;
text-decoration: none;
}

/* ドロップダウンメニューのスタイル */
nav .sub_menu {
background: #FFF;
border-radius: .8em;
}

nav .sub_menu {
line-height: 1;
}

nav .sub_menu > li > a {
padding: 1em 0 1em 1em;
}

nav .sub_menu > li  {
position: relative;
}

/* ドロップダウンメニューの矢印アイコン */
nav .dropdown {
position: relative;
}

nav .dropdown.pc::before {
content: "";
display: block;
width: .4em;
height: .4em;
border-top: .15em solid #000;
border-left: .15em solid #000;
position: absolute;
top: 40%;
right: 2em;
transform: rotate(-135deg);
transition: transform .5s;
}

nav .dropdown.pc.active::before {
transform: rotate(45deg);
transition: transform .5s;
}
/*-- disable --*/
nav ul li.disable {
pointer-events: none;
opacity: .3;
}


/*----------------------
 toggle_btn
----------------------*/
.toggle_btn {
display: block;
position: absolute;
top: auto; right: 0;
width: 30px;
height: 30px;
text-indent: -9999px;
cursor: pointer;
transition: all .5s;
}

.toggle_btn span {
display: block;
position: absolute;
background: #000;
left: 4px;
width: 22px;
height: 2px;
transition: all .5s;
}

.toggle_btn span:nth-child(1) {
top: 6px;
}

.toggle_btn span:nth-child(2) {
top: 14px;
}

.toggle_btn span:nth-child(3) {
top: 22px;
}

.toggle_btn.open  {
}

.toggle_btn.open span {
}

.toggle_btn.open  span:nth-child(1) {
transform: translate(0, 8px) rotate(-45deg);
}

.toggle_btn.open span:nth-child(2) {
opacity: 0;
transform: translate(0, 20px);
transition: all .4s ease-out;
}

.toggle_btn.open span:nth-child(3) {
transform: translate(0, -8px) rotate(45deg);
}


/*====================================
/*
/* CONTENTS
/*
/*===================================*/
.contents {
width: 100%;
text-align: center;
/*background: #FFFFFE;*/
}

.contents.lower {
padding: 6em 0;
background: #FFFFFE;
}

/*====================================
/*
/* TOP PAGE
/*
/*===================================*/

/*====================================
 背景動画
====================================*/
#bg_video{
position: fixed;
width: 100vw;
height: 100vh;
z-index: -1;
top: 0;
right:0;
left:0;
bottom:0;
overflow: hidden;
}

#video {
position: absolute;
z-index: -1;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 178vh;
height: auto;
min-height: 100%;
min-width: 100%;
}


/*====================================
 HERO
====================================*/
.hero {
width: 100%;
margin: 6em 0 0;
height: 100vh;
color: #FFF;
position: relative;
}

.hero > .inner {
width: 96%;
margin: 0 auto 0;
}

.hero_content {
width: 80%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-80%);
}

.hero_img {
width: 100%;
margin: 0 auto 0;
}

.hero_txt {
font-size: 1.8rem;
line-height: 1.3em;
font-weight: bold;
margin: 1.5em 0 0;
letter-spacing: -.02em;
}

.hero_info {
margin: 4em 0 0;
}

.hero_info .date {
font-family: 'Poppins', sans-serif;
font-size: 2.6rem;
font-weight: bold;
line-height: 1.1em;
margin: 1em 0 0;
}

.hero_info .date span {
font-size: 1.4rem;
}

.hero_info .site {
font-size: 2.0rem;
font-weight: bold;
margin: .6em 0 0;
}

/*----------------------
 公演終了後
----------------------*/
.hero_content_after {
width: 65%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-75%);
}

.hero_content_after .hero_img {
margin: 2em auto 0;
}


.hero_content_after .hero_img.pc {
display: none;
}

.hero_content_after .hero_img.sp {
display: block;
}

.hero_content_after .hero_img img {
width: 100%;
}

.hero_content_after p {
font-family: 'PT Sans', sans-serif;
font-size: 2.2rem;
line-height: 1em;
}

.hero_content_after p.prefecture {
font-size: 2.6rem;
margin: 1em auto 0;
}

.hero_content_after p span {
display: inline-block;
}

/*====================================
 ARTICLE COMMON
====================================*/
.article {
width: 100%;
}

.article > .inner {
width: 96%;
margin: 0 auto 0;
padding: 8em 0;
}

.article.bg_wh {
background: #FFFFFE;
}

.article.bg_gry {
background: #f4f7f9;
}

.article.bg_tp {
background: rgba(0,0,0,.6);
}

.contents.lower .article > .inner {
padding: 4em 0 0;
}

.article .lead {
width: 90%;
line-height: 1.6em;
margin: 3em auto 0;
text-align: left;
}

/*----------------------
 後日詳細発表
----------------------*/
.tba_box {
width: 70%;
max-width: 22em;
margin: 4em auto 0;
}

.mssg img {
width: 70%;
max-width: 22em;
}

.mssg_01 {
transform: rotate(-18deg);
}

.mssg_02 {
transform: rotate(18deg);
}

/*.mssg {
position: relative;
margin: 0 auto 0;
padding: .5em;
width: 10em;
height: 10em;
border: .3em double #dadee4;
border-radius: 50%;
color: #dadee4;
text-align: center;
font-size: 2.2rem;
font-family: 'Poppins', sans-serif;
letter-spacing: -.02em;
line-height: 8.5em;
}

.mssg::before{
position: absolute;
top: 3em;
padding: 0 0 .8em;
display: block;
width: 90%;
border-bottom:.05em solid #dadee4;
content: 'Slipstream presents';
font-size: 1.1rem;
line-height: 1;
}

.mssg::after{
position: absolute;
bottom: 16%;
display: block;
padding: .8em 0 0;
width: 90%;
border-top: .05em solid #dadee4;
content: 'KITASAN ROLLING';
font-size: 1.2rem;
line-height: 1;
}*/

/*----------------------
 見出し
----------------------*/
.headline {
font-family: 'Poppins', sans-serif;
font-size: 3.2rem;
}

.article.bg_tp .headline {
color: #FFF;
}

.hd_lineup_sub span {
font-size: 1.8rem;
margin-left: .2em;
}
/*====================================
 NEWS
====================================*/
.news {
padding: 4em 0;
}

.news > .inner {
width: 90%;
margin: 0 auto 0;
position: relative;
}

.news > .inner > .headline {
font-size: 1.8rem;
position: absolute;
color: #FFF;
left: -.3em;
top: 50%;
transform: translate(0,-50%) rotate(270deg);
}

.link_more {
position: absolute;
bottom: .6em; right: 1.6em;
}

.link_more a {
font-family: 'Poppins', sans-serif;
position: relative;
font-size: 1.4rem;
}

.link_more a::after {
content: '';
display: block;
width: .3em;
height: .3em;
border-top: .15em solid #272343;
border-left: .15em solid #272343;
transform: translate(0,-50%) rotate(135deg);
position: absolute;
top: 50%; right: -.6em;
transition: all .2s ease;
}

.link_more a,
.link_more a:link,
.link_more a:visited {
color: #272343;
}

.link_more a:hover,
.link_more a:active {
color: #272343;
opacity: .6;
text-decoration: none;
}


.link_more a:hover::after,
.link_more a:active::after {
top: 50%; right: -.8em;
}

.news_list {
padding: 1em 2em 2em;
text-align: left;
line-height: 1.6em;
border-top: solid .2em #272343;
border-right: solid .2em #272343;
border-bottom: solid .2em #272343;
border-left: solid 3em #272343;
border-radius: .8em;
background: #FFFFFE;
display: flex;
flex-wrap: wrap;
flex-direction: column;
}

.news_list .term {
width: 100%;
margin: 1em 0 0;
}

.news_list .desc {
width: 100%;
margin: .2em 0 0;
}

/*====================================
 ABOUT
====================================*/
.lead_txt {
font-size: 2.4rem;
line-height: 1.3em;
font-weight: bold;
margin: 1.5em 0 0;
}

.sub_txt {
font-size: 1.2rem;
font-weight: bold;
line-height: 1.6em;
text-align: center;
}

.sub_txt span {
display: inline-block;
}

.sub_txt + .sub_txt {
margin: .8em 0 0;
}

.about_info {
margin: 3em 0 0;
}

.about_info .event_name {
font-family: 'Poppins', sans-serif;
font-size: 2.4rem;
font-weight: bold;
letter-spacing: -.04em;
line-height: 1.1em;
}

.about_info .event_name > span {
display: block;
font-size: 1.2rem;
letter-spacing: 0em;
}

.about_info .date {
font-family: 'Poppins', sans-serif;
font-size: 2.0rem;
font-weight: bold;
line-height: 1.1em;
margin: 1em 0 0;
}

.about_info .date span {
font-size: 1.2rem;
}

.about_info .time {
font-size: 1.6rem;
font-weight: bold;
line-height: 1.2em;
margin: .5em 0 0;
}

.about_info .site {
font-size: 1.6rem;
font-weight: bold;
line-height: 1.1em;
margin: 1em 0 0;
}

/*====================================
 LINE UP
====================================*/
.hd_lineup_sub {
font-family: 'Poppins', sans-serif;
font-size: 2.0rem;
color: #FFF;
margin: 3em 0 0;
}

.artist_box {
width: 86%;
margin: 2em auto 0;
display: flex;
flex-wrap: wrap;
gap: 3em 1em;
}

.artist_item {
width: calc(50% - .5em);
}

.artist_item a {
display: block;
width: 100%;
height: 100%;
cursor: pointer;
}

.artist_img {
position: relative;
overflow: hidden;
padding-top: 65%;
background: #000;
box-shadow: -.5em .5em 0 0 rgba(255, 255, 255, .2);
}


.artist_img img {
width: 100%;
height: auto;
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%, -50%);
transition: transform .6s ease;
}

/*.artist_img.kotori,
.artist_img.shishamo {
background: #FFF;
}*/

.artist_img.shishamo img {
width: auto;
height: 100%;
}

.artist_img.kotori img {
width: 64%;
height: auto;
}

.artist_name {
line-height: 1.4em;
margin: 1em 0 0;
font-weight: bold;
color: #FFF;
}

.artist_item a:link,
.artist_item a:visited {
text-decoration: none;
}

.artist_item a:hover,
.artist_item a:active {
opacity: .6;
text-decoration: none;
}

.artist_item a:hover .artist_img img,
.artist_item a:active .artist_img img {
transform: translate(-50%, -50%) scale(1.1);
}

.txt_more {
font-size: 2.0rem;
color: #FFF;
margin: 1.8em 0 0;
}

/*====================================
 TICKETS
====================================*/
.ticket_info {
width: 80%;
margin: 2em auto 0;
display: flex;
justify-content: center;
flex-wrap: wrap;
}

.hd_ticket_sub {
width: 100%;
font-weight: bold;
font-size: 2.0rem;
margin: 1em 0 .5em;
}

.ticket_info .hd_ticket_sub02 {
width: 100%;
font-weight: bold;
line-height: 1.4em;
margin: 0 0 .5em;
}

.ticket_info p span {
display: inline-block;
}

.ticket_info dl {
width: 100%;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 0 2em;
padding: 2em 0;
border-bottom: solid .1em #666;
font-weight: bold;
}

.ticket_info .hd_ticket_sub + dl,
.ticket_info .hd_ticket_sub02 + dl {
border-top: solid .1em #666;
}

.ticket_info dl dt {
font-size: 1.4rem;
}

.ticket_info dl dt span {
margin: .2em 0 0;
display: block;
}

.ticket_info dl dd {
font-size: 2.8rem;
position: relative;
}

.ticket_info dl dd.sold::before {
font-family: 'Poppins', sans-serif;
font-size: 1.6rem;
font-weight: bold;
white-space: nowrap;
color: rgba( 255, 255, 255, 1);
background: rgba( 205, 34, 100, .8);
display: inline-block;
padding: .4em 2em;
position: absolute;
top: 0; left: 50%;
transform: translateX(-50%) rotate(-12deg);
z-index: 1;
content: "SOLD OUT";
}

.ticket_info dl dd.option {
font-size: 1.8rem;
width: 100%;
text-align: center;
margin: 1em 0 0;
}

.ticket_info dl dd.option span.sold {
font-family: 'Poppins', sans-serif;
font-size: 1.6rem;
font-weight: bold;
white-space: nowrap;
color: rgba( 255, 255, 255, 1);
background: rgba( 205, 34, 100, .8);
display: inline-block;
padding: .2em 1em;
margin-left: .5em;
}

.ticket_info dl dd.option span.kana {
font-size: 1.4rem;
margin-left: .1em;
}

.ticket_atte {
width: 100%;
text-indent: -1em;
padding-left: 1em;
margin: 3em auto 0;
line-height: 1.4em;
text-align: left;
}

.ticket_atte::before {
content: "※ ";
}

.ticket_info ul {
width: 100%;
text-align: left;
margin: 2em 0 0;
}

.ticket_info ul li {
line-height: 1.4em;
margin: .5em 0 0;
}


.ticket_info ul li.atte {
padding-left: 1em;
text-indent: -.8em;
}

.ticket_info ul li.atte::before {
content: "※";
margin-right: .2em;
}

/*----------------
チケット情報　注意事項
----------------*/
.ticket_info_notice {
width: 100%;
text-align: left;
}

.ticket_info_notice .ttl01,
.ticket_info_notice .ttl02 {
margin: 1.5em 0 0;
font-weight: bold;
}

.ticket_info_notice .ttl01 {
padding-left: 1em;
text-indent: -1em;
line-height: 1.3em;
}

.ticket_info_notice .ttl01::before {
content: "※";
margin-right: .1em;
}

.ticket_info_notice ul {
margin: .5em 0 0;
}

.ticket_info_notice ul li {
margin: .1em 0 0;
}

.ticket_info_notice .bold {
font-weight: bold;
margin: 1em 0 0;
line-height: 1.3em;
}

/*----------------
座席図
----------------*/
.seating_chart {
width: 80%;
margin: 2em auto 0;
}

.seating_chart img {
width: 100%;
height: auto;
}

/*----------------
チケット販売情報
----------------*/
.sales_info {
width: 90%;
margin: 3em auto 0;
}

.sales_info > .item dl dt {
font-size: 2.2rem;
font-weight: bold;
line-height: 1.2em;
}

.sales_info > .item dl dt span {
display: inline-block;
}

.sales_info > .item dl dd {
font-size: 1.8rem;
margin: .5em 0 0;
}

.sales_info .btn {
position: relative;
}

.sales_info .btn.soon::before,
.sales_info .btn.sold::before {
font-family: 'Poppins', sans-serif;
font-size: 1.8rem;
font-weight: bold;
white-space: nowrap;
color: rgba( 236, 105, 26, .6);
border: solid .2em rgba(236,105,26, .6);
display: inline-block;
padding: .8em 2em;
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%,-30%) rotate(-16deg);
z-index: 1;
}

.sales_info .btn.soon::before {
content: "on sale soon";
}

.sales_info .btn.sold::before {
content: "sold out";
}

.sales_info .btn a {
display: inline-block;
margin: 2em 0 0;
padding: 1em 2em;
background: #2D3349;
font-size: 1.6rem;
color: #FFF;
text-decoration: none;
border-radius: 100vh;
}

.sales_info .btn a:link,
.sales_info .btn a:visited {
color: #FFF;
text-decoration: none;
}

.sales_info .btn a:hover,
.sales_info .btn a:active {
color: #FFF;
text-decoration: none;
opacity: .8;
}

.sales_info .btn.soon a,
.sales_info .btn.sold a {
pointer-events: none;
opacity: .2;
}

.sales_info .btn_set {
display: flex;
flex-direction: column;
justify-content: center;
gap: 0 1em;
}

.sales_info .btn_set .btn a {
width: 11em;
margin: 1em 0 0;
white-space: nowrap;
}

.cashback_info {
width: 90%;
max-width: 640px;
margin: 3em auto 0;
padding: 2.4em;
border: .1em solid #E9ECEF;
background: rgba(255,255,255,.9);
box-shadow: -.5em .5em 0 0 rgba(225, 225, 225, .2);
}

.cashback_info h4 {
font-size: 1.8rem;
line-height: 1.4em;
}

.cashback_info h4 span {
display: inline-block;
}

.cashback_info dl,
.cashback_info ul {
text-align: left;
}

.cashback_info dl {
margin: 2em 0 0;
font-size: 1.6rem;
line-height: 1.4em;
}

.cashback_info dl dd {
margin: .2em 0 0;
}

.cashback_info ul {
margin: 2em 0 0;
}

.cashback_info ul li {
padding-left: 1em;
text-indent: -.8em;
line-height: 1.3em;
margin: .5em 0 0;
}

.cashback_info ul li::before {
content: "※";
margin-right: .2em;
}

/*====================================
 TIME TABLE
====================================*/
.tt_img {
display: flex;
flex-direction: column;
gap: 2em 0;
width: 90%;
margin: 2em auto 0;

}

.tt_img img {
width: 100%;
height: auto;
}

.tt_atte {
width: 90%;
text-align: left;
position: relative;
padding-left: 1em;
margin: 1em auto 0;
line-height: 1.3em;
}

.tt_atte::before {
content: "※";
position: absolute;
top: 0;
left: 0;
}

.news_article .tt_img {
width: 100%;
margin: 1em auto 0;
}

.news_article .tt_atte {
width: 100%;
}

/*====================================
 GOODS
====================================*/
#goods .lead {
margin: 2em auto 0;
padding: 0;
text-align: center;
font-size: 1.6rem;
line-height: 1.4em;
}

#goods .goods_img {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 1em 0 0;
gap: .8em 0;
}

#goods .goods_img dl {
width: calc(50% - .4em);
text-align: center;
border: solid .1rem #666;
padding: 1em;
}

#goods .goods_img dl dt img {
width: 100%;
}

#goods .goods_img dl dd {
font-size: 1.2rem;
line-height: 1.2em;
}

#goods .goods_img dl dd span {
display: block;
}

#goods > ul {
text-align: left;
margin: 2em 0 0;
}

#goods > ul > li {
position: relative;
padding-left: 1em;
margin: .5em 0 0;
}

#goods > ul > li::before {
content: "";
display: block;
width: .6em;
height: .6em;
background: #000;
position: absolute;
top: .2em; left: 0;
border-radius: .2em;
}


/*====================================
 協賛ロゴ
====================================*/
.sponsorship_01 {
font-size: 2.4rem;
}

.sponsorship_02 {
font-size: 2.0rem;
margin: 4rem 0 0;
}

.sponsorship_03 {
font-size: 1.8rem;
margin: 4rem 0 0;
}

.sponsorship_list_01,
.sponsorship_list_02,
.sponsorship_list_03 {
width: 90%;
margin: 1.5rem auto 0;
display: flex;
flex-direction: column;
flex-wrap: wrap;
gap: .5em 0;
justify-content: center;
align-items: center;
}

.sponsorship_list_01 .item {
font-size: 2.2rem;
}

.sponsorship_list_02 .item {
font-size: 1.75rem;
}

.sponsorship_list_03 .item {
font-size: 1.6rem;
}

/*====================================
 AREA MAP
====================================*/
.area_map {
width: 100%;
margin: 3em auto;
}

.area_map img {
width: 100%;
height: auto;
}

/*====================================
 MARKET
====================================*/
.market_logo {
width: 80%;
max-width: 480px;
margin: 3em auto 0;
}

.market_logo img {
width: 100%;
height: auto;
}

.market_map {
width: 90%;
margin: 2em auto;
}

.market_map img {
width: 100%;
height: auto;
}

.btn.market {
position: relative;
}

.btn.market a i {
display: inline-block;
margin-right: .5em;
}

.btn.market a {
display: inline-block;
margin: 2em 0 0;
padding: .5em 2em;
background: #2D3349;
font-size: 1.6rem;
color: #FFF;
text-decoration: none;
border-radius: 10em;
}

.btn.market a:link,
.btn.market a:visited {
color: #FFF;
text-decoration: none;
}

.btn.market a:hover,
.btn.market a:active {
color: #FFF;
text-decoration: none;
opacity: .8;
}

.market_article h4 {
font-size: 1.8rem;
font-weight: bold;
margin: 3em 0 0;
}

.market_article h4 + p.lead {
margin: 1em auto 0;
}

#market_shops {
display: flex;
justify-content: start;
flex-wrap: wrap;
gap: .5em;
}

.shop {
width: calc(50% - .25em);
padding: .8em;
border: solid .08rem #666;
position: relative;
}

.shop_name {
display: flex;
align-items: center;
text-align: left;
font-weight: bold;
height: 2.6em;
gap: 0 .5em;
}

.shop_name .num {
font-size: 1.1rem;
font-weight: bold;
background: #000;
color: #FFF;
width: 2.4em;
height: 3.4em;
line-height: 3.4em;
text-align: center;
}

.shop_name .name {
font-size: 1.2rem;
flex: 1;
}

.shop_img {
margin: .2em 0 0;
}

.shop_img img {
width: 100%;
height: auto;
}

.shop_menu {
font-size: 1.2rem;
line-height: 1.4em;
margin: .5em 0 0;
}


/*====================================
 ACCESS
====================================*/
.map.top {
margin: 4em auto 0;
width: 70%;
}

.map.top iframe {
width: 100%;
aspect-ratio: 16/9;
}

.btn_access_dtl a {
display: inline-block;
margin: 1em 0 0;
padding: .5em 2em;
background: #2D3349;
font-size: 1.4rem;
color: #FFF;
text-decoration: none;
border-radius: 10em;
}

.btn_access_dtl a,
.btn_access_dtl a:link,
.btn_access_dtl a:visited,
.btn_access_dtl a:hover,
.btn_access_dtl a:active {
text-decoration: none;
color: #FFF;
}

.btn_access_dtl a:hover,
.btn_access_dtl a:active {
opacity: .8;
}


/*====================================
/*
/* CONTENTS LOWER 共通
/*
/*===================================*/
.contents.lower a.txt_link,
.contents.lower a.txt_link:link,
.contents.lower a.txt_link:visited {
color: #E8446D;
text-decoration: underline;
transition: all .2s ease;
}

.contents.lower a.txt_link:hover,
.contents.lower a.txt_link:active {
color: #E8446D;
text-decoration: none;
opacity: .6;
}
/*====================================
/*
/* ACCESS
/*
/*===================================*/
.map {
margin: 4em auto 0;
width: 80%;
}

.map iframe {
width: 100%;
aspect-ratio: 16/9;
}

.map_02 {
margin: 1em auto 0;
width: 100%;
max-width: 640px;
}

.map_02 iframe {
width: 100%;
aspect-ratio: 4/3;
}

.place {
margin: 1em 0 0;
}

.place > .ttl {
font-size: 2.0rem;
font-weight: bold;
line-height: 1.3em;
}

.place > .address {
line-height: 1.3em;
}

.transportation {
display: flex;
flex-warp: wrap;
flex-direction: column;
margin: 1em auto 0;
width: 80%;
text-align: left;
gap: 1em 4em;
}

.transportation > .item {
width: 100%;
}

.transportation > .ttl {
width: 100%;
font-weight: bold;
font-size: 1.8rem;
margin: 2em 0 0;
}

.transportation > .item dt {
font-weight: bold;
font-size: 1.6rem;
}

.transportation > .item dd {
margin: .5em 0 0;
line-height: 1.6em;
font-weight: bold;
}

.transportation > .item dd ul li {
font-size: 1.4rem;
font-weight: normal;
line-height: 1.3em;
margin: .5em 0 0;
text-indent: -1em;
padding-left: 1em;
}

.transportation > .item dd ul li::before {
content: "・";
}

.transportation_notice {
width: 100%;
padding: 1.5em;
border: solid .1rem #666;
line-height: 1.4em;
font-weight: bold;
}

.transportation_notice p + p {
margin: 1em 0 0;
}

.by_car {
width: 100%;
line-height: 1.6em;
font-size: 1.6rem;
font-weight: bold;
}

.access_atte {
line-height: 1.4em;
}

.access_atte li {
text-indent: -1em;
padding-left: 1em;
margin: .5em 0 0;
}

.access_atte li::before {
content: "※";
margin-right: .3em;
}


/*====================================
/*
/* NOTICE
/*
/*===================================*/
.notice_list {
margin: 4em auto 0;
width: 80%;
text-align: left;
font-size: 1.6rem;
line-height: 1.4em;
}

.notice_list .item {
margin: 1.5em 0 0;
position: relative;
padding-left: 1em;
}

.notice_list .item::before {
content: "";
display: block;
background: #000;
width: .4em;
height: .4em;
border-radius: 50%;
position: absolute;
top: .5em; left: 0;
}

/*====================================
 Q&A
====================================*/
.qa_contents {
margin: 6em auto 0;
width: 80%;
}

.qa_contents a {
display: inline-block;
margin: 0 .2em;
}

.qa_contents a,
.qa_contents a:link,
.qa_contents a:visited {
color: #E8446D;
text-decoration: underline;
transition: all .2s ease;
}

.qa_contents a:hover,
.qa_contents a:active {
color: #E8446D;
text-decoration: none;
opacity: .6;
}

.qa_contents dl {
text-align: left;
border-bottom: solid #E9ECEF 1px;
padding: 1.5em 1em 1.3em;
}

.qa_contents .headline + dl {
border-top: solid #E9ECEF 1px;
margin: 2em 0 0;
}

.qa_contents dt,
.qa_contents dd {
font-size: 1.4rem;
line-height: 1.4em;
position: relative;
margin: 0;
padding: 0 0 0 2.8em;
}

.qa_contents dd {
margin: 1em  0 0;
}

.qa_contents dd span {
}

.qa_contents dt::before,
.qa_contents dd::before {
font-family: 'Poppins', sans-serif;
display: inline-block;
position: absolute;
font-size: 2.8rem;
top: -.1em; left: 0;
}

.qa_contents dt::before {
/*border: .16em solid #016FBA;*/
color: #016FBA;
content: 'Q.';
}

.qa_contents dd::before {
/*border: .16em solid #E8446D;*/
color: #E8446D;
content: 'A.';
}


@media screen and (min-width: 721px) {
/*-- min-width: 721px //--*/

#market_shops {
width: 90%;
margin: 0 auto;
gap: 1em;
}

.shop {
width: calc(33.33% - .67em);
padding: .8em;
border: solid .08rem #666;
position: relative;
}

.shop_name {
display: flex;
align-items: center;
text-align: left;
font-weight: bold;
height: 2.6em;
gap: 0 .5em;
}

.shop_name .num {
width: 2.6em;
height: 2.6em;
line-height: 2.6em;
}

.shop_name .name {
font-size: 1.3rem;
}

/*--// min-width: 415px --*/
}


@media screen and (min-width: 960px) {
/*-- min-width: 960px //--*/
/*====================================
/*
/* FOOTER -- min-width: 960px 
/*
/*===================================*/
footer {
min-width: 1200px;
}

footer .inner {
width: 1200px;
}

.ft_link_list {
width: 600px;
}


/*====================================
/*
/* HEADER -- min-width: 960px 
/*
/*===================================*/
header {
min-width: 1200px;
}

header .inner {
width: 1200px;
justify-content: space-between;
}

header h1 {
margin: 0;
left: 0;
transform: translate(0,-50%);
}

/*----------------------
 ナビゲーション: 960px
----------------------*/
nav {
width: 1200px;
margin: 0 auto;
padding: 0;
height: 6em;
top: 0; right: 0;
overflow: visible;
background: transparent;
transition: unset;
z-index: 10000;
display: flex;
justify-content:flex-end;
pointer-events:none;
}


nav .main_menu {
display: flex;
text-align: right;
justify-content:flex-end;
align-items: center;
pointer-events: auto;
gap: 0 2em;
}

nav .main_menu > .item {
font-size: 1.3rem;
}

nav .main_menu > .item > a {
padding: 0;
}

nav .main_menu > .item a:link,
nav .main_menu > .item a:visited {
}

nav .main_menu > .item a:hover,
nav .main_menu > .item a:active {
background: transparent;
opacity: 0.6;
}

.dropdown {
position: relative;
}

nav .sub_menu {
display: none;
position: absolute;
left: 0;
text-align: left;
min-width: 120%;
}

.sub_menu_item a {
padding: 3em;
}

/* ドロップダウンメニューの+,-アイコン（PCのみ） */
nav .dropdown.pc::before {
top: 40%;
right: -.8em;
transform: rotate(-135deg);
}

/*----------------------
 toggle_btn: 960px
----------------------*/
.toggle_btn {
display: none;
}


/*====================================
/*
/* TOP PAGE -- min-width: 960px 
/*
/*===================================*/

/*====================================
 HERO
====================================*/
.hero > .inner{
min-width: 1200px;
}

.hero_img {
max-width: 680px;
}

.hero_content {
transform: translate(-50%,-50%);
}

.hero_txt {
font-size: 3.2rem;
line-height: 1.4em;
margin: 2em 0 0;
letter-spacing: -.02em;
}

.hero_info {
margin: 4em 0 0;
}

.hero_info .date {
font-size: 6.2rem;
margin: 1.5em 0 0;
}

.hero_info .date span {
font-size: 4.2rem;
}

.hero_info .site {
font-size: 3.8rem;
}

/*----------------------
 公演終了後
----------------------*/
.hero_content_after {
width: 100%;
}

.hero_content_after .hero_img {
max-width: 920px;
}

.hero_content_after .hero_img.pc {
display: block;
}

.hero_content_after .hero_img.sp {
display: none;
}

.hero_content_after p {
font-size: 3.6rem;
}

.hero_content_after p.prefecture {
font-size: 4.8rem;
margin: .5em auto 0;
}

/*====================================
 ARTICLE COMMON
====================================*/
.article {
min-width: 1200px;
}

.article > .inner {
width: 1200px;
}

.article .lead > span {
font-size: 1.6rem;
display: block;
text-align: center;
}

/*----------------------
 見出し
----------------------*/
.headline {
font-size: 4.2rem;
}

.hd_lineup_sub {
font-size: 3.6rem;
}

.hd_lineup_sub span {
font-size: 2.4rem;
}


/*====================================
 NEWS
====================================*/
.news > .inner {
width: 840px;
}

.news_list {
flex-direction: row;
}

.news_list .term {
width: 8em;
margin: 1em 0 0;
}

.news_list .desc {
width: calc(100% - 8em);
margin: 1em 0 0;
}


/*====================================
 ABOUT
====================================*/
.lead_txt {
font-size: 4.2rem;
margin: 1.5em 0 0;
}

/*.lead_txt br {
display: none;
}*/

.sub_txt + .sub_txt {
margin: .8em 0 0;
}

.about_info {
margin: 4em 0 0;
}

.about_info .event_name {
font-size: 4.2rem;
line-height: 1em;
}

.about_info .event_name > span {
font-size: 1.8rem;
}

.about_info .date {
font-size: 4.2rem;
}

.about_info .date span {
font-size: 2.4rem;
margin-left: -.3em;
}

.about_info .time {
font-size: 2.4rem;
}

.about_info .site {
font-size: 2.4rem;
}


/*====================================
 LINE UP
====================================*/
.hd_lineup_sub {
font-size: 2.8rem;
}

.artist_box {
width: 100%;
max-width: 1200px;
margin: 3em auto;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
gap: 2em;
}

.artist_item {
width: calc(25% - 1.5em);
}

.artist_name {
font-size: 1.6rem;
}

.txt_more {
font-size: 2.8rem;
}

/*====================================
 TICKETS
====================================*/
.ticket_info {
gap: 1em 2em;
}

.ticket_info dl {
width: calc(33.333% - 2em);
border-top: solid .1em #666;
}

.hd_ticket_sub + dl {
margin: 0;
}

.ticket_info dl dt {
font-size: 1.6rem;
}

.ticket_info dl dd {
font-size: 3.4rem;
}

.ticket_atte {
text-align: center;
}

.ticket_info ul li span {
display: block;
}

.sales_info .btn::before {
font-size: 2.2rem;
}

.sales_info > .item dl dt {
font-size: 2.6rem;
}

.sales_info > .item dl dd {
font-size: 2.4rem;
}

.sales_info .btn a {
font-size: 2.2rem;
}

.sales_info .btn_set {
flex-direction: row;
}

.sales_info .btn_set .btn a {
margin: 2em 0 0;
}

/*====================================
 TIME TABLE
====================================*/
.tt_img {
flex-direction: row;
gap: 0;
width: 100%;
margin: 3em auto 0;
}

.tt_img img {
width: 50%;
height: auto;
}

.tt_atte {
width: 100%;
}

.tt_atte span {
display: block;
}

.news_article .tt_img {
margin: 1em auto 0;
}

/*====================================
 MARKET
====================================*/
.shop {
width: calc(25% - .75em);
}

.shop_name .num {
width: 2.8em;
height: 2.8em;
line-height: 2.8em;
}

.market_map {
width: 80%;
}

/*====================================
 GOODS
====================================*/
#goods .goods_img {
margin: 3em 0 0;
gap: 1em 0;
}

#goods .goods_img dl {
width: calc(33% - .5em);
}

#goods .goods_img dl dt img {
width: 100%;
}

#goods .goods_img dl dd {
font-size: 1.4rem;
margin: 1em 0 0;
}

#goods .goods_img dl dd span {
display: inline;
}

/*====================================
 協賛ロゴ
====================================*/
.sponsorship_01 {
font-size: 2.8rem;
}

.sponsorship_02 {
font-size: 2.4rem;
margin: 6rem 0 0;
}

.sponsorship_03 {
font-size: 2.0rem;
margin: 6rem 0 0;
}

.sponsorship_list_01,
.sponsorship_list_02,
.sponsorship_list_03 {
margin: 1.5rem auto 0;
gap: 1em;
flex-direction: row;
}

.sponsorship_list_01 .item::before,
.sponsorship_list_02 .item::before,
.sponsorship_list_03 .item::before {
content: "/";
margin-right: .6em;
}

.sponsorship_list_01 .item:first-child::before,
.sponsorship_list_02 .item:first-child::before,
.sponsorship_list_03 .item:first-child::before {
content: "";
}

.sponsorship_list_01 .item {
font-size: 2.6rem;
}

.sponsorship_list_02 .item {
font-size: 2.0rem;
}

.sponsorship_list_03 .item {
font-size: 1.8rem;
}


/*====================================
 ACCESS
====================================*/
.map.top {
width: 55%;
}

/*====================================
/*
/* ACCESS -- min-width: 960px 
/*
/*===================================*/
.transportation {
flex-direction: row;
flex-wrap: wrap;
gap: 1.5em 4em;
}

.transportation > .item {
width: calc(50% - 2em);
}

.transportation > .item dt {
font-size: 1.6rem;
}

.transportation > .item dd {
font-size: 1.4rem;
}

.transportation > .ttl {
width: 100%;
}


/*====================================
/*
/* NOTICE -- min-width: 960px 
/*
/*===================================*/
/*====================================
 Q&A
====================================*/
.qa_contents dt,
.qa_contents dd {
font-size: 1.6rem;
}

.qa_contents dd span {
display: block;
}

.qa_contents dt::before,
.qa_contents dd::before {
font-size: 3.2rem;
}

/*--// min-width: 960px //--*/
}