ul,
ol { margin: 0; padding: 0;}
ul li { list-style-type: none;}
body{ margin: 0;}

:root {
    --default-font: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    --base-font: /*"Hiragino Kaku Gothic Std",*/ "Hiragino Kaku Gothic Pro", "Yu Gothic Medium", "Hiragino Sans", "游ゴシック Medium", YuGothic, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    
    --black: #000;
    --gray: #888888;
    --lightgray: #E6E6E6;
    --darkgray: #242424;
} 

#wrapContainer{ font-family: var(--base-font); background: var(--black); min-width: 1300px; line-height: 1.6;}
#wrapContainer p{ line-height: 1.8; font-weight: normal; -webkit-font-smoothing: antialiased;}
#wrapContainer img{ max-width: 100%; height: auto; -webkit-font-smoothing: antialiased;}
#wrapContainer li{ font-weight: normal; -webkit-font-smoothing: antialiased;}


/*-- MAIN --*/
#wrapContainer .main{ background: url("../img/bg-mv-pc.webp") no-repeat center top; background-size: max(100%, 1920px) auto; background-color: #242424; box-sizing: border-box; padding-bottom: 80px;}
#wrapContainer .main .contentHeadBox{ background: rgba(0, 0, 0, 0.4); padding: 80px 0; display: flex; justify-content: center; width: 100%; flex-wrap: wrap; gap: 40px; align-items: top; margin: 0 auto 85px;}
#wrapContainer .main h1{ margin: 0; width: 830px;}
#wrapContainer .main h1 .ja{ display: block; margin-bottom: 30px;}
#wrapContainer .main h1 .ja img{ display: block; max-width: 100%;}
#wrapContainer .main h1 .en{ display: block; padding: 15px 0; border-top: 1px solid var(--gray); border-bottom: 1px solid var(--gray);}
#wrapContainer .main h1 .en img{ display: block; max-width: 100%;}
#wrapContainer .main .mainLinkList{ width: 350px; display: flex; row-gap: 15px; flex-wrap: wrap;}
#wrapContainer .main .mainLinkList li{ width: 100%;}
#wrapContainer .main .mainLinkList li a{ display: block; background: #fff; color: var(--black); padding: 20px; text-align: center; font-size: 18px; text-decoration: none; font-weight: 600; position: relative;}
#wrapContainer .main .mainLinkList li a::after{ content: ""; display: block; width: 10px; height: 10px; position: absolute; top: calc(50% - 5px); right: 20px; border-top: 2px solid var(--black); border-right: 2px solid var(--black); transform: rotate(45deg)}

