@charset "UTF-8";
/* スマートフォン用スタイル */
@media (max-width: 767px) {

/* 
セクション間余白
----------------------------------------------------------- */
section {padding: 30px 0;}
footer {padding: 30px 0;}
/* index */
.index .sec01 {padding: 30px 0 0;}
.index .sec02 {padding: 15px 0 0;}
.index .sec03 {padding: 30px 0 0;}
.index .sec05 {padding: 0 0 30px;}
/* backcover */
.backcover .sec01 {padding: 30px 0 0;}
.backcover .sec02 {padding: 30px 0 0;}
.backcover .sec03 {padding: 30px 0;}
/* cover */
.cover .sec01 {padding: 30px 0 0;}
.cover .sec02 {padding: 0 0 30px;}
/* tsunokids */
.tsunokids .sec01 {padding: 30px 0 0;}
/* tsunohug */
.tsunohug .sec01 {padding: 30px 0 0;}
.tsunohug .sec02 {padding: 30px 0 0;}
.tsunohug .sec03 {padding: 30px 0 0;}
.tsunohug .sec04 {padding: 30px 0 0;}
.tsunohug .sec05 {padding: 30px 0 0;}
.tsunohug .sec06 {padding: 30px 0;}
/* coac */
.coac .sec01 {padding: 30px 0 0;}
.coac .sec02 {padding: 0 0 30px;}
.coac .sec03 {padding: 0 0 30px;}
/* shc */
.shc .sec01 {padding: 30px 0 0;}
.shc .sec02 {padding: 30px 0 0;}
.shc .sec03 {padding: 30px 0;}

/* common-button */
/* はみ出し対策 */
.sp-scroll {
    width: 100%;
    overflow-x: scroll;
}
.sp-scroll > * {
    min-width: 768px;
}

/*
left-area
----------------------------------------------------------- */
.left-area {
    display: none;
}

/*
right-area
----------------------------------------------------------- */
.right-area {
    width: 100%;
}

/*
メインビジュアル
----------------------------------------------------------- */

/*
index
----------------------------------------------------------- */
.index .fbox { --grid-gap: 30px; }
.info-date {
    margin-right: 0px;
}
.info-cat {
    margin-right: 0px;
}
.info-ttl {
    width: 100%;
}
/*
Topics & Event Report
----------------------------------------------------------- */
.topics .sec01 .topics-list,
.eventreport .sec01 .eventreport-list {
    padding-bottom: 30px;
}
.info-item a,
.topics .sec01 .topics-content a,
.eventreport .sec01 .eventreport-content a {
    flex-wrap: wrap;
}

/*
Topic List & Event List
----------------------------------------------------------- */
.topics .sec01,
.tplist .sec01,
.eventreport .sec01,
.evlist .sec01 {
    padding: 30px 0 0;
}
.tplist .sec01 h3,
.evlist .sec01 h3 {
    font-size: 1.2em;
    margin-bottom: 30px;
}
.tplist .sec01 .tplist-top-img,
.evlist .sec01 .evlist-top-img {
    float: none;
    padding: 0 0 30px 0;
    width: 100%;
}
.tplist .sec01 h4,
.evlist .sec01 h4 {
    font-size: 1.1em;
    margin-bottom: 15px;
}
.tplist .sec01 h5,
.evlist .sec01 h5 {
    font-size: 1em;
    margin-bottom: 15px;
}
.tplist-name,
.evlist-name {
    font-size: 1.1em;
}
.evlist .sec01 .evlist-box .fbox-3 > * {
    width: 100%;
}

/*
tsunokids
----------------------------------------------------------- */
.tsunokids .sec01 h3 {
    font-size: 1.2em;
    margin-bottom: 30px;
}
.tsunokids .sec01 .sec01-top-img,
.tsunokids .sec01 .sec01-top-txt,
.tsunokids .sec01 .sec01-btm-area-ttl,
.tsunokids .sec01 .sec01-btm-area-txt {
    width: 100%;
}
.tsunokids .sec01 .sec01-name {
    font-size: 1.1em;
}
.tsunokids .sec01 .sec01-btm-area {
    padding: 15px;
}
.tsunokids .sec01 h4 {
    font-size: 1.2em;
}
/*
Commendation
----------------------------------------------------------- */
.commendation .sec01 .sec01-btm-txt {
    padding: 15px;
    font-size: 1em;
}
.award-section {
    margin-bottom: 30px;
}
.school-title {
    font-size: 1.8rem;
}
.tournament-title {
    font-size: 1.5rem;
}
.category {
    font-size: 1.3rem;
}
.winner-name {
    font-size: 1.5rem;
}
.name-reading {
    font-size: 1.3rem;
}
.grade {
    font-size: 1.2rem;
}
.address {
    font-size: 1.3rem;
}
/*
cover
----------------------------------------------------------- */
body.cover .mh-sticky {
    width: 100vw;
    left: 0;
    margin-left: 0;
}
body.cover #mh-canvas {
    width: 100% !important;
    height: 100% !important;
    left: 0 !important;
    right: 0 !important;
}

