html,body { width: 100%; -webkit-text-size-adjust: 100%;}

body{display: flex; flex-direction: column; min-height: 100vh; background-color:#000;}

.palt {
  font-feature-settings: "palt";
}

/*---------------------------------------------------------------------------------------------------   
　#header
---------------------------------------------------------------------------------------------------*/
#header,
#header:after,
#header .subArea,
#header .title_dateArea,
#header .snsArea,
#header .navArea,
#header .logoArea,
#header h1.logo,
#header h1.logo a:before,
#header .navAreaSp,
#header .navLiveSp{ -webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease; }

/* ======== #header ======== */
#header { position: fixed; top:0; left:0; z-index:999999; width:100vw; height:35px; margin:0; -moz-box-sizing:border-box;box-sizing:border-box; }
/*#header:after { position: absolute; top:0; right:0; bottom:0; left:0; z-index:-1; content:""; background:#000; -moz-box-sizing:border-box;box-sizing:border-box;background:#000; opacity:0.9; }*/

/* .fixed */
#header.fixed { height:65px; -webkit-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.2);-moz-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.2);box-shadow:0px 0px 10px rgba(0, 0, 0, 0.2); }
#header.fixed:after { opacity:1; }

@media only screen and (max-width: 738px) {
#header { height:30px; }
#header:after { opacity:1; }
#header.fixed { height:60px; }
#header.fixed:after { opacity:0.95; }
}


/* --------------------------------------
   #header .logoArea
   -------------------------------------- */   
#header .logoArea { position: absolute; bottom:9px; left:5%; z-index:3; }
#header h1.logo { position: relative; z-index:1; display: block; width:436px; height:70px; font-size:0; }
#header h1.logo a { display: block; }
#header h1.logo a:before { position: absolute; top:0; right:0; bottom:0; left:0; content:""; background:url(/static/athlete/images/junsports_agt_logo.png) center center no-repeat; background-size:436px; }

/* .fixed .logoArea */
#header.fixed .logoArea { bottom:6px; }
#header.fixed  h1.logo { width:250px; height:55px; }
#header.fixed  h1.logo a:before { position: absolute; top:0; right:0; bottom:0; left:0; content:""; background:url(/static/athlete/images/junsports_agt_logo.png) center center no-repeat; background-size:250px; }

@media only screen and (max-width: 900px) {
#header .logoArea { bottom:12px; left:0; right:0; }
#header h1.logo { width:297px; height:65px; margin:0 auto; }
#header h1.logo a:before { position: absolute; top:0; right:0; bottom:0; left:0; content:""; background:url(/static/athlete/images/junsports_agt_logo.png) center center no-repeat; background-size:297px; }
}
@media only screen and (max-width: 738px) {
#header .logoArea { bottom:10px; }
#header h1.logo { width:250px; height:55px;  }
#header.fixed  h1.logo { width:229px; height:50px; }
#header h1.logo a:before { position: absolute; top:0; right:0; bottom:0; left:0; content:""; background:url(/static/athlete/images/junsports_agt_logo.png) center center no-repeat; background-size:250px; }
#header.fixed  h1.logo a:before { position: absolute; top:0; right:0; bottom:0; left:0; content:""; background:url(/static/athlete/images/junsports_agt_logo.png) center center no-repeat; background-size:229px; }
}


/* --------------------------------------
   #header .subArea
   -------------------------------------- */   
#header .subArea { position: absolute; top:0; right:0; left:0; z-index:2; height:35px; overflow: hidden; }
#header .subArea:after { position: absolute; top:0; right:-100%; bottom:0; left:50%; z-index:-1; content:""; background:#000/*#001741*/; -webkit-transform:skew(-30deg, 0); }
#header .subArea:before { position: absolute; top:0; right:5%; left:0; z-index:-2; height:35px; content:""; background:#24292e/*#0d274c*/; }

/* .fixed .subArea */
#header.fixed .subArea { top:-36px; }

@media only screen and (max-width: 738px) {
#header .subArea { height:30px; }
#header .subArea:after { right:0; left:0; -webkit-transform:skew(0, 0); }
}

/* ======== .title_dateArea ======== */
#header .title_dateArea { position: absolute; top:0; right:5%; left:5%; z-index:2; font-size:0; height:35px; text-align: right; padding-right:100px; }
/* .titleArea */
#header .titleArea { position: absolute; top:0; left:0; }
#header .titleArea h1 { position: relative; z-index:1; font-size:13px; font-family:'Noto Sans JP', sans-serif; font-weight:400; line-height:35px; letter-spacing:0.05em; color:#fff; padding-left:30px; }
#header .titleArea h1 span.flag { position: absolute; top:10px; left:0; z-index:0; width:22px; height:16px; background:#fff; }
#header .titleArea h1 span.flag:before { position: absolute; top:0; right:0; bottom:0; left:0; z-index:1; width:10px; height:10px; content:""; background:#ca214c; margin:auto; -webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%; }

@media only screen and (max-width: 900px) {
#header .titleArea h1 { font-size:11px; }
}
@media only screen and (max-width: 738px) {
#header .title_dateArea { height:30px; }
#header .titleArea { right:0; text-align: center; }
#header .titleArea h1 { display: inline-block; line-height:30px; }
#header .titleArea h1 span.flag { top:7px; }
}
@media only screen and (max-width: 320px) {
#header .titleArea h1 { font-size:12px; }
}

/* --------------------------------------
   #header .snsArea
   -------------------------------------- */   
#header .snsArea { position: absolute; top:0; right:5%; z-index:3; height:35px; }
/* ul */
#header .snsArea ul { position: relative; list-style: none; font-size:0; text-align: right; margin:5px 0 0 0; padding:0; }
#header .snsArea ul li { display: inline-block; margin:0 0 0 8px; }
#header .snsArea ul li a { position: relative; z-index:1; display: block; width:25px; height:25px; text-align: center; color:#fff; -webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%; }
#header .snsArea ul li a:hover { -webkit-transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1);-o-transform:scale(1.1,1.1);-ms-transform:scale(1.1,1.1);transform:scale(1.1,1.1); }
#header .snsArea ul li a.x-twitter { background:#fff; }
#header .snsArea ul li a.facebook { background:#41569e; }
#header .snsArea ul li a.instagram { background:#427eff; background:-webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;background:linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat; }
#header .snsArea ul li a.youtube { background:#FF0000; }
#header .snsArea ul li a.livescore { background:#f9cc46; }
#header .snsArea ul li a:before { position: absolute; top:0; right:0; bottom:0; left:0; z-index:0; font-size:14px; font-family:'FontAwesome'; line-height:26px; text-align: center; }
#header .snsArea ul li a.x-twitter:before { content:"\e61b"; color:#000; }
#header .snsArea ul li a.facebook:before { content:"\f09a"; }
#header .snsArea ul li a.instagram:before { content:"\f16d"; }
#header .snsArea ul li a.youtube:before { content:"\f167"; }
#header .snsArea ul li a.livescore:before { content:"\f0e7"; }

/* .fixed .snsArea */
#header.fixed .snsArea { top:-36px; }

@media only screen and (max-width: 900px) {
#header .snsArea ul li a:hover { -webkit-transform:scale(1,1);-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);transform:scale(1,1); }
}
@media only screen and (max-width: 738px) {
#header .snsArea { top:auto; right:auto; bottom:20px; left:2.5%; z-index:4; display: none; }
#header.fixed .snsArea { top:auto; bottom:12px; }
#header .snsArea ul li { margin:0 7px 0 0; }
}


/* --------------------------------------
   page-header
   -------------------------------------- */ 
.page-header {margin-top:35px;}

.no-gutters { margin:0; padding:0;}
.no-gutters　> .col,
.no-gutters　> [class*="col-"] { margin:0; padding:0;}

.page-header-image { width: 100%; height: calc(100vh - 35px); object-fit: cover; z-index: -1;}
.overlay-content { width: 100%; height: calc(100vh - 35px);}



@media only screen and (max-width: 738px) {
  .page-header { margin-top:30px;}
  .page-header-image { height: calc(100vh - 30px);}
  .overlay-content { height: calc(100vh - 30px);}
}

.js-font {font-family: 'Ethnocentric Rg', sans-serif;}



/* --------------------------------------
   .copyrightArea
   -------------------------------------- */   
footer .copyrightArea { position: relative; z-index:1; text-align: center; background:#000; padding:0; }
footer .copyrightArea:before { position: absolute; top:0; right:5%; left:5%; z-index:1; height:0; content:""; }
/* p.copy */
footer .copyrightArea p.copy { font-size:15px; font-family:'Barlow Condensed', sans-serif; font-weight:400; line-height:100px; letter-spacing:1px; color:#cacfd3; margin-bottom: 0; }

@media screen and (max-width: 900px) {
footer .copyrightArea { padding:35px 0; }
footer .copyrightArea:before { right:0; left:0; }
footer .copyrightArea p.copy { font-size:14px; line-height:1; margin-top:15px; }
}
@media screen and (max-width: 738px) {
footer .copyrightArea { padding:10px 0 10px; }
}


/* --------------------------------------
   .snsArea
   -------------------------------------- */   
footer .snsArea { position: absolute; top:30px; left:5%; z-index:3; }
footer .snsArea ul { list-style: none; position: relative; font-size:0; text-align: left; margin:0; padding:0; }
footer .snsArea ul li { display: inline-block; margin:0 10px 0 0; }
footer .snsArea ul li a { position: relative; z-index:1; display: block; width:35px; height:35px; text-align: center; color:#fff; -webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%; }
footer .snsArea ul li a:hover { -webkit-transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1);-o-transform:scale(1.1,1.1);-ms-transform:scale(1.1,1.1);transform:scale(1.1,1.1); }
footer .snsArea ul li a.x-twitter { background:#fff; }
footer .snsArea ul li a.facebook { background:#41569e; }
footer .snsArea ul li a.instagram { background:#427eff; background:-webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;background:linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat; }
footer .snsArea ul li a.youtube { background:#FF0000; }
footer .snsArea ul li a:before { position: absolute; top:0; right:0; bottom:0; left:0; z-index:0; font-size:18px; font-family:'FontAwesome'; line-height:36px; text-align: center; }
footer .snsArea ul li a.x-twitter:before { content:"\e61b"; color:#000; }
footer .snsArea ul li a.facebook:before { content:"\f09a"; }
footer .snsArea ul li a.instagram:before { content:"\f16d"; }
footer .snsArea ul li a.youtube:before { content:"\f167"; }

@media screen and (max-width: 900px) {
footer .snsArea { position: static; }
footer .snsArea ul { text-align: center; }
footer .snsArea ul li { display: inline-block; margin:0 5px; }
footer .snsArea ul li a:hover { -webkit-transform:scale(1,1);-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);transform: scale(1,1); }
footer .snsArea ul li a:before { position: absolute; top:0; right:0; bottom:0; left:0; z-index:0; font-size:16px; font-family:'FontAwesome'; line-height:25px; text-align: center; }
footer .snsArea ul li a { position: relative; z-index:1; display: block; width:25px; height:25px; text-align: center; color:#fff; -webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%; }
}

#ls-tabs li { background-color: var(--falcon-body-bg); border-color: rgba(0, 0, 0, 0.5); border-radius: 25px 0 0 25px;}
#ls-tabs li:last-child { border-radius: 0 25px 25px 0; }
#ls-tabs li a { color: #000; font-size: 1rem;}
#ls-tabs .active { color: #fff; background-color: #007bff; border-color: #007bff;}

#ls-tabs-players li { background-color: var(--falcon-body-bg); border-color: rgba(0, 0, 0, 0.5); border-radius: 25px 0 0 25px;}
#ls-tabs-players li:last-child { border-radius: 0 25px 25px 0; }
#ls-tabs-players li a { color: #000; font-size: 1rem;}
#ls-tabs-players .active { color: #fff; background-color: #007bff; border-color: #007bff;}

.bg-edf2f9 { background-color: #edf2f9;}

details {
  display: block;
  padding: 1em 0.5em 0;
}

summary {
  font-weight: bold;
  margin: -0.5em -0.5em 0;
  padding: 0.5em 0.5em 0 0.5em;
}
details summary::-webkit-details-marker {
    display: none;
}

details summary {
    list-style: none;
}

details[open] {
  padding: 0.5em;
}

details[open] summary {
  border-bottom: 1px solid #aaa;
  margin-bottom: 0.5em;
}

.detail-icon {
  display: block;
  position: relative;
  width: 24px;
  margin-left: 6px;
  margin-bottom: 0.75rem;
  flex-shrink: 0;
  transform-origin: center 43%;
  transition: transform 0.4s;
}

/* アコーディオンが開いた時のスタイル */
details[open] .detail-icon {
  transform: rotate(180deg);
}

/* アイコンのバーのスタイル */
.detail-icon::before,
.detail-icon::after {
  content: "";
  position: absolute;
  display: block;
  width: 15px;
  height: 3px;
  background-color: #ccc;
}

.detail-icon::before {
  left: 0;
  transform: rotate(45deg);
}

.detail-icon::after {
  right: 0;
  transform: rotate(-45deg);
}

.rounded-image {
    border-radius: 50%;
    overflow: hidden;
    width: 40px;
    height: 40px;
}

.requirements {
  background-color: #555;
}

.requirements a {color: #fff;}

.pdf-file {
  border: 1px solid #fff;
  border-radius: 5px;
  margin: 0.5em 0 0.5em 0;
  padding: 1em;
}

.description p {
  margin-bottom: 0!important;
}
.description h5 {
  margin-bottom: 0!important;
}
.icon {
  float: left;
  font-size: 2.5rem;
  margin-right: 0.3em;
}