#wrapContainer .main .mainvisualBox{ display: flex; width: 100%; align-items: flex-start; justify-content: space-between;}
#wrapContainer .main .mainvisualBox .mainvisual{ width: calc(50% + 20px); height: 637px; overflow: hidden; margin: 10px 0 0;}
#wrapContainer .main .mainvisualBox .mainvisual img{ object-fit: cover; width: 100%; height: 100%;}
#wrapContainer .main .mainvisualBox .mainvisualText{ width: calc(50% - 100px);}
#wrapContainer .main .mainvisualBox .mainvisualText .innerMainvisualText{ width: 510px; margin: 0 auto 0 0;}
#wrapContainer .main .mainvisualBox .innerMainvisualText h2{ margin: 0 auto 35px; font-weight: 600; font-size: 28px; color: #fff; padding-bottom: 25px; border-bottom: 1px solid var(--gray); line-height: 1.6;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .lead{ color: #fff; font-size: 18px; font-weight: bold; margin: 0 auto 40px;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .year{ color: #fff; font-size: 24px; font-weight: bold; margin: 0 auto 20px;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList{ display: flex; flex-wrap: wrap; gap: 15px;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li{ width: 100%; border: 1px solid var(--gray); background: var(--black)}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBtn{ padding: 20px 65px 20px 25px; display: flex; cursor: pointer; position: relative; align-items: center; box-sizing: border-box; margin: 0;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBtn .round{ width: 120px; display: block; line-height: 1; min-height: 35px; display: flex; flex-direction: column; justify-content: center;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBtn .date{ font-size: 20px; color: #fff; font-weight: bold; display: block; line-height: 1; font-feature-settings: "palt"; letter-spacing: 0.05em; }
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBtn::after{ content: ""; display: block; width: 14px; height: 14px; border-bottom: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: calc(50% - 13px); right: 30px; transform: rotate(45deg); transition: all 0.5s;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBtn.active::after{ top: calc(50% - 8px); transform: rotate(-135deg)}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBox{ background: #fff; padding: 25px; box-sizing: border-box; display: none;}
#wrapContainer .linkList01{ font-size: 16px; display: flex; width: 100%; gap: 5px; flex-wrap: wrap; margin: 0 auto;}
#wrapContainer .linkList01 a{ color: var(--black); line-height: 1.8; text-decoration: none;}
#wrapContainer .linkList01 > li{ padding-left: 25px; position: relative; width: 100%;}
#wrapContainer .linkList01 > li::after{ content: ""; display: block; background: url("../img/arrow-rd.svg") no-repeat center center; width: 16px; height: 16px; background-size: 100%; position: absolute; top: calc(0.9em - 8px); left: 0;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .grayBox{ background: var(--lightgray); padding: 20px 25px; box-sizing: border-box; font-size: 16px; font-feature-settings: "palt"; letter-spacing: 0.05em; margin: 25px auto 0;}


/*-- CONTENT --*/
#wrapContainer .contentBox{ padding: 120px 0; box-sizing: border-box;}
#wrapContainer .contentBox.bgBlack{ background: var(--black)}
#wrapContainer .contentBox.bgGray{ background: var(--darkgray)}
#wrapContainer .contentBox.bgWhite{ background: #fff;}
#wrapContainer .contentBox .innerContent{ width: 1020px; margin: 0 auto;}
#wrapContainer .contentBox .sectionTtl{ margin: 0 auto 50px; width: 100%;}
#wrapContainer .contentBox .sectionTtl .en{ display: block; margin: 0 auto 30px;}
#wrapContainer .contentBox .sectionTtl .en img{ display: block; margin: 0 auto;}
#wrapContainer .contentBox .sectionTtl .ja{ font-size: 32px; text-align: center; display: block; font-weight: 600; color: #fff; }
#wrapContainer .contentBox .simpleTtl{ font-size: 32px; text-align: center; margin: 0 auto 40px; }
#wrapContainer .accordionBtn{ cursor: pointer;}
#wrapContainer .accordionBox{ display: none;}
#wrapContainer .contentText{ margin: 0 auto 60px; width: 960px; font-size: 18px; font-weight: 300; text-align: left; color: #fff;}


/*-- NEWS --*/
#wrapContainer .scrollBox{ overflow-y: auto; max-height: 300px; margin: 0 auto 60px;}
#wrapContainer .scrollBox .newsList{ border-top: 1px solid var(--gray); }
#wrapContainer .scrollBox .newsList li{ padding: 20px 30px; box-sizing: border-box; border-bottom: 1px solid var(--gray); display: flex; flex-wrap: wrap; color: #fff; font-size: 16px; }
#wrapContainer .scrollBox .newsList li a{color: #fff;}
#wrapContainer .scrollBox .newsList li .date{ width: 140px; margin: 0; }
#wrapContainer .scrollBox .newsList li .text{ width: calc(100% - 140px); margin: 0;}
#wrapContainer .btnList{ width: 100%; display: flex; gap: 30px; flex-wrap: wrap;}
#wrapContainer .btnList li{ width: 495px;}
#wrapContainer .btnList li a{ display: block; background: #fff; color: var(--black); padding: 20px; text-align: center; font-size: 24px; text-decoration: none; font-weight: 600; position: relative;}
#wrapContainer .btnList li a::after{ content: ""; display: block; width: 14px; height: 14px; position: absolute; top: calc(50% - 7px); right: 30px; border-top: 2px solid var(--black); border-right: 2px solid var(--black); transform: rotate(45deg)}


/*-- ABOUT --*/
#wrapContainer .wideAccordion{ width: 100%; background: var(--black)}
#wrapContainer .wideAccordion .accordionBtn{ font-size: 18px; padding: 30px; color: #fff; margin: 0; text-align: center; position: relative;}
#wrapContainer .wideAccordion .accordionBtn::after{ content: ""; display: block; width: 14px; height: 14px; border-bottom: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: calc(50% - 13px); right: 30px; transform: rotate(45deg); transition: all 0.5s; }
#wrapContainer .wideAccordion .accordionBtn.active::after{ top: calc(50% - 7px); transform: rotate(-135deg) }
#wrapContainer .wideAccordion .accordionBox{ padding: 0 30px 30px; box-sizing: border-box;}
#wrapContainer .wideAccordion .accordionBox p{ margin: 0; text-align: center; font-size: 18px; color: #fff;}
#wrapContainer .wideAccordion .accordionBox p:not(:last-child){ margin-bottom: 30px;}


/*-- FLOW --*/
#wrapContainer .flowNumList{ display: flex; gap: 70px; flex-wrap: wrap;}
#wrapContainer .flowNumList li{ display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; background: var(--darkgray); position: relative; width: 100%; box-sizing: border-box; padding: 30px;}
#wrapContainer .flowNumList li .arrow{ position: absolute; width: 30px; height: 40px; bottom: -55px; left: calc(50% - 15px);}
#wrapContainer .flowNumList li .arrow::before{ content: ""; display: block; width: 2px; height: calc(100% - 1px); background: #fff; position: absolute; top: 0; left: calc(50% - 1px);}
#wrapContainer .flowNumList li p{ margin: 0;}
#wrapContainer .flowNumList li .arrow::after{ content: ""; display: block; width: 20px; height: 20px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; position: absolute; bottom: 3px; left: calc(50% - 11px); transform: rotate(45deg);}
#wrapContainer .flowNumList li p{ margin: 0;}
#wrapContainer .flowNumList li .num{ width: 65px; line-height: 1;}
#wrapContainer .flowNumList li h3{ width: 230px; margin: 0; font-size: 20px; font-weight: 600; color: #fff;}
#wrapContainer .flowNumList li .textBox{ width: calc(100% - 65px - 230px);}
#wrapContainer .flowNumList li .textBox p{ color: #fff; font-size: 16px; margin: 0;}
#wrapContainer .flowNumList li .textBox a{ color: #fff; text-decoration: underline;}


/*-- SCHRDULE --*/
#wrapContainer .wideBtn{ width: 100%; margin: 0 auto;}
#wrapContainer .wideBtn a{ display: block; width: 100%; padding: 25px; text-align: center; font-size: 24px; position: relative; text-decoration: none; box-sizing: border-box;}
#wrapContainer .wideBtn a::after{ content: ""; display: block; width: 14px; height: 14px; position: absolute; top: calc(50% - 7px); right: 30px; transform: rotate(45deg)}
#wrapContainer .wideBtn.white a{ background: #fff; color: var(--black);}
#wrapContainer .wideBtn.white a::after{ border-top: 2px solid var(--black); border-right: 2px solid var(--black);}
#wrapContainer .wideBtn.bold{ font-weight: 600;}


/*-- CLASS --*/
#wrapContainer .bdrAccordionList{ border-top: 1px solid var(--gray);}
#wrapContainer .bdrAccordionList li{ border-bottom: 1px solid var(--gray);}
#wrapContainer .bdrAccordionList li .accordionBtn{ font-size: 20px; padding: 25px 30px; color: #fff; margin: 0; text-align: left; position: relative; font-weight: 600; }
#wrapContainer .bdrAccordionList li .accordionBtn span.nobold{ font-weight: normal; }
#wrapContainer .bdrAccordionList li .accordionBtn::after{ content: ""; display: block; width: 14px; height: 14px; border-bottom: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: calc(50% - 13px); right: 30px; transform: rotate(45deg); transition: all 0.5s; }
#wrapContainer .bdrAccordionList li .accordionBtn.active::after{ top: calc(50% - 8px); transform: rotate(-135deg) }
#wrapContainer .bdrAccordionList li .accordionBox{ font-size: 16px; color: #fff; padding: 0 30px 25px; box-sizing: border-box;}


/*-- LINK --*/
#wrapContainer #link{ padding: 80px 0;}
#wrapContainer .simpleBtnList{ width: 100%; display: flex; gap: 30px; flex-wrap: wrap;}
#wrapContainer .simpleBtnList li{ width: 320px;}
#wrapContainer .simpleBtnList.BtnCol2 li{ width: 495px;}
#wrapContainer .simpleBtnList li a{ display: block; background: var(--black); color: #fff; font-size: 18px; font-weight: 300; padding: 20px; text-align: center; text-decoration: none;}


/*-- BREADCRUMBS --*/
.breadcrumbs .l-container{ padding-top: 20px; position: relative; margin-bottom: 40px;}
.breadcrumbs .l-container::before{ background: #dfdfdf; content: ''; display: block; height: 1px; max-width: 1220px; position: absolute; top: 0px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: calc(100% - 40px);
}
.breadcrumbs-list{ display: -webkit-box; display: flex; flex-wrap: wrap; font-family: var(--default-font); width: 1220px; margin: 0 auto;}
.breadcrumbs-item{ display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; letter-spacing: 0.06em; line-height: 2; font-size: 12px;}
.breadcrumbs-item:last-child{ font-weight: bold;}
.breadcrumbs-item:not(:last-child):after{ content: ''; display: block; position: relative; border-bottom: 1px solid #6a6969; border-right: 1px solid #6a6969; -webkit-transform: rotate(-45deg) skew(10deg, 10deg); transform: rotate(-45deg) skew(10deg, 10deg); width: 10px; height: 10px; margin: 0 15px;}
.breadcrumbs-link { color: #12290f; text-decoration: none;}
/*-- NOTE --*/
.note-list{ display: -webkit-box; font-family: var(--default-font); width: 1220px; margin: 0 auto 100px auto;}
.note-item{ display: -webkit-box; -webkit-box-align: center; align-items: center; letter-spacing: 0.06em; line-height: 2; font-size: 12px;}


@media screen and (min-width: 750px){
#wrapContainer .sp{ display: none !important;}
    
#wrapContainer a{ transition: opacity 0.5s;}
#wrapContainer a:hover{ opacity: 0.8;}
}

@media screen and (max-width: 749px){
#wrapContainer .pc{ display: none !important;}
    
:root {
    --comp-540: 72.9729729729729vw;
    --comp-460: 62.1621621621621vw;
    --comp-420: 56.7567567567567vw;
    --comp-380: 51.3513513513513vw;
    
    --comp-200: 27.027027027027vw;
    --comp-195: 26.3513513513513vw;
    --comp-190: 25.6756756756756vw;
    --comp-185: 25vw;
    --comp-180: 24.3243243243243vw;
    --comp-175: 23.6486486486486vw;
    --comp-170: 22.9729729729729vw;
    --comp-165: 22.2972972972972vw;
    --comp-160: 21.6216216216216vw;
    --comp-155: 20.9459459459459vw;
    --comp-150: 20.2702702702702vw;
    --comp-145: 19.5945945945945vw;
    --comp-140: 18.9189189189189vw;
    --comp-135: 18.2432432432432vw;
    --comp-130: 17.5675675675675vw;
    --comp-125: 16.8918918918918vw;
    --comp-120: 16.2162162162162vw;
    --comp-115: 15.5405405405405vw;
    --comp-110: 14.8648648648648vw;
    --comp-105: 14.1891891891891vw;
    --comp-100: 13.5135135135135vw;
    --comp-95: 12.83783783783783vw;
    --comp-90: 12.1621621621621vw;
    --comp-85: 11.48648648648648vw;
    --comp-80: 10.8108108108108vw;
    --comp-75: 10.13513513513513vw;
    --comp-70: 9.459459459459459vw;
    --comp-65: 8.738738738738738vw;
    --comp-60: 8.108108108108108vw;
    --comp-55: 7.432432432432432vw;
    --comp-50: 6.756756756756756vw;
    --comp-45: 6.081081081081081vw;
    --comp-40: 5.405405405405405vw;
    --comp-35: 4.729729729729729vw;
    --comp-30: 4.054054054054054vw;
    --comp-25: 3.378378378378378vw;
    --comp-20: 2.702702702702702vw;
    --comp-15: 2.027027027027027vw;
    --comp-10: 1.351351351351351vw;
    --comp-5: 0.6756756756756756vw;
    
    --comp-38: 5.135135135135135vw;
    --comp-36: 4.864864864864864vw;
    --comp-32: 4.324324324324324vw;
    --comp-28: 3.783783783783783vw;
    --comp-26: 3.513513513513513vw;
    --comp-24: 3.243243243243243vw;
    --comp-22: 2.972972972972972vw;
    --comp-19: 2.567567567567567vw;
    --comp-18: 2.432432432432432vw;
    --comp-16: 2.162162162162162vw;
    --comp-13: 1.756756756756756vw;
    --comp-12: 1.621621621621621vw;
    --comp-9: 1.2162162162162162vw;
}
    
    
#wrapContainer{ font-family: var(--base-font); background: var(--black); min-width: 90%; line-height: 1.6;}
#wrapContainer p{ line-height: 1.8; font-weight: normal;}
#wrapContainer img{ max-width: 100%; height: auto;}


/*-- MAIN --*/
#wrapContainer .main{ background: url("../img/bg-mv-sp.webp") no-repeat center top; background-size: 100% auto; background-color: #242424; box-sizing: border-box; padding-bottom: var(--comp-80);}
#wrapContainer .main .contentHeadBox{ background: rgba(0, 0, 0, 0.4); padding: var(--comp-75) 0 var(--comp-80); display: block; width: 100%; margin: 0 auto var(--comp-80);}
#wrapContainer .main h1{ margin: 0 auto var(--comp-40); width: 90%;}
#wrapContainer .main h1 .ja{ display: block; margin-bottom: var(--comp-30);}
#wrapContainer .main h1 .ja img{ display: block; max-width: 100%; width: 88% /*タイトル文字ごとに変更してください*/}
#wrapContainer .main h1 .en{ display: block; padding: var(--comp-15) 0; border-top: 1px solid var(--gray); border-bottom: 1px solid var(--gray);}
#wrapContainer .main h1 .en img{ display: block; max-width: 100%; width: 86.7647058% /*タイトル文字ごとに変更してください*/}
#wrapContainer .main .mainLinkList{ width: 90%; margin: 0 auto; display: flex; row-gap: 0; flex-wrap: wrap; justify-content: space-between;}
#wrapContainer .main .mainLinkList li{ width: 48.5%;}
#wrapContainer .main .mainLinkList li a{ display: block; background: #fff; color: var(--black); padding: var(--comp-20) var(--comp-15) var(--comp-20) 0; text-align: center; font-size: var(--comp-20); text-decoration: none; font-weight: 600; position: relative; font-feature-settings: "palt"; letter-spacing: 0.05em;}
#wrapContainer .main .mainLinkList li a::after{ content: ""; display: block; width: var(--comp-10); height: var(--comp-10); position: absolute; top: calc(50% - var(--comp-5)); right: var(--comp-15); border-top: 2px solid var(--black); border-right: 2px solid var(--black); transform: rotate(45deg)}
#wrapContainer .main .mainLinkList li:last-child{ width: 100%; margin-top: var(--comp-20);}

#wrapContainer .main .mainvisualBox{ display: block; width: 100%;}
#wrapContainer .main .mainvisualBox .mainvisual{ width: 90%; height: auto; overflow: hidden; margin: 0 auto var(--comp-90)}
#wrapContainer .main .mainvisualBox .mainvisual img{ object-fit: contain; width: 100%; height: auto;}
#wrapContainer .main .mainvisualBox .mainvisualText{ width: 90%; margin: 0 auto;}
#wrapContainer .main .mainvisualBox .mainvisualText .innerMainvisualText{ width: 100%; margin: 0 auto;}
#wrapContainer .main .mainvisualBox .innerMainvisualText h2{ margin: 0 auto var(--comp-30); font-weight: 600; font-size: var(--comp-36); color: #fff; padding-bottom: var(--comp-30); border-bottom: 1px solid var(--gray); line-height: 1.6;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .lead{ color: #fff; font-size: var(--comp-24); font-weight: bold; margin: 0 auto var(--comp-60);}
#wrapContainer .main .mainvisualBox .innerMainvisualText .year{ color: #fff; font-size: var(--comp-26); font-weight: bold; margin: 0 auto var(--comp-30);}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList{ display: flex; flex-wrap: wrap; gap: var(--comp-30);}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li{ width: 100%; border: 1px solid var(--gray); background: var(--black)}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBtn{ padding: var(--comp-25) var(--comp-80) var(--comp-25) var(--comp-25); display: flex; cursor: pointer; position: relative; align-items: center; box-sizing: border-box; margin: 0;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBtn .round{ width: 16vw; display: block; line-height: 1; min-height: auto; display: flex; flex-direction: column; justify-content: center; margin-right: var(--comp-25)}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBtn .date{ font-size: var(--comp-26); color: #fff; font-weight: bold; display: block; line-height: 1; font-feature-settings: "palt"; letter-spacing: 0.05em; }
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBtn::after{ content: ""; display: block; width: var(--comp-18); height: var(--comp-18); border-bottom: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: calc(50% - var(--comp-20) + 1px); right: var(--comp-25); transform: rotate(45deg); transition: all 0.5s;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBtn.active::after{ top: calc(50% - var(--comp-10) * 1px); transform: rotate(-135deg)}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .accordionBox{ background: #fff; padding: var(--comp-25); box-sizing: border-box; display: none;}
#wrapContainer .linkList01{ font-size: var(--comp-24); display: flex; width: 100%; gap: var(--comp-5); flex-wrap: wrap; margin: 0 auto;}
#wrapContainer .linkList01 a{ color: var(--black); line-height: 1.8; text-decoration: none;}
#wrapContainer .linkList01 > li{ padding-left: var(--comp-30); position: relative; width: 100%;}
#wrapContainer .linkList01 > li::after{ content: ""; display: block; background: url("../img/arrow-rd.svg") no-repeat center center; width: var(--comp-24); height: var(--comp-24); background-size: 100%; position: absolute; top: calc(0.9em - var(--comp-12)); left: 0;}
#wrapContainer .main .mainvisualBox .innerMainvisualText .mainAccordionList > li .grayBox{ background: var(--lightgray); padding: var(--comp-30) var(--comp-35); box-sizing: border-box; font-size: var(--comp-24); font-feature-settings: "palt"; letter-spacing: 0.05em; margin: var(--comp-35) auto 0;}


/*-- CONTENT --*/
#wrapContainer .contentBox{ padding: var(--comp-80) 0; box-sizing: border-box;}
#wrapContainer .contentBox.bgBlack{ background: var(--black)}
#wrapContainer .contentBox.bgGray{ background: var(--darkgray)}
#wrapContainer .contentBox.bgWhite{ background: #fff;}
#wrapContainer .contentBox .innerContent{ width: 90%; margin: 0 auto;}
#wrapContainer .contentBox .sectionTtl{ margin: 0 auto var(--comp-50); width: 100%;}
#wrapContainer .contentBox .sectionTtl .en{ display: block; margin: 0 auto var(--comp-30);}
#wrapContainer .contentBox .sectionTtl .en img{ display: block; margin: 0 auto; width: auto; height: 9.45945945vw;}
#wrapContainer .contentBox .sectionTtl .ja{ font-size: var(--comp-32); text-align: center; display: block; font-weight: 600; color: #fff; }
#wrapContainer .contentBox .simpleTtl{ font-size: var(--comp-32); text-align: center; margin: 0 auto var(--comp-40); }
#wrapContainer .accordionBtn{ cursor: pointer;}
#wrapContainer .accordionBox{ display: none;}
#wrapContainer .contentText{ margin: 0 auto var(--comp-60); width: 100%; padding: 0 var(--comp-25); box-sizing: border-box; font-size: var(--comp-24); font-weight: 300; text-align: left; color: #fff;}


/*-- NEWS --*/
#wrapContainer .scrollBox{ overflow-y: auto; max-height: 90vw; margin: 0 auto var(--comp-60);}
#wrapContainer .scrollBox .newsList{ border-top: 1px solid var(--gray); }
#wrapContainer .scrollBox .newsList li{ padding: var(--comp-25) var(--comp-25); box-sizing: border-box; border-bottom: 1px solid var(--gray); display: flex; flex-wrap: wrap; color: #fff; font-size: var(--comp-24); }
#wrapContainer .scrollBox .newsList li a{color: #fff;}
#wrapContainer .scrollBox .newsList li .date{ width: 100%; margin: 0 auto var(--comp-20); }
#wrapContainer .scrollBox .newsList li .text{ width: 100%; margin: 0;}
#wrapContainer .btnList{ width: 100%; display: flex; gap: var(--comp-30); flex-wrap: wrap;}
#wrapContainer .btnList li{ width: 100%;}
#wrapContainer .btnList li a{ display: block; background: #fff; color: var(--black); padding: var(--comp-30) var(--comp-25);; text-align: center; font-size: var(--comp-30); text-decoration: none; font-weight: 600; position: relative;}
#wrapContainer .btnList li a::after{ content: ""; display: block; width: var(--comp-18); height: var(--comp-18); position: absolute; top: calc(50% - var(--comp-9)); right: var(--comp-30); border-top: 2px solid var(--black); border-right: 2px solid var(--black); transform: rotate(45deg)}


/*-- ABOUT --*/
#wrapContainer .wideAccordion{ width: 100%; background: var(--black)}
#wrapContainer .wideAccordion .accordionBtn{ font-size: var(--comp-24); padding: var(--comp-30); color: #fff; margin: 0; text-align: left; position: relative;}
#wrapContainer .wideAccordion .accordionBtn::after{ content: ""; display: block; width: var(--comp-20); height: var(--comp-20); border-bottom: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: var(--comp-35); right: var(--comp-30); transform: rotate(45deg); transition: all 0.5s; }
#wrapContainer .wideAccordion .accordionBtn.active::after{ top: var(--comp-45); transform: rotate(-135deg) }
#wrapContainer .wideAccordion .accordionBox{ padding: 0 var(--comp-30) var(--comp-30); box-sizing: border-box;}
#wrapContainer .wideAccordion .accordionBox p{ margin: 0; text-align: left; font-size: var(--comp-24); color: #fff;}
#wrapContainer .wideAccordion .accordionBox p:not(:last-child){ margin-bottom: var(--comp-30);}


/*-- FLOW --*/
#wrapContainer .flowNumList{ display: flex; gap: var(--comp-80); flex-wrap: wrap;}
#wrapContainer .flowNumList li{ display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; background: var(--darkgray); position: relative; width: 100%; box-sizing: border-box; padding: 30px; row-gap: var(--comp-30)}
#wrapContainer .flowNumList li .arrow{ position: absolute; width: var(--comp-38); height: var(--comp-50); bottom: calc(var(--comp-65) * (-1)); left: calc(50% - var(--comp-19));}
#wrapContainer .flowNumList li .arrow::before{ content: ""; display: block; width: 2px; height: calc(100% - 1px); background: #fff; position: absolute; top: 0; left: calc(50% - 1px);}
#wrapContainer .flowNumList li p{ margin: 0;}
#wrapContainer .flowNumList li .arrow::after{ content: ""; display: block; width: var(--comp-26); height: var(--comp-26); border-right: 2px solid #fff; border-bottom: 2px solid #fff; position: absolute; bottom: 1px; left: calc(50% - var(--comp-15) - 1px); transform: rotate(45deg);}
#wrapContainer .flowNumList li p{ margin: 0;}
#wrapContainer .flowNumList li .num{ width: var(--comp-45); line-height: 1;}
#wrapContainer .flowNumList li h3{ width: calc(100% - var(--comp-70)); margin: 0; font-size: var(--comp-30); font-weight: 600; color: #fff;}
#wrapContainer .flowNumList li .textBox{ width: 100%;}
#wrapContainer .flowNumList li .textBox p{ color: #fff; font-size: var(--comp-24); margin: 0;}
#wrapContainer .flowNumList li .textBox a{ color: #fff; text-decoration: underline;}


/*-- SCHRDULE --*/
#wrapContainer .wideBtn{ width: 100%; margin: 0 auto;}
#wrapContainer .wideBtn a{ display: block; width: 100%; padding: var(--comp-30) var(--comp-25); text-align: center; font-size: var(--comp-30); position: relative; text-decoration: none;  box-sizing: border-box;}
#wrapContainer .wideBtn a::after{ content: ""; display: block; width: var(--comp-18); height: var(--comp-18); position: absolute; top: calc(50% - var(--comp-9)); right: var(--comp-30); transform: rotate(45deg)}
#wrapContainer .wideBtn.white a{ background: #fff; color: var(--black);}
#wrapContainer .wideBtn.white a::after{ border-top: 2px solid var(--black); border-right: 2px solid var(--black);}
#wrapContainer .wideBtn.bold{ font-weight: 600;}


/*-- CLASS --*/
#wrapContainer .bdrAccordionList{ border-top: 1px solid var(--gray);}
#wrapContainer .bdrAccordionList li{ border-bottom: 1px solid var(--gray);}
#wrapContainer .bdrAccordionList li .accordionBtn{ font-size: var(--comp-30); padding: var(--comp-30) var(--comp-25); color: #fff; margin: 0; text-align: left; position: relative; font-weight: 600; }
#wrapContainer .bdrAccordionList li .accordionBtn span.nobold{ font-weight: normal; }
#wrapContainer .bdrAccordionList li .accordionBtn::after{ content: ""; display: block; width: var(--comp-20); height: var(--comp-20); border-bottom: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: var(--comp-35); right: var(--comp-30); transform: rotate(45deg); transition: all 0.5s; }
#wrapContainer .bdrAccordionList li .accordionBtn.active::after{ top: var(--comp-45); transform: rotate(-135deg) }
#wrapContainer .bdrAccordionList li .accordionBox{ font-size: var(--comp-24); color: #fff; padding: 0 var(--comp-25) var(--comp-30); box-sizing: border-box;}


/*-- LINK --*/
#wrapContainer #link{ padding: var(--comp-80) 0;}
#wrapContainer .simpleBtnList{ width: 100%; display: flex; gap: var(--comp-20); flex-wrap: wrap;}
#wrapContainer .simpleBtnList li{ width: 100%;}
#wrapContainer .simpleBtnList li a{ display: block; background: var(--black); color: #fff; font-size: var(--comp-20); font-weight: 300; padding: var(--comp-20); text-align: center; text-decoration: none; box-sizing: border-box;}


/*-- BREADCRUMBS --*/
.breadcrumbs .l-container{ padding: 10px 0 0; position: relative; margin-bottom: 5px;}
.breadcrumbs .l-container::before{ background: #dfdfdf; content: ''; display: block; height: 1px; max-width: 100%; margin: 0 auto; position: absolute; top: 0px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: calc(100% - 40px);
}
.breadcrumbs-list{ display: -webkit-box; display: flex; flex-wrap: wrap; font-family: var(--default-font); width: calc(100% - 40px); margin: 0 auto;}
.breadcrumbs-item{ display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; letter-spacing: 0.06em; line-height: 2; font-size: 11px;}
.breadcrumbs-item:last-child{ font-weight: bold;}
.breadcrumbs-item:not(:last-child):after{ content: ''; display: block; position: relative; width: 5px; height: 5px; border-bottom: 1px solid #6a6969; border-right: 1px solid #6a6969; margin: 0 6px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.breadcrumbs-link { color: #12290f; text-decoration: none;}
/*-- NOTE --*/
.note-list{ display: -webkit-box; font-family: var(--default-font); width: calc(100% - 40px); margin: 0 auto 30px;}
.note-item{ display: -webkit-box; -webkit-box-align: center; align-items: center; letter-spacing: 0.06em; line-height: 2; font-size: 11px;}

}

/*----*/
#wrapContainer .banner { margin-top: 60px; text-align:center;}
#wrapContainer .banner img { width: 100%; height: auto; max-width: 546px;}