/*
Back Cover
----------------------------------------------------------- */
.bc-ttl {
    font-size: 1.8rem;
}
.backcover .introduction .fbox {
    gap: 30px;
}
.catch-title-inner {
    font-size: 2rem;
}

/*
tsunohugはここから
----------------------------------------------------------- */
.tsunohug .sec-head {
    margin-bottom: 30px;
}
.tsunohug .sub-head {
    display: block;
    width: 100%;
    text-align: center;
}
.tsunohug .sec05 .event-box .fbox-3 > * {
    width: calc(50% - var(--grid-gap) / 2);
}
.tsunohug .sec06 .btm-box-ttl {
    width: 100%;
}
.tsunohug .sec06 .btm-box-txt {
    width: 100%;
}
.tsunohug .sec04 .white-box .nb-ttl {
    margin-bottom: 0px;
}
.tsunohug .sec04 .white-box .fbox {
    gap: 5px;
}

/*
comwelfareはここから
----------------------------------------------------------- */
.cw-sec-ttl {
    position: absolute;
    top: -10px;
    font-size: 2.4rem;
    font-weight: bold;
    color: white;
    text-shadow: 
        2px 2px 0 #00b097,
        -2px -2px 0 #00b097,
        2px -2px 0 #00b097,
        -2px 2px 0 #00b097,
        1px 1px 0 #00b097,
        -1px -1px 0 #00b097,
        1px -1px 0 #00b097,
        -1px 1px 0 #00b097;
}

/*
coac
----------------------------------------------------------- */
/* ヒーローテキスト */
#text-hero { bottom: auto; top: 12vh; left: 20px; right: 20px; }
.hero-title {
    font-size: clamp(36px, 10vw, 58px);
    letter-spacing: 4px;
}
.hero-title .gold {
    font-size: 0.45em;
    letter-spacing: 4px;
}
.hero-year { font-size: 10px; letter-spacing: 3px; }

/* スクロールヒント */
.scroll-hint { right: 20px; bottom: 12vh; }

/* section-text（s2・s3） */
#text-s2 { right: 20px; left: auto; max-width: 60%; }
#text-s3 { left: 20px; right: 20px; max-width: 100%; }
.section-heading { font-size: clamp(22px, 6vw, 32px); }
.section-body { font-size: 11px; }

/* text-s4 */
#text-s4 { bottom: 14vh; width: 90%; }
.big-message { font-size: clamp(18px, 5vw, 28px); letter-spacing: 3px; }

/* カスタムカーソルをタッチデバイスで非表示 */
@media (hover: none) or (pointer: coarse) {
    body.coac { cursor: auto; }
    #cursor,
    #cursor-ring { display: none !important; }
}
.hdfont-ttl-white {
    font-size: 1.2em;
}
.coac .sec03-box {
    aspect-ratio: unset;
    background-size: 100% 100%;
    min-height: 0;
}
.coac .sec03-box ul {
    position: static;
    padding: 60px 20px 30px;
    max-width: 100%;
}
.coac .sec03-box::before {
z-index: 0;  /* ← 追加 */
}
.coac .sec03-box ul {
    position: relative;
    z-index: 1;  /* ← 追加 */
}
.coac .flex-item {
    flex-direction: column;
    align-items: center;
}
.coac .sec04 .sb-img {
    width: 50%;
}
.coac .sec04 .sb-txt {
    width: 100%;
}
.coac .sec04 .sb-txt p {
    padding: 15px;
    font-size: 1.4rem;
}
.coac .sec04 .sb-txt p::before {
    content: '';
    position: absolute;
    top: -18px;
    left: 50%;
    transform: translateX(-50%);
    border: 9px solid transparent;
    border-bottom-color: #8f82bc;
}
.coac .sec04 .sb-txt p::after {
    content: '';
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    border: 8px solid transparent;
    border-bottom-color: #fff;
}
.coac .match-height-group1 {
    height: 180px !important;
}
.coac .match-height-group1 img {
    width: 30%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}
.coac .coac-theater .swiper-slide {
    width: 280px;
    height: 196px;
}
#deco-canvas,
.right-area-bg {
    max-width: 100%;
}
/*
shc
----------------------------------------------------------- */
.shc .sec02-map-north {
    position: absolute;
    top: 10px;
    left: 10%;
    width: 10%;
    z-index: 1;
}
.shc .sec02-map-label {
    width: 100px;
}
.shc .comment-box {
    padding: 15px;
    flex-direction: column;
    text-align: justify;
    align-items: center;
}
.shc .closing-sb::after {
    top: auto;
    top: -22px;
    right: 50%;
    transform: translateX(50%) rotate(-180deg);
    border-left-color: transparent;
    border-top-color: #f5c842;
}
.shc .closing-illust img {
    max-width: 160px;
}
.sp-br {
    display: block;
}

}/* スマートフォン用スタイルend */