@charset "UTF-8";
/*------------------------normalize*/
html { scroll-behavior:smooth; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary {display: block;}audio,canvas,progress,video {display: inline-block; vertical-align: baseline;}a {background: transparent;}a:active,a:hover {outline: 0;}sub,sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}sup {top: -0.5em;}sub {bottom: -0.25em;}img {border: 0;}svg:not(:root) {overflow: hidden;}figure {margin: 0;}hr {-moz-box-sizing: content-box; box-sizing: content-box; height: 0;}pre {overflow: auto;}button,input,optgroup,select,textarea {color: inherit; font: inherit; margin: 0;}button {overflow: visible;}button,select {text-transform: none;}button,html input[type="button"],input[type="reset"],input[type="submit"] {-webkit-appearance: button; cursor: pointer;}button[disabled],html input[disabled] {cursor: default;}button::-moz-focus-inner,input::-moz-focus-inner {border: 0; padding: 0;}input {line-height: normal;}input[type="checkbox"],input[type="radio"] {box-sizing: border-box; padding: 0;}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button {height: auto;}input[type="search"] {-webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}fieldset {border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}textarea {overflow: auto;}table {border-collapse: collapse; border-spacing: 0;}td,th {padding: 0;}img{ vertical-align: bottom;}
button{ border:none;}button:focus{ outline:none;}table { border-collapse: collapse; border-spacing: 0;}
*{ box-sizing: border-box;}
ul, ol, li{ margin: 0; padding: 0; list-style: none; }
/*------------------------normalizeEnd*/

body {
    background:#fff;
    line-height: 1.6;
    font-family: 'Noto Sans JP', sans-serif;
    animation: fade 2s;
    -webkit-animation: fade 2s;
    color:#231815;
    margin:0 auto;
    text-align:center;
    font-size:100%;
    position: relative;
}
.fadeIn {
    animation-name: fadeIn500ms;
    animation-delay: 400ms;
    animation-duration: 1.5s;
    animation-fill-mode: forwards;
    opacity: 0;
}

