/*
Theme Name: cws-gr-jp-2025
Text Domain: cws-gr-jp-2025
Version: 1.0
Tested up to: 6.5
Requires at least: 4.7
Requires PHP: 5.2.4
Description: 
Author: Chishiro Wind Symphonica
Author URI: https://www.cws.gr.jp/
*/
@charset "UTF-8";

/*reset*/
*,*::before,*::after {
margin:0;
padding:0;
box-sizing:border-box
}
:where([hidden]:not([hidden='until-found'])) {
display:none!important
}
:where(html) {
-webkit-text-size-adjust: none;
color-scheme: dark light;
tab-size: 2;
scrollbar-gutter: stable
}
@media (prefers-reduced-motion:no-preference) {
:where(html:focus-within){
scroll-behavior: smooth
}
}
:where(body) {
line-height: 1.5;
font-family: system-ui,sans-serif;
-webkit-font-smoothing:antialiased
}
:where(button) {
all:unset
}
:where(input,button,textarea,select) {
font:inherit;
color:inherit
}
:where(textarea) {
resize:vertical;
resize:block
}
:where(button,label,select,summary,[role='button'],[role='option']) {
cursor:pointer
}
:where(:disabled) {
cursor:not-allowed
}
:where(label:has(>input:disabled),label:has(+input:disabled)) {
cursor:not-allowed
}
:where(a) {
color:inherit;
text-underline-offset:.2ex
}
:where(ul,ol){
list-style:none
}
:where(img,svg,video,canvas,audio,iframe,embed,object) {
display:block
}
:where(img,picture,svg,video) {
max-inline-size:100%;
block-size:auto
}
:where(p,h1,h2,h3,h4,h5,h6) {
overflow-wrap:break-word
}
:where(h1,h2,h3) {
line-height:calc(1em + 0.5rem);
text-wrap:balance
}
:where(hr) {
border:none;
border-block-start:1px solid;
color:inherit;block-size:0;
overflow:visible
}
:where(dialog) {
border:none;
background:none;
inset:unset;
max-width:unset;
max-height:unset
}
:where(dialog:not([open])) {
display:none!important
}
:where(:focus-visible) {
outline:3px solid CanvasText;
box-shadow:0 0 0 5px Canvas;
outline-offset:1px
}
:where(:focus-visible,:target) {
scroll-margin-block:8vh
}
:where(.visually-hidden:not(:focus-within,:active)) {
clip-path:inset(50%)!important;
height:1px!important;
width:1px!important;
overflow:hidden!important;
position:absolute!important;
white-space:nowrap!important;
border:0!important
}
/*reset-end*/

:root {
--header-height-offset: var(--header-height);
}

html {
line-height: 1.5em;
text-size-adjust: none;
}

a {
color: #061;
text-decoration: none;
}

a:hover {
color: #393;
}

body {
font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", Meiryo, sans-serif;
color: #333;
min-height: 100vh;
min-height: 100svh;
}

header {
display: flex;
flex-direction: column;
justify-content: center;
align-content: flex-start;
flex-wrap: wrap;
width: 100%;
height: var(--header-height);
background-color: rgba(255,255,255,0.9);
box-shadow: 0px 2px 8px rgba(0,0,0,0.1);
margin-bottom: 1rem;
z-index: 2;
}

body::before {
content: "";
position: absolute;
width: 100%;
top: var(--header-height-offset);
background-color: #093;
}

h1 {
position: absolute;
top: var(--header-height-offset);
line-height: 200%;
color: #fff;
}

.eye-catch-image {
max-inline-size: none;
object-fit: cover;
}

p#site-name {
font-weight: bold;
}

header a#main-logo {
order: -1;
height: var(--header-height);
}

header a#main-logo:hover img {
opacity: 0.75;
animation-name: bounce;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}

header nav ul {
list-style: none;
font-weight: bold;
}

header nav ul a {
display: inline-block;
}

main {
margin: 1rem auto;
background-color: #fff;
overflow: hidden;
}

main section+section {
margin-top: 1.5rem;
border-top: solid 1px #eee;
padding-top: 1.5rem;
}

main h2 {
color: #555;
font-size: 1.2rem;
margin-bottom: 0.5rem;
}

main :is(p, ul, dl)+h2 {
margin-top: 1.25rem;
}

main h3 {
color: #555;
font-size: 1.2rem;
margin-bottom: 0.5rem;
}

main :is(p, ul, dl)+h3 {
margin-top: 1.25rem;
}

main p {
margin-top: 0.5rem;
font-size: 1rem;
text-align: justify;
line-break: strict;
}

main * a {
text-decoration-line: underline;
text-decoration-style: dotted;
text-decoration-color: rgb(0 153 51 / 25%);
}

main * a:hover {
text-decoration-style: solid;
text-decoration-color: currentcolor;
}

main .eye-catch-caption {
position: absolute;
font-weight: bold;
color: #fff;
font-feature-settings: "palt" 1;
text-shadow: 0 0 0.25rem #000, 0 0 0.5rem #000, 0 0 1rem #000;
}

