@charset "utf-8";


.mobile{
display: none!important
}

body{
background:var(--color-bg);
}

/*--------------------breadcrumb--------------------*/

ol.contents {
width: 1000px;
margin: 0px auto;
font-size: 12px;
text-align: right;
padding-top: 10px
}

ol.contents li{
display:inline-block;
list-style: none;
vertical-align: middle
}

ol.contents li:after{
content: '»';
font-size: 14px;
margin: 0px 5px 0px 5px;
color:#999
}

ol li:last-child:after{
content: '';
display: none;
}

ol.contents li a {
text-decoration: none;
color: #000;
}

ol.contents li:first-child a{
background: url(../img/icon/home.png) no-repeat left center;
background-size: 12px;
padding-left: 20px;
}

ol.contents li a:hover {
text-decoration: underline;
}

.site-header{
width:280px;
height:100vh;
position:fixed;
top:0;
left:0;
z-index:20;
padding:28px 24px;
background:linear-gradient(180deg,#1e1b2e 0,#27213d 100%);
color:var(--color-white);
}

.site-header_inner{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
}

a.site-logo{
display: block;
text-align-last: center;
margin: 0px auto;
}

span.site-logo_icon{
width:140px;
height:140px;
margin: 0px auto;
display: block;
}

span.site-logo_text{
font-size:18px;
line-height:1;
letter-spacing:0.04em;
display: flex;
align-items: center;
gap: 5px
}

span.site-logo_text:before,span.site-logo_text:after{
content: "";
width: 24px;
height: 1px;
background: #fff
}

.menu-button{
display:none;
}

.global-nav{
margin-top:42px;
}

ul.global-nav_list{
display:grid;
gap:10px;
}

a.global-nav_list {
padding:15px 16px;
border-radius:5px;
color:rgba(255,255,255,0.82);
background:rgba(255,255,255,0.06);
font-size:14px;
line-height:1;
display: flex;
align-items: center;
gap: 10px
}

a.global-nav_list:before{
content: "";
width: 18px;
height: 18px;
}

a.home:before{
background: url(../img/header/home.png) no-repeat center;
background-size: 100%
}

a.shop:before{
background: url(../img/header/shop.png) no-repeat center;
background-size: 100%
}

a.ranking:before{
background: url(../img/header/ranking.png) no-repeat center;
background-size: 100%
}

a.report:before{
background: url(../img/header/report.png) no-repeat center;
background-size: 100%
}

a.horoscope:before{
content:"";
background:url(../img/header/horoscope.svg) no-repeat center;
background-size:100%;
}

a.guide:before{
content:"?";
display:flex;
align-items:center;
justify-content:center;
border:2px solid currentColor;
border-radius:50%;
font-size:11px;
font-weight:800;
line-height:1;
}

a.memo:before{
background: url(../img/header/memo.png) no-repeat center;
background-size: 100%
}

a.contact:before{
background: url(../img/header/mail.png) no-repeat center;
background-size: 100%
}

a.global-nav_list:hover{
color:var(--color-white);
background:rgba(255,255,255,0.13);
}

.horoscope-preview_list{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px;
}

.horoscope-preview_item a{
position:relative;
display:grid;
grid-template-columns:62px 1fr auto 14px;
grid-template-rows:auto auto;
align-items:center;
gap:3px 13px;
min-height:118px;
padding:20px;
border:1px solid #eeeaf6;
border-radius:16px;
background:linear-gradient(145deg,#fff 42%,#faf5ff 100%);
box-shadow:0 12px 28px rgba(30,27,46,.08);
}

.horoscope-preview_item a:hover{
transform:translateY(-3px);
box-shadow:0 17px 34px rgba(30,27,46,.13);
}

.horoscope-preview_rank{
position:absolute;
top:10px;
right:12px;
padding:5px 8px;
border-radius:999px;
color:#7b61ff;
background:#f0edff;
font-size:10px;
line-height:1;
}

.horoscope-preview_symbol{
grid-row:1/3;
display:grid;
width:58px;
height:58px;
place-items:center;
border-radius:16px;
color:#fff;
background:linear-gradient(135deg,var(--color-pink),var(--color-purple));
font-size:31px;
line-height:1;
}

.horoscope-preview_name{
grid-column:2;
grid-row:1;
align-self:end;
font-size:16px;
line-height:1.4;
}

.horoscope-preview_score{
grid-column:3;
grid-row:1/3;
align-self:center;
color:#6e687d;
font-size:11px;
line-height:1.3;
}

.horoscope-preview_score strong{
margin-right:2px;
color:var(--color-pink);
font-size:25px;
line-height:1;
}

.horoscope-preview_arrow{
grid-column:4;
grid-row:1/3;
color:#aea8bc;
font-size:25px;
}

.horoscope-preview_update{
color:#9993aa;
font-size:12px;
}



.site-main{
width:calc(100% - 200px);
max-width:1200px;
margin-left:280px;
padding:48px 56px;
}

.hero{
width:100%;
min-height:420px;
padding:56px;
display:flex;
flex-direction:column;
justify-content:center;
border-radius:17px;
color:var(--color-white);
background:
linear-gradient(90deg,rgba(8,10,30,.72) 0%,rgba(8,10,30,.48) 48%,rgba(8,10,30,.05) 100%),
url(../img/header/hero-smartphone-v4.png) no-repeat center;
background-size: cover;
box-shadow:0 24px 60px rgba(30,27,46,0.22);
}

.hero_badge{
width:max-content;
display:inline-flex;
align-items:center;
height:34px;
padding:0 14px;
border-radius:17px;
background:rgba(255,255,255,0.12);
font-size:12px;
line-height:1;
letter-spacing:0.05em;
}

.hero_title{
margin-top:22px;
font-size:46px;
line-height:1.32;
letter-spacing:0.04em;
}

.hero_text{
max-width:620px;
margin-top:18px;
font-size:15px;
line-height:2;
color:rgba(255,255,255,0.82);
}

.hero_actions{
margin-top:30px;
display:flex;
gap:12px;
}

.button{
min-width:170px;
height:54px;
display:flex;
align-items:center;
justify-content:center;
border-radius:9px;
font-size:14px;
line-height:1;
}

.button-primary{
color:var(--color-white);
background:linear-gradient(135deg,var(--color-pink),var(--color-purple));
box-shadow:0 14px 28px rgba(255,77,157,0.28);
}

.button-secondary{
color:var(--color-white);
background:rgba(255,255,255,0.12);
}

.button:hover{
transform:translateY(-2px);
}

.section{
margin-top:48px;
}

.section_head{
margin-bottom:24px;
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:20px;
}

.current-status_heading{
width:100%;
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:10px;
}

.current-status_heading .section_title{
font-size:24px;
}

.current-weather{
flex:0 0 auto;
min-width:112px;
padding:9px 10px;
display:flex;
align-items:center;
gap:7px;
border-radius:13px;
background:var(--color-white);
box-shadow:var(--shadow-card);
}

.current-weather_icon{
font-size:24px;
line-height:1;
}

.current-weather_text{
display:grid;
grid-template-columns:auto auto;
align-items:end;
column-gap:5px;
row-gap:1px;
}

.current-weather_city{
grid-column:1 / -1;
font-size:8px;
line-height:1.2;
font-weight:700;
color:#8f8aa3;
}

.current-weather_temperature{
font-size:18px;
line-height:1;
color:var(--color-main);
}

.current-weather_label{
max-width:54px;
font-size:9px;
line-height:1.2;
font-weight:700;
color:#8f8aa3;
}

.section_label{
margin-bottom:8px;
color:var(--color-pink);
font-size:12px;
line-height:1;
letter-spacing:0.14em;
}

.section_title{
font-size:28px;
line-height:1.35;
color:var(--color-main);
}

.section_weekday{
font-size:0.62em;
font-weight:700;
}

.section_time{
flex:0 0 auto;
font-size:12px;
line-height:1;
color:#8f8aa3;
white-space:nowrap;
}

div.shop-card_list{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:28px;
}

.shop-sort{
margin:0 0 22px;
padding:18px 20px;
display:grid;
gap:14px;
border:1px solid rgba(123,97,255,.12);
border-radius:14px;
background:var(--color-white);
box-shadow:0 10px 26px rgba(42,39,64,.07);
}

.shop-sort_fields{
display:flex;
align-items:center;
gap:14px;
}

.shop-sort_label{
flex:0 0 auto;
color:var(--color-main);
font-size:13px;
font-weight:700;
}

.shop-sort_select{
width:220px;
height:44px;
padding:0 42px 0 14px;
border:1px solid #e5e1ef;
border-radius:10px;
color:var(--color-main);
background:#f8f7fb;
font:inherit;
font-size:13px;
font-weight:700;
cursor:pointer;
}

.shop-sort_select:focus{
outline:2px solid rgba(255,77,157,.22);
border-color:var(--color-pink);
}

.favorite-filter_button{
width:100%;
min-height:50px;
padding:10px 18px;
display:flex;
align-items:center;
justify-content:center;
gap:10px;
border:0;
border-radius:10px;
color:#fff;
background:linear-gradient(135deg,var(--color-pink),#f53585);
box-shadow:0 8px 18px rgba(255,77,157,.2);
font:inherit;
font-size:13px;
font-weight:700;
cursor:pointer;
transition:transform .2s,box-shadow .2s;
}

.favorite-filter_button:hover{
transform:translateY(-1px);
box-shadow:0 10px 22px rgba(255,77,157,.28);
}

.favorite-filter_button:focus-visible{
outline:3px solid rgba(255,77,157,.25);
outline-offset:2px;
}

.favorite-filter_button.is-active{
background:linear-gradient(135deg,var(--color-purple),var(--color-pink));
}

.favorite-filter_icon{
font-size:24px;
line-height:1;
}

.shop-card[hidden]{
display:none !important;
}

.shop-load-more{
margin-top:28px;
text-align:center;
}

.shop-load-more[hidden]{
display:none;
}

.shop-load-more_button{
min-width:300px;
min-height:54px;
padding:12px 26px;
border:0;
border-radius:12px;
color:var(--color-white);
background:linear-gradient(135deg,var(--color-pink),var(--color-purple));
box-shadow:0 12px 26px rgba(255,77,157,.22);
font:inherit;
font-size:14px;
font-weight:700;
cursor:pointer;
transition:transform .2s ease,box-shadow .2s ease;
}

.shop-load-more_button:hover{
transform:translateY(-2px);
box-shadow:0 16px 30px rgba(255,77,157,.28);
}

.shop-pagination{
margin-top:28px;
display:flex;
align-items:center;
justify-content:center;
gap:8px;
}

.shop-pagination[hidden]{
display:none;
}

.shop-pagination_button{
width:42px;
height:42px;
padding:0;
display:inline-flex;
align-items:center;
justify-content:center;
border:1px solid #e4e0ec;
border-radius:10px;
color:#817b94;
background:var(--color-white);
box-shadow:0 6px 16px rgba(42,39,64,.06);
font:inherit;
font-size:13px;
font-weight:700;
cursor:pointer;
transition:color .2s ease,border-color .2s ease,background .2s ease,transform .2s ease;
}

.shop-pagination_button:hover{
border-color:var(--color-pink);
color:var(--color-pink);
transform:translateY(-1px);
}

.shop-pagination_button.is-active{
border-color:transparent;
color:var(--color-white);
background:linear-gradient(135deg,var(--color-pink),var(--color-purple));
box-shadow:0 8px 18px rgba(255,77,157,.22);
}

.shop-pagination_button:disabled{
opacity:.38;
cursor:not-allowed;
transform:none;
}

.shop-pagination_button-arrow{
font-size:24px;
font-weight:400;
}

.section_more{
display:flex;
justify-content:center;
margin-top:28px;
}

.section_more_link{
min-width:300px;
height:56px;
padding:0 24px;
display:inline-flex;
align-items:center;
justify-content:center;
gap:14px;
border:1px solid rgba(255,77,157,.2);
border-radius:12px;
color:var(--color-white);
background:linear-gradient(135deg,var(--color-pink),var(--color-purple));
box-shadow:0 14px 30px rgba(255,77,157,.24);
font-size:14px;
line-height:1;
font-weight:700;
letter-spacing:.03em;
transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;
}

.section_more_link:after{
content:"›";
font-size:24px;
font-weight:400;
line-height:1;
transition:transform .2s ease;
}

.section_more_link:hover{
color:var(--color-white);
filter:brightness(1.06);
transform:translateY(-2px);
box-shadow:0 18px 36px rgba(255,77,157,.32);
}

.section_more_link:hover:after{
transform:translateX(4px);
}

.visit-cta{
margin-top:28px;
padding:24px 28px;
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
border-radius:12px;
background:var(--color-white);
box-shadow:var(--shadow-card);
}

.visit-cta_title{
font-size:18px;
line-height:1.5;
color:var(--color-main);
}

.visit-cta_lead{
margin-top:8px;
font-size:13px;
line-height:1.6;
color:#8f8aa3;
}

.visit-cta .button{
min-width:220px;
}

.ranking-list{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:16px;
}

.ranking-item{
min-height:0;
padding:0;
display:block;
border-radius:10px;
background:var(--color-white);
box-shadow:var(--shadow-card);
overflow:hidden;
}

.ranking-item_link{
min-height:86px;
padding:16px 18px;
display:grid;
grid-template-columns:44px 72px 1fr auto 18px;
align-items:center;
gap:14px;
}

.ranking-item_rank{
width:44px;
height:44px;
display:flex;
align-items:center;
justify-content:center;
border-radius:8px;
color:var(--color-white);
background:var(--color-main);
font-size:18px;
line-height:1;
}

.ranking-item_rank.is-gold{
background:linear-gradient(135deg,#f6b93b,#ff4d9d);
}

.ranking-item_rank.is-silver{
background:linear-gradient(135deg,#9aa0b5,#7b61ff);
}

.ranking-item_rank.is-bronze{
background:linear-gradient(135deg,#c8794a,#ff4d9d);
}

.ranking-item_image{
width:72px;
height:52px;
display:block;
border-radius:8px;
background:#1e1b2e;
overflow:hidden;
}

.ranking-item_image img{
width:100%;
height:100%;
display:block;
object-fit:cover;
}

.ranking-item_text{
display:grid;
gap:6px;
}

.ranking-item_name{
font-size:15px;
line-height:1;
color:var(--color-main);
}

.ranking-item_kana{
font-size:11px;
line-height:1;
color:#8f8aa3;
}

.ranking-item_count{
font-size:13px;
line-height:1;
color:var(--color-pink);
white-space:nowrap;
}

.ranking-item_count strong{
font-size:24px;
line-height:1;
}

.ranking-item_arrow{
font-size:26px;
line-height:1;
color:#b7b3c7;
}

 .section_more_link:hover{
 color:var(--color-white);
 background:var(--color-pink);
 }

/* --- Weekly Report & Section Head Link Styles --- */
.section_head_link{
height:42px;
padding:0 18px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:8px;
color:var(--color-main);
background:var(--color-white);
box-shadow:var(--shadow-card);
font-size:12px;
line-height:1;
white-space:nowrap;
}

.section_head_link:hover{
color:var(--color-white);
background:var(--color-pink);
}

.weekly-report_grid{
display:grid;
grid-template-columns:1fr 340px;
gap:24px;
}

.weekly-card{
padding:28px;
border-radius:12px;
background:var(--color-white);
box-shadow:var(--shadow-card);
}

.weekly-card_title{
font-size:20px;
line-height:1.4;
color:var(--color-main);
}

.weekly-card_lead{
margin-top:8px;
font-size:13px;
line-height:1.7;
color:#8f8aa3;
}

.weekly-summary{
margin-top:24px;
display:grid;
grid-template-columns:repeat(3,1fr);
gap:12px;
}

.weekly-summary div{
padding:18px 12px;
border-radius:9px;
background:#f7f7fb;
text-align:center;
}

.weekly-summary_label{
display:block;
font-size:12px;
line-height:1;
color:#8f8aa3;
}

.weekly-summary_value{
margin-top:10px;
display:block;
font-size:13px;
line-height:1;
color:var(--color-main);
}

.weekly-summary_value strong{
font-size:30px;
line-height:1;
color:var(--color-pink);
}

.weekly-bars{
margin-top:26px;
display:grid;
gap:12px;
}

.weekly-bars li{
display:grid;
grid-template-columns:32px 1fr 52px;
align-items:center;
gap:12px;
}

.weekly-day{
height:32px;
display:flex;
align-items:center;
justify-content:center;
border-radius:8px;
color:var(--color-white);
background:var(--color-main);
font-size:12px;
line-height:1;
}

.weekly-bar{
height:12px;
display:block;
border-radius:6px;
background:#f0edf7;
overflow:hidden;
}

.weekly-bar span{
height:100%;
display:block;
border-radius:6px;
background:linear-gradient(90deg,var(--color-pink),var(--color-purple));
}

.weekly-count{
font-size:13px;
line-height:1;
color:var(--color-main);
text-align:right;
}

.weekly-card-note{
display:flex;
flex-direction:column;
justify-content:space-between;
gap:24px;
color:var(--color-white);
background:
radial-gradient(circle at 85% 18%,rgba(255,77,157,0.38) 0,rgba(255,77,157,0) 34%),
linear-gradient(135deg,#29213f 0,#181426 100%);
}

.weekly-card-note .weekly-card_title{
color:var(--color-white);
}

.weekly-note_text{
font-size:14px;
line-height:2;
color:rgba(255,255,255,0.82);
}

.weekly-note_link{
height:48px;
display:flex;
align-items:center;
justify-content:center;
border-radius:8px;
color:var(--color-white);
background:rgba(255,255,255,0.12);
font-size:13px;
line-height:1;
}

.weekly-note_link:hover{
background:var(--color-pink);
}

/* --- How Card Styles --- */
.how-card_list{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px;
}

.how-card{
position:relative;
padding:30px 28px;
border-radius:12px;
background:var(--color-white);
box-shadow:var(--shadow-card);
overflow:hidden;
}

.how-card:before{
content:"";
width:120px;
height:120px;
position:absolute;
top:-60px;
right:-50px;
border-radius:60px;
background:linear-gradient(135deg,rgba(255,77,157,0.14),rgba(123,97,255,0.14));
}

.how-card_number{
width:48px;
height:48px;
display:flex;
align-items:center;
justify-content:center;
border-radius:8px;
color:var(--color-white);
background:linear-gradient(135deg,var(--color-pink),var(--color-purple));
font-size:15px;
line-height:1;
letter-spacing:0.04em;
}

.how-card_title{
margin-top:24px;
font-size:20px;
line-height:1.45;
color:var(--color-main);
}

.how-card_text{
margin-top:12px;
font-size:13px;
line-height:1.9;
color:#8f8aa3;
}

.contact-cta{
margin-bottom:10px;
}

.contact-cta_inner{
padding:42px 46px;
display:flex;
align-items:center;
justify-content:space-between;
gap:32px;
border-radius:17px;
color:var(--color-white);
background:
radial-gradient(circle at 82% 18%,rgba(255,77,157,0.42) 0,rgba(255,77,157,0) 34%),
linear-gradient(135deg,#29213f 0,#181426 100%);
box-shadow:0 24px 60px rgba(30,27,46,0.22);
}

.contact-cta .section_label{
margin-bottom:12px;
color:var(--color-pink);
}

.contact-cta_title{
font-size:30px;
line-height:1.45;
letter-spacing:0.03em;
}

.contact-cta_lead{
max-width:640px;
margin-top:14px;
font-size:14px;
line-height:1.9;
color:rgba(255,255,255,0.82);
}

.contact-cta_actions{
display:grid;
gap:12px;
min-width:230px;
}

.contact-cta_actions .button{
width:100%;
min-width:230px;
}

.site-footer{
width:calc(100% - 280px);
margin-left:280px;
padding:10px 40px 34px;
text-align:center;
}

.site-footer_copy{
font-size:11px;
line-height:1;
color:#9b96ad;
}

.line-login_button{
margin-top:10px;
border:0;
background:#06c755;
color:#fff;
}

.line-login_button:hover{
background:#05b94f;
color:#fff;
}

.line-login_icon{
min-width:38px;
height:22px;
padding:0 6px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:5px;
background:#fff;
color:#06c755;
font-size:10px;
line-height:1;
font-weight:700;
letter-spacing:0.02em;
}

@media screen and (max-width:1180px){
.site-main{
padding:34px;
}

.shop-card_list{
grid-template-columns:1fr;
gap:22px;
}

.ranking-list{
grid-template-columns:1fr;
}
 

.weekly-report_grid{
grid-template-columns:1fr;
}

.how-card_list{
grid-template-columns:1fr;
gap:18px;
}

.contact-cta_inner{
padding:34px;
display:grid;
gap:24px;
}

.contact-cta_actions{
min-width:0;
}

.contact-cta_actions .button{
min-width:0;
}
}

/* --- Shop Detail Page Styles --- */
.detail-page .site-main{
background:var(--color-bg);
}

.detail-wrap{
width:min(100%,1080px);
margin:0 auto;
}

.detail-hero{
padding:20px;
border-radius:12px;
background:var(--color-white);
box-shadow:var(--shadow-card);
}

.detail-hero_top{
display:grid;
grid-template-columns:120px minmax(0,1fr) 150px;
align-items:center;
gap:20px;
}

.detail-image-wrap{
width:120px;
height:120px;
}

.detail-image{
width:100%;
height:100%;
display:block;
object-fit:cover;
border-radius:14px;
background:#1e1b2e;
}

.detail-info{
min-width:0;
}

div.detail-labels{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:10px;
margin-bottom:12px;
}

.detail-area{
width:max-content;
height:34px;
padding:0 16px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:17px;
background: rgb(240, 237, 255);
color:var(--color-purple);
font-size:13px;
line-height:1;
font-weight:700;
}

.detail-title{
margin:0;
font-size:34px;
line-height:1.35;
color:var(--color-main);
overflow-wrap:anywhere;
}

.detail-kana{
margin-top:0px;
font-size:14px;
line-height:1.5;
color:#8f8aa3;
}

.detail-favorite{
min-height:38px;
margin-top:10px;
padding:0 16px;
display:inline-flex;
align-items:center;
justify-content:center;
border:1px solid rgba(255,77,157,.3);
border-radius:19px;
color:var(--color-pink);
background:#fff5fa;
font:inherit;
font-size:13px;
line-height:1;
font-weight:700;
white-space:nowrap;
cursor:pointer;
transition:background .2s,color .2s,transform .2s;
}

.detail-favorite:hover{
transform:translateY(-1px);
background:#ffe8f3;
}

.detail-favorite:focus-visible{
outline:3px solid rgba(255,77,157,.25);
outline-offset:2px;
}

.detail-favorite.is-favorite{
color:#fff;
background:var(--color-pink);
}

.detail-maybe-visit{
min-height:38px;
margin:10px 0 0 6px;
padding:0 16px;
display:inline-flex;
align-items:center;
justify-content:center;
border:1px solid rgba(123,97,255,.3);
border-radius:19px;
color:var(--color-purple);
background:#f5f2ff;
font:inherit;
font-size:13px;
line-height:1;
font-weight:700;
white-space:nowrap;
cursor:pointer;
transition:background .2s,color .2s,transform .2s;
}

.detail-maybe-visit:hover{
transform:translateY(-1px);
background:#ebe5ff;
}

.detail-maybe-visit:focus-visible{
outline:3px solid rgba(123,97,255,.25);
outline-offset:2px;
}

.detail-maybe-visit.is-registered{
color:#fff;
background:linear-gradient(135deg,var(--color-purple),var(--color-pink));
}

.detail-maybe-visit:disabled{
cursor:wait;
opacity:.7;
}

.detail-forecast{
width:100%;
min-height:120px;
padding:14px 10px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
border-radius:14px;
background:#f7f7fb;
text-align:center;
box-sizing:border-box;
}

.detail-forecast_label{
font-size:12px;
line-height:1.4;
color:#8f8aa3;
font-weight:700;
white-space:nowrap;
}

.detail-forecast_value{
margin:10px 0 0;
font-size:15px;
line-height:1;
color:var(--color-main);
font-weight:700;
}

.detail-forecast_value strong{
font-size:40px;
line-height:1;
color:var(--color-pink);
}

.detail-status{
width:max-content;
height:34px;
padding:0 20px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:17px;
background:#ecfff6;
color:#16805b;
font-size:13px;
line-height:1;
font-weight:700;
}

.detail-status.is-caution{
background:#fff7dd;
color:#b98200;
}

.detail-status.is-busy{
background:var(--color-pink);
color:#fff;
}

.detail-prediction{
margin-top:24px;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:12px;
}

.detail-prediction_item{
padding:20px 14px;

border-radius:14px;
background:rgb(247, 247, 251);
text-align:center;
}

.detail-prediction_item dt{
font-size:13px;
line-height:1.5;
color:#8f8aa3;
font-weight:700;
}

.detail-prediction_item dd{
margin-top:8px;
font-size:14px;
line-height:1;
color:var(--color-main);
font-weight:700;
}

.detail-prediction_item strong{
font-size:38px;
line-height:1;
color:var(--color-pink);
}

.detail-comment{
margin-top:22px;
padding:18px 20px;
border-radius:12px;
background:#000;
font-size:14px;
line-height:1.9;
color:#fff;
font-weight:700;
}

.detail-grid{
margin-top:28px;
display:grid;
grid-template-columns:1fr 1fr;
gap:24px;
}

.detail-section{
padding:28px;
border-radius:18px;
background:var(--color-white);
box-shadow:var(--shadow-card);
}

.detail-post-section{
margin-top:28px;
}

.detail-section_title{
margin-bottom:18px;
font-size:22px;
line-height:1.5;
color:var(--color-main);
}

.post-tabs{
margin-bottom:18px;
display:flex;
gap:8px;
}

.post-tab{
min-width:140px;
height:42px;
padding:0 18px;
display:inline-flex;
align-items:center;
justify-content:center;
border:0;
border-radius:21px;
color:#8f8aa3;
background:#f7f7fb;
font-size:13px;
line-height:1;
font-weight:700;
cursor:pointer;
}

.post-tab.is-active{
color:#fff;
background:var(--color-main);
}

.post-tab_panel{
display:none;
}

.post-tab_panel.is-active{
display:block;
}

.detail-table{
width:100%;
border-collapse:collapse;
font-size:14px;
line-height:1.6;
}

.detail-table th,
.detail-table td{
padding:14px 10px;
border-bottom:1px solid #ece8f2;
text-align:left;
color:var(--color-main);
}

.detail-table th{
color:#8f8aa3;
font-weight:700;
}

.detail-weekly-section{
color:var(--color-white);
background:
radial-gradient(circle at 82% 18%,rgba(255,77,157,.28) 0,rgba(255,77,157,0) 34%),
radial-gradient(circle at 74% 82%,rgba(119,86,255,.28) 0,rgba(119,86,255,0) 34%),
linear-gradient(135deg,#29213f 0,#181426 100%);
box-shadow:0 24px 60px rgba(30,27,46,.18);
}

.detail-weekly-section .detail-section_title,
.detail-weekly-section .detail-table th,
.detail-weekly-section .detail-table td{
color:var(--color-white);
}

.detail-weekly-section .detail-table th{
color:rgba(255,255,255,.62);
}

.detail-weekly-section .detail-table th,
.detail-weekly-section .detail-table td{
border-bottom-color:rgba(255,255,255,.22);
}

.post-list{
display:grid;
gap:14px;
}

.post-card{
padding:18px;
border-radius:14px;
background:#f7f7fb;
}

.post-card_head{
display:flex;
justify-content:space-between;
gap:15px;
font-size:14px;
line-height:1.5;
color:#8f8aa3;
}

.post-card_name{
color:var(--color-main);
font-size:18px;
font-weight:700;
}

.post-card_body{
margin:0;
font-size:14px;
line-height:1.9;
color:var(--color-main);
font-weight:700;
}

.post-card_meta{
margin-top:12px;
display:flex;
flex-wrap:wrap;
gap:8px;
}

.post-badge{
height:28px;
padding:0 12px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:14px;
background:var(--color-pink);
color:#ffffff;
font-size:12px;
line-height:1;
font-weight:700;
}

.empty-box{
padding:22px;
border-radius:12px;
background:#f7f7fb;
font-size:14px;
line-height:1.9;
color:#8f8aa3;
}

@media screen and (max-width:1180px){

.detail-hero_top{
grid-template-columns:100px minmax(0,1fr) 120px;
gap:14px;
}

.detail-image-wrap{
width:100px;
height:100px;
}

.detail-forecast{
min-height:100px;
}

.detail-grid{
grid-template-columns:1fr;
}

}


.area-selector{
width: 500px;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px;
margin-top:25px;
}

.area-selector_button{
height:80px;
padding:16px;
display:flex;
align-items:center;
justify-content:center;
gap:12px;
appearance:none;
color:#fff;
font:inherit;
font-size:14px;
font-weight:700;
letter-spacing:.04em;
cursor:pointer;
border:1px solid rgba(255,255,255,.25);
border-radius:18px;
background:rgba(255,255,255,.04);
transition:
transform .2s ease,
background-color .2s ease,
border-color .2s ease,
box-shadow .2s ease;
}

.area-selector_button:hover{
transform:translateY(-2px);
background:rgba(255,255,255,.08);
}

.area-selector_button.is-active{
border-color:#ef55b1;
background:rgba(239,85,177,.13);
box-shadow:
0 0 0 1px rgba(239,85,177,.18),
0 12px 30px rgba(0,0,0,.18);
}

.area-selector_icon{
width:40px;
height:40px;
display:flex;
align-items:center;
justify-content:center;
flex:0 0 40px;
}

.area-selector_icon img{
display:block;
width:100%;
height:100%;
object-fit:contain;
}

.site-visitor-count{
width:500px;
margin-top:14px;
padding:12px 18px;
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
border:1px solid rgba(255,255,255,.2);
border-radius:12px;
background:rgba(8,10,30,.4);
backdrop-filter:blur(8px);
}

.site-visitor-count_label{
font-size:13px;
font-weight:700;
letter-spacing:.04em;
color:rgba(255,255,255,.8);
}

.site-visitor-count_value{
white-space:nowrap;
font-size:13px;
font-weight:700;
}

.site-visitor-count_value strong{
margin-right:4px;
color:#ff65b7;
font-size:24px;
line-height:1;
}

.area-shop-list[hidden]{
display:none !important;
}

.area-shop-list_empty{
width:100%;
margin:0;
padding:30px 20px;
text-align:center;
color:#7e7a92;
background:#fff;
border-radius:20px;
}

/* --- Shop Detail Footer Navigation --- */
.post-tabs.app-footer-nav{
position:fixed;
left:calc(280px + (100% - 280px) / 2);
bottom:0;
z-index:1000;
width:min(calc(100% - 280px),1200px);
margin:0;
padding:10px 18px calc(10px + env(safe-area-inset-bottom));
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
gap:8px;
transform:translateX(-50%);
background:#000;
border-top:1px solid rgba(31,26,49,.08);
box-shadow:0 -8px 28px rgba(31,26,49,.12);
backdrop-filter:blur(16px);
-webkit-backdrop-filter:blur(16px);
}

.app-footer-nav_item{
min-width:0;
min-height:72px;
padding:8px 4px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:6px;
appearance:none;
color:#fff;
font:inherit;
border-radius:18px;
background:transparent;
cursor:pointer;
transition:
color .2s ease,
background-color .2s ease,
transform .2s ease;
}

.app-footer-nav_item.is-active{
color:#fff;
background:#211b31;
}

.app-footer-nav_item.is-active .app-footer-nav_text{
color:#fff;
text-decoration:underline;
text-decoration-thickness:2px;
text-underline-offset:4px;
}

.app-footer-nav_item:active{
transform:scale(.97);
}

.app-footer-nav_icon{
width:32px;
height:32px;
display:block;
flex:0 0 32px;
}

.app-footer-nav_icon img{
width:100%;
height:100%;
display:block;
object-fit:contain;
}

.app-footer-nav_text{
max-width:100%;
overflow:hidden;
font-size:13px;
line-height:1.2;
font-weight:700;
text-overflow:ellipsis;
white-space:nowrap;
}

.detail-page .site-main{
padding-bottom:128px;
}

.detail-external-links{
margin:24px 0 8px;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:12px;
}

.detail-external-link{
min-height:64px;
padding:14px 18px;
display:flex;
align-items:center;
gap:11px;
color:#fff;
font-size:14px;
font-weight:700;
border-radius:16px;
box-shadow:0 12px 28px rgba(31,26,49,.13);
transition:transform .2s ease,box-shadow .2s ease;
}

.detail-external-link.is-home{
background:linear-gradient(135deg,#ff4d9d,#965cff);
}

.detail-external-link.is-bbs{
background:linear-gradient(135deg,#7560ff,#3d91ee);
}

.detail-external-link:hover{
color:#fff;
transform:translateY(-2px);
box-shadow:0 16px 34px rgba(31,26,49,.18);
}

.detail-external-link_icon{
font-size:22px;
line-height:1;
}

.detail-external-link_arrow{
margin-left:auto;
font-size:18px;
line-height:1;
}

[hidden]{
display:none !important;
}

/* --- Shop Analysis Dashboard --- */
.detail-analysis{
padding:22px;
color:var(--color-main);
background:linear-gradient(145deg,#fff 0%,#faf7ff 55%,#fff4fa 100%);
border-radius:26px;
box-shadow:0 16px 40px rgba(31,26,49,.09);
}

.analysis-tabs{
padding:8px;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:10px;
border:1px solid #ece8f3;
border-radius:18px;
background:#f5f4f9;
}

.analysis-tab{
min-height:58px;
padding:10px 16px;
color:#8f8aa3;
border:0;
border-radius:14px;
background:#fff;
font:inherit;
font-size:16px;
font-weight:700;
cursor:pointer;
transition:transform .2s ease,background .2s ease,color .2s ease;
}

.analysis-tab:hover{
transform:translateY(-1px);
color:var(--color-pink);
}

.analysis-tab.is-active{
color:#fff;
background:linear-gradient(135deg,var(--color-pink),var(--color-purple));
box-shadow:0 10px 24px rgba(255,77,157,.22);
}

.analysis-panel{
margin-top:22px;
display:grid;
gap:22px;
}

.analysis-card{
padding:28px;
border:1px solid #eee9f5;
border-radius:24px;
background:#fff;
box-shadow:0 14px 34px rgba(31,26,49,.08);
}

.analysis-card_title{
margin:0 0 22px;
color:var(--color-main);
font-size:20px;
line-height:1.4;
}

.analysis-chart-wrap{
position:relative;
height:330px;
}

.analysis-chart-wrap.is-hour{
height:360px;
}

.analysis-chart-wrap.is-radar{
max-width:620px;
height:470px;
margin:0 auto;
}

.analysis-summary-grid{
margin-top:22px;
padding-top:22px;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:16px;
border-top:1px solid #ece8f2;
text-align:center;
}

.analysis-summary-grid.is-two{
grid-template-columns:repeat(2,minmax(0,1fr));
}

.analysis-summary-grid span,
.analysis-record-card span{
display:block;
color:#8f8aa3;
font-size:13px;
}

.analysis-summary-grid strong{
margin-top:5px;
display:block;
color:var(--color-main);
font-size:25px;
}

.analysis-summary-grid strong.is-positive{
color:#27b98b;
}

.analysis-summary-grid strong.is-negative{
color:#ff4d7d;
}

.analysis-record-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:18px;
}

.analysis-record-card{
padding:25px;
text-align:center;
border:1px solid #eee8f5;
border-radius:20px;
background:linear-gradient(145deg,#fff 0%,#f8f4ff 100%);
box-shadow:0 12px 28px rgba(31,26,49,.07);
}

.analysis-record-card strong{
margin-top:8px;
display:inline-block;
color:var(--color-pink);
font-size:42px;
line-height:1;
}

.analysis-record-card strong.is-date{
font-size:25px;
}

.analysis-record-card small{
margin-left:4px;
color:#8f8aa3;
font-size:13px;
}

@media screen and (max-width:1180px){

.post-tabs.app-footer-nav{
left:calc(280px + (100% - 280px) / 2);
width:calc(100% - 280px);
}

}

.detail-event-list{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:20px;
}

.detail-event-card{
position:relative;
min-height:220px;
padding:30px 30px 28px 34px;
border:1px solid #ece6f7;
border-radius:24px;
background:
linear-gradient(135deg,rgba(255,77,157,.05),rgba(123,97,255,.04)),
#fff;
box-shadow:0 14px 34px rgba(31,26,49,.08);
overflow:hidden;
transition:
transform .2s ease,
box-shadow .2s ease;
}

.detail-event-card:hover{
transform:translateY(-3px);
box-shadow:0 18px 42px rgba(31,26,49,.12);
}

.detail-event-card:before{
content:"";
width:6px;
position:absolute;
top:0;
bottom:0;
left:0;
background:linear-gradient(
180deg,
var(--color-pink),
var(--color-purple)
);
}

.detail-event-date{
width:max-content;
margin:0 0 14px;
padding:7px 12px;
border-radius:999px;
color:var(--color-purple);
background:#f1edff;
font-size:13px;
line-height:1;
font-weight:700;
}

.detail-event-title{
margin:0;
color:var(--color-main);
font-size:24px;
line-height:1.45;
font-weight:700;
}

.detail-event-body{
margin:16px 0 0;
color:#5f5870;
font-size:15px;
line-height:1.9;
font-weight:500;
}


/* --- Shop Detail Price Styles --- */
.detail-shop-card{
margin-bottom:28px;
padding:28px;
border-radius:18px;
background:var(--color-white);
box-shadow:var(--shadow-card);
}

.detail-shop-description{
margin:0 0 22px;
color:#5f5870;
font-size:15px;
line-height:1.9;
}

.detail-shop-list{
margin:0;
border:1px solid #ece8f2;
border-radius:14px;
overflow:hidden;
}

.detail-shop-list_item{
padding:18px 20px;
display:grid;
grid-template-columns:140px minmax(0,1fr);
gap:24px;
border-bottom:1px solid #ece8f2;
}

.detail-shop-list_item:last-child{
border-bottom:0;
}

.detail-shop-list_item dt{
color:var(--color-main);
font-weight:700;
}

.detail-shop-list_item dd{
margin:0;
color:#6f6982;
overflow-wrap:anywhere;
}

.detail-shop-list_item a{
color:var(--color-purple);
text-decoration:underline;
text-underline-offset:3px;
}

.detail-shop-sns{
margin-top:22px;
display:flex;
gap:12px;
flex-wrap:wrap;
}

.detail-shop-sns_link{
min-height:44px;
padding:7px 14px 7px 8px;
display:inline-flex;
align-items:center;
gap:9px;
color:var(--color-main);
border:1px solid #ece8f2;
border-radius:999px;
background:#fff;
font-size:13px;
font-weight:700;
text-decoration:none;
}

.detail-shop-sns_icon{
width:30px;
height:30px;
display:inline-flex;
align-items:center;
justify-content:center;
flex:0 0 30px;
color:#fff;
background:#181818;
border-radius:50%;
font-size:11px;
line-height:1;
}

.detail-shop-sns_link.is-instagram .detail-shop-sns_icon{
background:linear-gradient(135deg,#7b2cff,#ff2f7d,#ff9d2f);
}

.detail-shop-sns_link.is-tiktok .detail-shop-sns_icon{
background:#111;
}

.detail-shop-sns_link.is-line .detail-shop-sns_icon{
background:#06c755;
}

.detail-price-title{
margin:0 0 16px;
color:var(--color-main);
font-size:22px;
line-height:1.45;
}

.detail-price-card{
padding:28px;
border-radius:18px;
background:var(--color-white);
box-shadow:var(--shadow-card);
}

.detail-price-section + .detail-price-section{
margin-top:30px;
}

.detail-price-section_head{
margin-bottom:14px;
padding:14px 18px;
border:1px solid #eee8f6;
border-radius:12px;
background:linear-gradient(135deg,#f8f5ff 0%,#fff3f9 100%);
}

.detail-price-section_title{
margin:0;
color:var(--color-main);
font-size:20px;
line-height:1.45;
font-weight:700;
}

.detail-price-section_subtitle{
margin:5px 0 0;
color:#8f8aa3;
font-size:13px;
line-height:1.7;
}

.detail-price-card dl.detail-price-list{
margin:0;
border:1px solid #ece8f2;
border-radius:14px;
background:#fff;
overflow:hidden;
}

.detail-price-list_item{
display:grid;
grid-template-columns:minmax(150px,.85fr) minmax(0,2fr);
gap:24px;
align-items:start;
padding:20px;
border-bottom:1px solid #ece8f2;
}

.detail-price-list_item:last-child{
border-bottom:0;
}

.detail-price-list_item dt{
margin:0;
color:var(--color-main);
font-size:15px;
line-height:1.6;
font-weight:700;
}

.detail-price-list_item dd{
min-width:0;
margin:0;
}

.detail-price-list_price{
margin:0;
color:#6f6982;
font-size:16px;
line-height:1.6;
font-weight:700;
overflow-wrap:anywhere;
}

.detail-price-list_note{
margin:5px 0 0;
color:#8f8aa3;
font-size:13px;
line-height:1.7;
}

@media screen and (max-width:700px){

.detail-shop-card{
padding:18px;
}

.detail-shop-list_item{
grid-template-columns:110px minmax(0,1fr);
gap:12px;
padding:15px;
}

.detail-price-card{
padding:18px;
}

.detail-price-list_item{
grid-template-columns:1fr;
gap:8px;
padding:16px;
}

.detail-price-section_head{
padding:12px 14px;
}

.detail-price-section_title{
font-size:18px;
}

}