@keyframes fadeIn500ms {
    0% {}

    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

h1, h2, h3, h4, h5, h6{ margin:0; padding:0; font-size:1em; font-weight: 700;}
h1{ font-size: 30px; line-height: 1.2;}
@media screen and (max-width: 640px) {
h1{ font-size: 24px;}
}
h2{ font-size: 32px; text-align: center;}
h2 span{ display: inline-block; border-bottom: 4px solid; border-image: linear-gradient(to right, #ad77d7, #4abaa3) 1;}
.roboto{ font-family: 'Roboto', sans-serif;}
.robotoB{ font-family: 'Roboto', sans-serif; font-weight: 700;}

h4{ font-size: 1.3rem;}
h5{ font-size: 1.2rem;}
p{ margin:0; padding:0; font-size: 16px; margin-bottom: 1em; text-align: justify; font-weight: 400; }


address{ font-style:normal;}
a{text-decoration: none;}
a:link, a:visited{ color:#007ab0;}
a:hover{ transition: 0.4s; color:#af3b22;}
a font-family: 'Roboto', 'Noto Sans JP', sans-serif;rea { outline:none; }

section{}
article{}


/*------*/
.wrapBox{ width: 100%; max-width: 1000px; margin: 0 auto;}
.flexBox{ display: flex; justify-content: space-between; }


/*------------------------Style*/

/*--- header ---*/
header{ background: url(../img/back.jpg); background-size: cover; color: #fff;}

.logoLink{ display: flex; align-items: center; text-align: left;}
.logoLink .logo{}
.logoLink .logo a{ display: inline-block; width: 100%; max-width: 86px; margin-right: 1em;}
.logoLink .logo a img{ width: 100%;}
.logoLink a.lang { width: 128px; text-align: center; margin-left: auto; margin-right: 100px; border-radius: 100px; border: 1px solid #421e43; display: block; background: #fff; color: #421e43; font-size: 14px; padding: 5px 1em;}
.logoLink a:hover{ opacity: .6;}

.spBR{ display: none;}

@media screen and (max-width: 1080px) {
.logoLink{ display: block; align-items: baseline; padding: 1em;}
.logoLink .logo{ margin-bottom: 5px;}
.spBR{ display: block;}
.logoLink a.lang { margin: 1em 0 0; margin-right: auto; display: block;}
}


.mainBox{ width: 100%; max-width: 1480px; margin-top: 20px; background: url(../img/mainImg.jpg); background-size: cover; background-position: bottom center; padding: 1em 1em 1em 200px; text-align: left;}

.mainBox h2{ font-size: 82px; line-height: 1.2; text-align: left;}
@media screen and (max-width: 1200px) {
.mainBox{ padding: 1em;}

.mainBox h2{ font-size: 52px;}
}
@media screen and (max-width: 480px) {

.mainBox h2{ font-size: 42px;}
}

.readBox{ display: inline-block; padding: .8em 1em; color: #421e43; background: rgba(255, 255, 255, .8); border-radius: 8px; margin: 1em 0;}
.readBox h3{ font-size: 18px;}
@media screen and (max-width: 480px) {
.readBox{ display: block;}
.readBox h3{ font-size: 15px;}
}



.dateBox{ display: block; padding: .8em 1em 1em; color: #fff; background: rgba(0, 0, 0, .5); border-radius: 8px;}
.dateBox .flex{ display: flex; }
.dateBox .flex p.robotoB{ font-size: 72px; line-height: 1.2; margin-right: 10px; margin-bottom: 20px;}
.dateBox .flex span.robotoB{ font-size: 24px; line-height: 1.3; padding-top: 14px;}
.dateBox .flex span.robotoB span{ font-size: 18px;}

@media screen and (max-width: 640px) {
.dateBox .flex p.robotoB{ font-size: 42px; margin-bottom: 0;}
.dateBox .flex span.robotoB,
.dateBox .flex span.robotoB span{ font-size: 14px; padding-top: 5px;}
}


.dateBox .flexBox{ justify-content: flex-start;}
.dateBox .flexBox div:nth-child(1){ margin-right: 50px;}
.dateBox .tag{ display: inline-block; padding: 2px 1em; border-radius: 4px; background: #be0196; color: #fff; font-size: 14px;}
.dateBox p{ font-size: 30px;}
.dateBox p span{ font-size: .6em;}
.lh01{ line-height: 1.1;}


@media screen and (max-width: 980px) {
.dateBox .flexBox{ display: block;}
}




.headerBtnBox{ display: flex; justify-content: space-between; width: 100%; max-width: 1000px; margin: 50px auto;}
.headerBtnBox a{ font-size: 24px; width: 80%; max-width: 480px;
display: block;
position: relative;
padding: 1em;
color: #fff;

}
.headerBtnBox a::before {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    border-radius: 200px;
    border: 3px solid transparent;
    background: linear-gradient(135deg, rgb(74, 234, 220) 0%, rgb(151, 120, 209) 50%, rgb(207, 42, 186) 100%) border-box border-box;
    -webkit-mask: linear-gradient(#a377cd 0 0) padding-box, linear-gradient(#4ab099 0 0) border-box;
    -webkit-mask-composite: destination-out;
    mask: linear-gradient(#a377cd 0 0) padding-box, linear-gradient(#4ab099 0 0) border-box;
    mask-composite: exclude;
}
@media screen and (max-width: 1000px) {
.headerBtnBox{ display: block;}
.headerBtnBox a{ margin: 20px auto;}
}
@media screen and (max-width: 640px) {
.headerBtnBox a{ font-size: 16px;}
}


.entryBox{ background: #d44e33; padding: 50px 1em;}
.entryBox .btnBox{ display: flex; width: 100%; max-width: 1040px; margin: 0 auto;}
.entryBox .btnBox a{ font-size: 18px; width: 48%; max-width: 480px;
    display: block;
    position: relative;
    padding: 1em;
    background: #fff;
    color: #000;
    border: 1px solid #d44e33;
}
.entryBox .btnBox a::before {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    border-radius: 200px;
    border: 3px solid transparent;
    background: linear-gradient(135deg, rgb(74, 234, 220) 0%, rgb(151, 120, 209) 50%, rgb(207, 42, 186) 100%) border-box border-box;
    -webkit-mask: linear-gradient(#a377cd 0 0) padding-box, linear-gradient(#4ab099 0 0) border-box;
    -webkit-mask-composite: destination-out;
    mask: linear-gradient(#a377cd 0 0) padding-box, linear-gradient(#4ab099 0 0) border-box;
    mask-composite: exclude;
}
@media screen and (max-width: 1000px) {
.entryBox{ padding: 1px 1em 20px;}
.entryBox .btnBox{ display: block; padding: 1em 1em 0;}
.entryBox .btnBox a{ font-size: 16px; width: 80%; border-radius: 200px; margin: 1em auto;}
}

/*------------------------nav*/


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


/*--- footer ---*/
footer{ background: #344960; text-align: left; font-size: 14px;}
footer .flexBox{ width: 100%; max-width: 1000px; margin: 0 auto; padding: 50px 0;}
footer .addBox{ color: #fff;}
footer h3{ font-size: 18px; margin-bottom: 0;}
footer p{ font-size: 14px;}
footer .archiveBox{ background: #fff; padding: 1em 1.5em;}
footer .archiveBox ul{ margin: 10px auto;}
footer .archiveBox li a{ color: #344960;}
footer .archiveBox li a:hover{ color: #af3b22;}
footer .archiveBox li{ font-weight: 700; margin-bottom: 5px;}
footer .archiveBox li:before { padding-right: 5px;
    font-family: "Font Awesome 6 Free";
    content: '\f08e';
    font-weight: 900;
}
footer .addBox a:link,
footer .addBox a:visited{ color: #fff;}
@media screen and (max-width: 1000px) {
footer .flexBox{ display: block; padding: 1em;}
}


/*--- main ---*/
main { text-align: left;}
main section,
.mapBox{ width: 100%; max-width: 1000px; margin: 0 auto; padding: 50px 0;}

@media screen and (max-width: 1000px) {
.mapBox{ padding: 0; }

main section{ margin: 0; padding: 2em 1em; }
main section section{ margin: 0; padding: 0;}
}


/*--- nav ---*/
.sectNav{}

.sectNav ul.flexBox{ flex-wrap: wrap;}
.sectNav li{ width: 49%;}
.sectNav li a{ position: relative; display: block; color: #fff; border-radius: 8px; margin-bottom: 10px; padding: 10px 1.5em 10px 1em; font-size: 18px;}
.sectNav li a:hover{ opacity: .6;}
.sectNav li a:after { position: absolute; top: 50%; right: 10px; padding-left: 5px; font-family: "Font Awesome 6 Free"; content: '\f13a'; font-weight: 900;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);}

.sectNav li a span{ font-size: 14px; padding-right: 1em;}

.sectNav li:nth-child(1) a{ background: #277fad;}
.sectNav li:nth-child(2) a{ background: #8958ab;}
.sectNav li:nth-child(3) a{ background: #af3b22;}
.sectNav li:nth-child(4) a{ background: #d57f00;}
.sectNav li:nth-child(5) a{ background: #1a8f80;}
.sectNav li:nth-child(6) a{ background: #344960;}

.sectNav li:nth-child(1){ order: 1;}
.sectNav li:nth-child(2){ order: 3;}
.sectNav li:nth-child(3){ order: 5;}
.sectNav li:nth-child(4){ order: 2;}
.sectNav li:nth-child(5){ order: 4;}
.sectNav li:nth-child(6){ order: 6;}

@media screen and (max-width: 1000px) {
.sectNav li a span{ display: block;}
.sectNav li a br{ display: none;}

.sectNav ul.flexBox{ display: block;}
.sectNav li{ width: 100%;}

.sectNav li:nth-child(1){ order: 1;}
.sectNav li:nth-child(2){ order: 2;}
.sectNav li:nth-child(3){ order: 3;}
.sectNav li:nth-child(4){ order: 4;}
.sectNav li:nth-child(5){ order: 5;}
.sectNav li:nth-child(6){ order: 6;}
.sectNav li:nth-child(7){ order: 7;}
}


.nameNav{}
.nameNav ul li{ text-align: center; font-size: 15px; margin: 0 2px;}
.nameNav ul li a{ color: #666;}
.nameNav ul li a:hover{ opacity: .6;}
.nameNav img{ width: 100%; max-width: 130px; margin: 0 auto; display: block;}
.nameNav span{ display: block; color: #125a80;}
/* @media screen and (max-width: 640px) {
.nameNav .flexBox{ display: block;}
.nameNav img{ max-width: 260px;}
} */
@media screen and (max-width: 840px) {
.nameNav .flexBox{ flex-wrap: wrap;}
.nameNav ul li{ width: 49%; margin: 0;}
.nameNav img{ max-width: 260px;}
}




/*--- contents ---*/
.SS01Box{ background: #dfecf3;}
.SS02Box{ background: #eee6f3;}
.AwardBox{ background: #f4e2de;}
.ptSSBox{ background: #faecd9;}
.TourBox{ background: #d1e9e6;}
.ReceptionBox{ background: #e1e4e7;}

#SS01 h3,
#SS02 h3,
#Award h3,
#ptSS h3,
#Tour h3,
#Reception h3{ display: flex; justify-content: space-between; font-size: 22px; color: #fff; padding: 1em; border-radius: 8px 8px 0 0;}

#SS01 h3{ background: #277fad;}
#SS02 h3{ background: #8958ab;}
#ptSS h3{ background: #d57f00;}
#Award h3{ background: #af3b22;}
#Tour h3{ background: #1a8f80;}
#Reception h3{ background: #344960;}



#SS01 h3 span,
#SS02 h3 span,
#Award h3 span,
#ptSS h3 span,
#Tour h3 span,
#Reception h3 span{ font-weight: bold; font-size: 16px; background: #fff; border-radius: 2px; padding: 5px 1em 0;}

#SS01 h3 span{ color: #277fad;}
#SS02 h3 span{ color: #8958ab;}
#ptSS h3 span{ color: #d57f00;}
#Award h3 span{ color: #af3b22;}
#Tour h3 span{ color: #1a8f80;}
#Reception h3 span{ color: #344960;}
@media screen and (max-width: 1000px) {

#SS01 h3,
#SS02 h3,
#Award h3,
#ptSS h3,
#Tour h3,
#Reception h3{ display: block;}

#SS01 h3 span,
#SS02 h3 span,
#Award h3 span,
#ptSS h3 span,
#Tour h3 span,
#Reception h3 span{ display: block; text-align: center; padding: 5px 1em; margin-top: 1em;}
}




section.sectBox{ display: flex; justify-content: space-between; margin: 0 0 20px; padding: 1em; background: #fff;}

.imgBox{ width: 100%; max-width: 192px; margin-right: 30px;}
.imgBox img{ width: 100%;display: block; text-align: center;}

.sectBox .time{ color: #125a80; font-size: 22px; font-weight: bold;}
.sectBox .time span{ display: inline-block; border-radius: 2px; margin-right: 1em; padding: 1px 1em; background: #125a80; color: #fff; font-size: 14px; vertical-align: 3px; display: none;}

.txtBox h4{ font-size: 32px;}
.txtBox h5{ font-size: 22px;}
.txtBox p{}


@media screen and (max-width: 820px) {
section.sectBox{ display: block;}
.imgBox{ margin: 0 auto 1em;}
}






.btnBox{}
.btnBox a{ padding: 1em; font-size: 24px; color: #fff; text-align: center; border-radius: 800px; display: block; width: 80%; max-width: 480px; margin: 40px auto 0; background: linear-gradient(.45turn,#ae44e2, #343663);}
.btnBox a{ margin-bottom: 20px;}
.btnBox a:hover{ opacity: .6;}

.flex{ display: flex;}
.flex a{ width: 48%; font-size: 18px;}

@media screen and (max-width: 960px) {
.flex{ display: block;}
.flex a{ width: 100%; font-size: 18px;}
}


section#hanyu .flexBox{ justify-content: space-between;}
section#hanyu .imgBox{ width: 100%; max-width: 150px; margin: 0 0 0 30px; order: 1;}

@media screen and (max-width: 820px) {
section#hanyu h4 br{ display: none;}
section#hanyu .flexBox{ display: block;}
section#hanyu .imgBox{ margin: 1em auto;}
}


section#Tour .flexBox{ justify-content: space-between;}
section#Tour .imgBox{ width: 100%; max-width: 320px; margin: 0 0 0 30px; order: 1;}

@media screen and (max-width: 820px) {
section#Tour h4 br{ display: none;}
section#Tour .flexBox{ display: block;}
section#Tour .imgBox{ margin: 1em auto;}
}





.sectBox01{ margin: 0 0 1em; padding: 1em; background: #fff;}
.btnBox2 {}
.btnBox2 a{padding: 1em; font-size: 24px; color: #fff; text-align: center; border-radius: 800px; display: block; width: 80%; margin: 20px auto; background: linear-gradient(.25turn,#1424e7, #e11d31);}
.btnBox2 a:hover{ opacity: .6;}

@media screen and (max-width: 820px) {
.btnBox a,
.btnBox2 a{ font-size: 18px;}
}


/*table*/
.table01{ width: 100%; margin-bottom:40px; border-collapse: collapse; text-align:left; border: 1px solid #fff;}



/*list*/




/*------------------------otherStyle*/
.fitImg img{ width: 100%; max-width: 1000px;}
@media screen and (max-width: 1000px) {
.fitImg { padding: 1em;}
}

.PC{ display: block; }
.SP{ display: none; }

.fL{ float: left; }
.fR{ float: right; }

.tR{ text-align: right; }
.tC{ text-align: center; }

.fontS{ font-size: .7em; padding-left: 1em;}

.cf:after{/*for modern browser*/
    content:"."; display: block; height:0px; clear:both; line-height:0; visibility:hidden;}

.pagetop{ font-size: 48px; position: fixed; bottom: 20px; right: 10px;}
.pagetop a{ color: rgba(200,200,200,.8);}





@media screen and (max-width: 1000px) {
.PC{ display: none; }
.SP{ display: block; }

}




/*------------------------nav*/
.drawer{ z-index: 9999; display: flex; flex-direction: row; align-items: center; justify-content: space-between; position: fixed; top: 0; right: 0; padding: 0 30px; width: 86px; height: 86px; background: rgba(255,255,255,.8); }
.navbar_toggle{z-index:9999;}
.navbar_toggle_icon { position: relative; display: block; border-radius: 4px; height: 2px; width: 28px; background: #4a0547; -webkit-transition: ease .4s; transition: ease .4s;}
.navbar_toggle_icon:nth-child(1) { top: 0;}
.navbar_toggle_icon:nth-child(2) { margin: 8px 0;}
.navbar_toggle_icon:nth-child(3) { top: 0;}

/*OPEN時の動き*/
.navbar_toggle.open .navbar_toggle_icon:nth-child(1) {top: 10px; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.navbar_toggle.open .navbar_toggle_icon:nth-child(2) {-webkit-transform: translateY(-50%); transform: translateY(-50%); opacity: 0;}
.navbar_toggle.open .navbar_toggle_icon:nth-child(3) {top: -10px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}



/*OPEN*/
.menu.open {
 -webkit-transform:translateX(0);
 transform:translateX(0);
 overflow-y: auto;
 -webkit-overflow-scrolling: touch;
}


.menu{ position: fixed; -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition:ease .5s; transition:ease .5s; z-index:9998; top: 0; width: 100%; margin: 0;background: #4a0547; height: 100vh; overflow-y: scroll;}

.menu nav{ padding: 20px 20px 80px; height: 100vh; overflow: scroll; font-size: 18px; text-align: left; }
.menu a,
.menu a:link,
.menu a:visited{ color: #fff;}
.menu a:hover{ opacity: .6;}

/* style */
.menu{ color: #fff; padding: 2.8em; text-align: left;}
.menu .flexBox .jBox a,
.menu .flexBox .eBox a{ display: inline-block; margin: 10px 0; padding: .8em 2em; border-radius: 400px; color: #4a0547; background: #fff;}
.menu .flexBox .jBox a{ margin-right: 1.5em;}
.menu .flexBox .eBox a{}
.gMenuriceLogo{ width: 200px;}

.menu .flexBox{ justify-content: start;}
.menu .flexBox .navBox01{ margin-right: 4em;}
.menu section{ margin-bottom: 1.5em;}

.menu h4{}
.menu h5{ border-left: 4px solid #fff; padding: 5px 10px; margin-bottom: 1em;}

.menu li{ margin-bottom: 5px;}

@media screen and (max-width: 840px) {
.menu{ padding: 1.8em 1.8em 2.5em;}
.menu .flexBox{ display: block;}
.menu .flexBox .navBox01{ margin-right: 0;}




/* 参加者限定ページセンタリング設定 */
.sanka {
p {
  padding: 20px;
}