main .lead {
font-size: 1rem;
font-weight: bold;
color: #666;
margin-top: 0;
margin-bottom: 1.5rem;
border-bottom: solid 1px #eee;
padding-bottom: 1.5rem;
}

main figure {
position: relative;
margin: 1rem 0;
}

main figcaption {
position: absolute;
left: 0.25rem;
bottom: 0.25rem;
max-width: calc(100% - 0.5rem);
background-color: rgba(0, 0, 0, 0.75);
border-radius: 0.25rem;
color: #fff;
}

main ul {
margin-top: 0.5rem;
}

main ul li {
margin: 0.5rem 0 0.5rem 1rem;
text-indent: -1rem;
}

main ul li::before {
content: "";
display: inline-block;
width: 0.75rem;
height: 0.75rem;
margin-right: 0.25rem;
background-color: #ddd;
border-radius: 50%;
}

main dl {
margin-top: 0.5rem;
}

main dl dt {
font-weight: bold;
}

main dl dd {
font-size: 0.9rem;
padding-left: 0.25rem;
border-left: solid 0.4rem #ddd;
margin: 0.2rem 0 1rem 0.1rem;
}

main table {
font-size: 0.9rem;
background-color: #fff;
border-collapse: collapse;
}

main tr {
border: 1px solid #ccc;
}

main th, main td {
text-align: left;
vertical-align: middle;
}

main table th {
background-color: #eee;
text-wrap: nowrap;
}

main details {
margin-top: 1rem;
margin-bottom: 1rem;

}

main details summary {
font-weight: bold;
color: #666;

}

main details summary::marker {
color: #093;
font-size: 1.5rem;
line-height: 1rem;
}

main details p {
margin-left: 1.5rem;
}

main details p::before {

}


main .map {
width: 100%;
aspect-ratio: 16 / 9;
min-height: 5rem;
overflow: hidden;
}

main .map iframe {
height: calc(100% + 59px);
border: none;
margin-top: -59px;
}

main .meta {
font-size: 0.75rem;
margin: 0;
}

main .tags {
display: flex;
gap: 0.25rem;
}

main .tags li {
margin: 0;
text-indent: 0;
}

main .tags li::before {
content: none;
}

main .tags li a {
color: #fff;
background: #666;
display: inline-block;
padding: 0.2rem 0.25rem;
text-decoration: none;
}

main .tags li a:hover {
background: #999;
}

main .modified-time {
line-height: 150%;
color: #666;
}

main .information h2 {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 1.2rem;
line-height: 1rem;
text-transform: uppercase;
letter-spacing: 0.5rem;
margin-bottom: 1rem;
}

main .information-list {
color: #666;
}

main .information-list li {
margin: 0.75rem 0;
text-indent: 0;
}

main .information-list li::before {
content: none;
}

main .information-list li time {
margin-right: 0.5rem;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: bold;
}


main .ics-calendar {
position: relative;
}

main .ics-calendar li {
margin: 0;
text-indent: 0;
}

main .ics-calendar .ics-calendar-month-wrapper {
z-index: 0;
}

main .ics-calendar .ics-calendar-arrow-nav {
position:absolute;
right: 0;
display: grid;
grid: "prev today next";
grid-template-columns: 2rem 3rem 2rem;
gap: 0.25rem;
z-index: 1;
}

main .ics-calendar .ics-calendar-arrow-nav>* {
display: block;
box-shadow: 0.05rem 0.05rem 0.2rem  rgba(0, 0, 0, 0.25);
line-height: 1.5rem;
font-weight: bold;
text-decoration: none;
background: #fff;
border-radius: 0.25rem;
margin: 0;
font-size: 0.75rem;
text-align: center;

-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}

main .ics-calendar .ics-calendar-arrow-nav> .inactive {
display: none;
}

main .ics-calendar .ics-calendar-arrow-nav>*:hover {
color: #fff;
background: #093;
}

.prev-text,
.next-text {
display: none;
}

main .ics-calendar .ics-calendar-arrow-nav>.prev {
cursor: inherit;
grid-area: prev;
}

main .ics-calendar .ics-calendar-arrow-nav>.next {
cursor: inherit;
grid-area: next;
}

main .ics-calendar .ics-calendar-arrow-nav>.today {
cursor: inherit;
grid-area: today;
}

main .ics-calendar li::before {
content: none;
}

main .ics-calendar .ics-calendar-arrow-nav::after {
content: none;
}

.report-list {
margin-top: 1rem;
}

.report-list > section {
padding: 1rem;
background: #fff;
box-shadow: 2px 2px 12px -2px rgba(0, 0, 0, 0.25);
border-radius: 0.5rem;
}

.report-list > section figure {
width: 100%;
margin: 0 0 0.5rem;
}

.report-list > section h3 {
font-size: 0.9rem;
margin-bottom: 0rem;
}

.report-list > section p {
margin-top: 0rem;
font-size: 0.75rem;
}

.concert-info h2,
.other-info h2,
.latest-concert-info h2 {
position: static;
line-height: 120%;
padding-bottom: 0.25rem;
color: inherit;
border-bottom: solid 1px #093;
}

.concert-info .eye-catch-image,
.other-info .eye-catch-image,
.archive-entry .eye-catch-image {
object-fit: contain;
}

.latest-concert-info figure {
margin-top: 0;
}

.latest-concert-info figure {
margin-top: 0;
}


.index .latest-concert-info figure {
width: 50%;
}

.concert .latest-concert-info figure {

}

.archive-entry+.archive-entry {
margin-top: 1.5rem;
border-top: solid 1px #eee;
padding-top: 1.5rem;
}

.archive-entry .release-date {
margin-top: 0.25rem;
}

.future-concert-list {
border-left: solid 0.5rem #eee;
padding-left: 0.5rem;
}

.future-concert-list h3 {
margin-bottom: 0.25rem;
}

.future-concert-list p {
font-size: 0.75rem;
margin-top: 0.25rem;
}

.member-list table td {
text-align: right;
}

.wpcf7 {
margin-top: 1.5rem;
border-top: solid 1px #eee;
padding-top: 1.5rem;
}

main form {

}

main label {
position: relative;
font-weight: bold;
font-size: 0.75rem;
color: #333;
}

main label .sup {
font-weight: normal;
margin-left: 0.5rem;
}

.wpcf7-not-valid-tip {
position: absolute;
top: -2.25rem;
right: 0;
}

main input[type="text"],
main input[type="email"],
textarea {
font-size: 0.9rem;
font-weight: normal;
width: 100%;
padding: 0.5rem;
margin: 0.25rem 0;
border: 1px solid #ccc;
border-radius: 0.25rem;
box-sizing: border-box;
background: #fff;
}

main input[type="radio"],
main input[type="checkbox"] {
display: inline-block;
accent-color: #093;
margin: 0 0 1rem 0;
padding: 0;
}

main input[type="radio"] {
appearance: none;
}

main input[type="radio"]::before {
content : "◯";
margin-right: 0.25rem;
}

main input[type="radio"]:checked::before {
content : "●";
margin-right: 0.25rem;
}

main label:has(input[type="radio"]) {
font-size: 0.75rem;
font-weight: bold;
color: #999;
margin: 1rem 0 2rem;
border: 1px solid #999;
padding: 0.75rem;
border-radius: 1.5rem;
}

main label:has(input[type="radio"]:checked) {
color: #fff;
background: #093;
border-color: #093;
}

main label:has(input[type="radio"]):hover {
color: #fff;
background: #082;
border-color: #082;
}

main .wpcf7-list-item + .wpcf7-list-item {
margin-left: 0.75rem;
}

main select {
width: 100%;
padding: 0.5rem;
margin: 0.25rem 0;
border: 1px solid #ccc;
padding: 0.5rem;
font-weight: normal;
height: 2rem;
color: #333;
background: #fff;
}

main textarea {
resize: vertical;
min-height: 4rem;
}

main input[type="submit"] {
border: 0;
border-radius: 0.25rem;
appearance: none;
padding: 0.75rem 1rem 0.75rem 2rem;
margin: 0.5rem 0;
color: #fff;
background: #093;
font-weight: bold;
letter-spacing: 1rem;
text-align: center;
}

input[type="submit"]:hover {
background: #082;
}

input[type="submit"]:active {
background: #f00;
}

.wpcf7-response-output {

}

main .wpcf7-list-item {
margin: 0;
}

main .wpcf7-list-item-label::before,
main .wpcf7-list-item-label::after {
content: none;
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible {
outline: 3px solid #093;
box-shadow: none;
outline-offset: 1px;
}


footer {
position: sticky;
top: 100%;
width: 100%;
padding: 0.5rem 0;
background-color: #093;
}

footer address {
display: flex;
flex-direction: column;
justify-content: center;
flex-wrap: wrap;
font-style: normal;
color: rgba(255, 255, 255, 1);
font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-weight: bold;
}

footer address ul {
display: flex;
margin-top: 0.5rem;
}

footer address ul li {
height: auto;
margin-right: 1rem;
font-size: 0.9rem;
line-height: 1.5rem;
}

footer address a {
opacity: 0.8;
color: #fff;
}

footer address a:hover {
opacity: 1;
color: #fff;
}

footer address ul li img {
display: inline-block;
}

footer address a:hover img {
transform: scale(1.2);
transform-origin: center;
transition: 0.2s ease-in-out 0s;
}

footer p#copyright {
font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-style: normal;
color: rgba(255, 255, 255, 0.75);
}

@keyframes bounce {
0% {transform: translateY(0);}
25% {transform: translateY(-0.5rem);}
50% {transform: translateY(0);}
100% {transform: translateY(0);}
}