@charset "utf-8";

:root{
  --default-font:'YakuHanJP', 'Zen Kaku Gothic New', sans-serif;
  --students-font:var(--default-font);
  --eng-font:'Roboto Condensed', sans-serif;
  --mincho:"游明朝", "Yu Mincho", "游明朝体", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
	--google-icon:'Material Symbols Outlined';
  --main-color:#00b4de;
  --key-color:#00b4de;
  --link-color:#00b4de;
  --base-color:#333;
  --base-light-color:#333;
  --bg-color:#f5f5f5;
}

/* Phase 1 shared brand, navigation, and breadcrumbs */
.shinxia-logo{
  display:block;
  width:250px;
  max-width:100%;
  height:auto;
}
.scrolling #logo .shinxia-logo{
  width:170px;
}
nav.drawer-nav{
  overflow-y:auto;
}
#fixed-nav,
#global-nav > ul > li.menu-section-label,
#global-nav > ul > li.menu-audience{
  display:none;
}
#global-nav > ul > li.menu-lms > a,
nav.drawer-nav ul.drawer-menu > li.menu-lms > a{
  min-height:30px;
  padding:0.08em 0.8em;
  line-height:1.35;
  border-radius:999px;
  background:var(--key-color);
  color:#fff;
}
#global-nav > ul > li.menu-lms > a:hover,
nav.drawer-nav ul.drawer-menu > li.menu-lms > a:hover{
  background:#b75e00;
  color:#fff;
}
#global-nav > ul > li.menu-lms > a:hover::after{
  display:none;
}
.site-breadcrumb{
  position:relative;
  z-index:2;
  box-sizing:border-box;
  width:100%;
  padding:12px max(5%, calc((100% - 1100px) / 2));
  background:#fff;
  color:var(--base-light-color);
  font-size:0.82rem;
  line-height:1.5;
}
.site-breadcrumb ol{
  display:flex;
  align-items:center;
  margin:0;
  overflow:hidden;
  white-space:nowrap;
  list-style:none;
}
.site-breadcrumb li{
  min-width:0;
}
.site-breadcrumb li:not(:last-child)::after{
  content:"＞";
  margin:0 0.7em;
  color:#aaa;
}
.site-breadcrumb li:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
}
.site-breadcrumb a{
  color:var(--link-color);
}
footer .footer-logo .shinxia-logo{
  width:300px;
  margin:8px auto 0;
}

header{
  display:flex !important;
  justify-content:space-between;
  align-items:center;
  width:100%;
  height:100px;
  background-color:#fff;
  top:0; left:0;
  position:fixed;
  z-index:500;
  padding:10px 50px;
  box-sizing:border-box;
  transition:0.2s ease-in;
}
.scrolling header{
  align-items:center;
  height:72px;
  padding:7px 50px;
  transition:0.2s ease-in;
}
#logo h1{
  font-size:2.2em; line-height:1.4;
  text-align:left;
  transition:0.2s ease-in;
}
.scrolling #logo h1{
  font-size:1.7em; line-height:1.4;
  transition:0.2s ease-in;
}
#logo h1 a{
  display:flex;
  align-items:center;
  gap:14px;
  color:var(--base-light-color);
}
#logo h1 a:hover{
  text-decoration:none;
}
#logo h1 a .site-copy{
  font-family:var(--default-font);
  font-size:0.76rem;
  font-weight:500;
  line-height:1.45;
  color:var(--base-color);
  display:block;
  white-space:nowrap;
  transition:0.2s ease-in;
}
.scrolling #logo h1 a .site-copy{
  display:block;
  font-size:0.68rem;
  transition:0.2s ease-in;
}
#logo h1 a .site-copy span{
  display:block;
}
#logo h1 a .site-name{
  font-family:var(--eng-font);
}
#logo h1 a .site-name span.color{
  color:var(--key-color);
  margin-right:0.2em;
}
#logo h1 a .site-name span.small{
  font-size:0.65em;
}

#header-nav > ul,
#global-nav > ul{
  display:flex;
  justify-content:flex-end;
  align-items:center;
}
#header-info{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  gap:5px;
  min-width:0;
}
#header-nav ul li,
#global-nav ul li{
  list-style:none;
}
#header-nav ul li a,
#global-nav ul li a{
  display:inline-block;
  color:var(--base-light-color);
  position:relative;
}
#header-nav ul li a:hover,
#global-nav ul li a:hover{
  color:var(--key-color);
  text-decoration:none;
}
#header-nav ul li{
  font-size:0.85em; line-height:2.0; font-weight:500;
  transition:0.2s ease-in;
}
#header-nav ul li:not(:last-child)::after{
  content:"/";
  margin:0 1.0em;
}
.scrolling #header-nav ul li{
  font-size:0.75em; line-height:1.6;
  margin-bottom:0;
  transition:0.2s ease-in;
}

#global-nav > ul > li{
  font-family:var(--eng-font);
  font-size:1.15em; line-height:1.8; font-weight:700;
  white-space:nowrap;
  position:relative;
  transition:0.2s ease-in;
}
#global-nav > ul{
  gap:1.15em;
}
#global-nav > ul > li > a{
  display:flex;
  align-items:center;
  min-height:32px;
}
.scrolling #global-nav > ul > li{
  font-size:1.0em; line-height:1.6;
  transition:0.2s ease-in;
}
#global-nav > ul > li:not(:first-child){
  margin-left:0;
}
#global-nav > ul > li > a:hover::after{
  content:"";
  width:100%;
  border-top:3px solid var(--key-color);
  position:absolute;
  bottom:0px; left:0;
}
#global-nav ul li ul{
  display:none;
  position:absolute;
  top:30px;
  left:50%;
  border-radius:0 0 10px 10px;
  background:var(--key-color);
  background:rgba(222,118,0,0.98);
  padding:5px 0;
  transform:translateX(-50%);
}
.scrolling #global-nav ul li ul{
  top:22px;
}
#global-nav ul li:hover ul{
  display:block;
}
#global-nav ul li ul li a{
  padding:0 25px;
  font-size:0.85em;
  line-height:2.6;
  color:#fff;
}
#global-nav ul li ul li a:hover{
  color:var(--base-color);
}

#index-billboard{
  position: relative;
  width:100%;
  margin-top:100px;
}
.slick-container{
  overflow:hidden;
  width:100%;
}
ul.index-slider{
  position:relative;
  margin-bottom:20px;
}
ul.index-slider .slick-slide{
  width:100%; height:auto;
  margin:auto;
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}
/*
ul.index-slider .slick-slide:nth-child(1){
  background-image:url(../../img/index/slide01.jpg);
}
ul.index-slider .slick-slide:nth-child(2){
  background-image:url(../../img/index/slide02.jpg);
}
ul.index-slider .slick-slide:nth-child(3){
  background-image:url(../../img/index/slide03.jpg);
}
.index-slider .slick-slide:nth-child(4){
  background-image:url(../../img/index/slide04.jpg);
}
.index-slider .slick-slide:nth-child(5){
  background-image:url(../../img/index/slide05.jpg);
}
*/
#index-notice{
  padding:70px max(20px, calc((100% - 1100px) / 2)) 80px;
  background-color:var(--bg-color);
  display:flex;
  justify-content:space-between;
}
.notice-box{
  background-color:#fff;
  width:530px;
  box-sizing:border-box;
  padding:30px 50px 50px;
  border-radius:25px;
  box-shadow:3px 3px rgb(0 0 0 / 20%);
}
.notice-box h2{
  font-size:2.5em;
  line-height:1.4;
  font-weight:700;
  color:var(--base-light-color);
  margin-bottom:40px;
}
.notice-box h2 .eng{
  font-family:var(--eng-font);
}
.notice-box h2 .jp{
  display:block;
  font-size:0.35em;
}
.index-news ul{
  background-color:#faf6f1;
  padding:8px 30px;
  box-sizing:border-box;
  border-radius:13px;
}
.index-news ul li{
  list-style:none;
  text-align:left;
  position:relative;
  padding:26px 0;
}
.index-news ul li:not(:last-child){
  border-bottom:2px dotted #918e8f;
}
.index-news ul li a{
  display:block;
  color:var(--base-color);
  text-decoration:none;
}
#index-notice a span.entry-date{
  display:block;
  font-size:0.85em; line-height:1.6;
  margin-bottom:0.25em;
  color:var(--base-light-color);
}
#index-notice a span.entry-title{
  display:block;
  font-size:0.95em; line-height:1.6;
}
#index-notice a:hover span.entry-title{
  text-decoration:underline;
  color:var(--link-color);
}
.index-report ul li:not(:last-child){
  margin-bottom:30px;
}
.index-report ul li{
  list-style:none;
}
.index-news ul li a,
.index-report ul li a{
  color:var(--base-color);
  display:flex;
  justify-content:space-between;
  text-decoration:none;
}
.index-news ul li a figure,
.index-report ul li a figure{
  width:160px; height:auto;
  aspect-ratio:3/2;
  border-radius:13px;
  overflow:hidden;
  margin-right:20px;
}
.index-news ul li a figure img,
.index-report ul li a figure img{
  width:100%; height:100%;
  object-fit:cover;
}
.index-news ul li a figure.dummy,
.index-report ul li a figure.dummy{
  background-color:#f3f3f3;
  position:relative;
}
.index-news ul li a figure.dummy::after,
.index-report ul li a figure.dummy::after{
  content:"SPARC NAGANO";
  font-family:var(--eng-font);
  font-size:0.8em; line-height:1;
  color:var(--base-light-color);
  white-space:nowrap;
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
}
.index-news ul li a .text-box,
.index-report ul li a .text-box{
  flex:1;
  text-align:left;
}
.botton{
  display:block;
  text-align:center;
  margin-top:30px;
}
.botton a{
  font-size:0.9em; line-height:1.8;
  position:relative;
  color:var(--base-color);
  padding-right:1.7em;
  text-decoration:none;
  transition:0.1s;
}
.botton a:hover{
  color:var(--key-color);
  transition:0.1s;
}
.botton a::before{
  content:"";
  width:1.4em; height:auto;
  aspect-ratio:1/1;
  border-radius:100%;
  border:var(--key-color) 1px solid;
  background-color:var(--key-color);
  position:absolute;
  top:50%; right:0;
  transform:translateY(-50%);
  transition:0.1s;
}
.botton a::after{
  content:"";
  display:block;
  width:0.5em; height:auto;
  aspect-ratio:1/1;
  border-top:#fff 2px solid;
  border-left:#fff 2px solid;
  position:absolute;
  top:50%; right:0.55em;
  transform:translateY(-50%) rotate(135deg);
  transition:0.1s;
}
.botton a:hover::before{
  background-color:#fff;
  transition:0.1s;
}
.botton a:hover::after{
  border-top-color:var(--key-color);
  border-left-color:var(--key-color);
  transition:0.1s;
}

#index-contents{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  padding:80px max(20px, calc((100% - 1100px) / 2));
  background-color:#fff;
}
.index-contents-box{
  position:relative;
  width:540px;
  height:280px;
  border-radius:12px;
  overflow:hidden;
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
  margin-bottom:20px;
}
.index-contents-box.audience-highschool{
  background-image:url(../../img/index/for-studentguardian.jpg);
}
.index-contents-box.audience-students{
  background-image:url(../../img/index/for-enrolledstudent.jpg);
  margin-bottom:0;
}
.index-contents-box.vision-link{
  background-image:url(../../img/index/aboutus.jpg);
  width:100%;
  margin-bottom:0;
}
.index-contents-box a,
.index-contents-box span{
  display:block;
  text-decoration:none;
  width:100%; height:100%;
  position:relative;
  background:rgba(0,0,0,0.6);
}
.index-contents-box a:hover{
  background:rgba(0,0,0,0.3);
}
.index-contents-box a .text-box,
.index-contents-box span .text-box{
  width:100%;
  text-align:center;
  position:absolute;
  top:50%; left:0;
  transform:translateY(-50%);
}
.index-contents-box a::before{
  content:"";
  width:30px; height:auto;
  aspect-ratio:1/1;
  border-radius:100%;
  border:var(--key-color) 1px solid;
  background-color:var(--key-color);
  position:absolute;
  bottom:20px; right:20px;
  transition:0.1s;
}
.index-contents-box a::after{
  content:"";
  display:block;
  width:7px;
  height:7px;
  border-top:#fff 2px solid;
  border-left:#fff 2px solid;
  position:absolute;
  bottom:32px; right:33px;
  transform:rotate(135deg);
  transition:0.1s;
}
.index-contents-box a:hover::before{
  background-color:#fff;
  transition:0.1s;
}
.index-contents-box a:hover::after{
  border-color:var(--key-color);
  transition:0.1s;
}
.index-contents-box a .text-box h2,
.index-contents-box span .text-box h2{
  font-size:1.8em; line-height:1.4;
  font-weight:700;
  color:#fff;
  margin-bottom:15px;
}
.index-contents-box a .text-box h2.eng,
.index-contents-box span .text-box h2.eng{
  font-family:var(--eng-font);
  font-size:2.2em; line-height:1.2;
}
.index-contents-box a .text-box p,
.index-contents-box span .text-box p{
  font-size:0.95em;
  font-weight:500;
  line-height:1.6;
  color:#fff;
  padding:0 100px;
}

#index-teams{
  box-sizing:border-box;
  width:100%;
  padding:50px max(20px, calc((100% - 1100px) / 2)) 60px;
  background-image:url(../../img/common/teams_bg.jpg);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
}

.parents #index-teams{
  box-sizing:border-box;
  width:100%;
  height:360px;
  padding:100px max(20px, calc((100% - 1100px) / 2)) 0px;
  background-image:url(../../img/parents/teams_bg.png);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:top;
  background-color: white;
}

.parents #index-teams h2 .eng {
  color: var(--base-light-color);
}

#index-hs-program {
  box-sizing:border-box;
  width:100%;
  /* padding:50px calc((100% - 1100px) / 2) 60px;
  background-image:url(../../img/common/teams_bg.jpg);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center; */
}

#index-teams h2{
  font-size:2.5em;
  line-height:1.4;
  font-weight:700;
  color:#fff;
  margin-bottom:25px;
}

#index-hs-program h2,
#index-hs-oc h2{
  font-size:2.5em;
  line-height:1.4;
  font-weight:700;
  color:var(--base-light-color);
  margin-bottom:25px;
}

#index-hs-oc h2{
  margin-bottom:0;
}

#index-teams h2 .eng,
#index-hs-program h2 .eng,
#index-hs-oc h2 .eng{
  font-family:var(--eng-font);
}
#index-teams h2 .jp,
#index-hs-program h2 .jp,
#index-hs-oc h2 .jp{
  display:block;
  font-size:0.35em;
}
#index-teams p,
#index-hs-program p{
  font-size:0.95em; line-height:1.8;
  color:#fff;
  margin-bottom:1.5em;
}

#index-hs-oc p{
  font-size:0.95em; line-height:1.8;
  color:var(--base-light-color);
  margin-bottom:1.5em;
}

#index-teams ul,
#index-hs-program ul,
#index-hs-oc ul{
  margin:0 auto;
  display:flex;
  justify-content:center;
}
#index-teams ul li,
#index-hs-program ul li,
#index-hs-oc ul li{
  list-style:none;
  width:220px;
  /* height:84px; */
  margin:0 15px;
}
#index-teams ul li a,
#index-hs-program ul li a,
#index-hs-oc ul li a{
  display:block;
  box-sizing:border-box;
  width:100%;
  padding:10px 20px;
  background-color:#fff;
  border-radius:12px;
  overflow:hidden;
  box-shadow: 2px 3px rgb(0 0 0 / 20%);
  position:relative;
}

footer{
  padding:55px 0 40px;
  background-color:var(--bg-color);
  text-align:center;
  position:relative;
}
footer .footer-logo a{
  display:block;
  text-decoration:none;
  color:var(--base-color);
  margin-bottom:20px;
}
footer .footer-logo a .site-copy{
  font-size:0.7em; line-height:1.4; font-weight:500;
  color:var(--base-color);
  display:block;
  white-space:nowrap;
}
footer .footer-logo a .site-name{
  font-family:var(--eng-font);
  font-size:2.0em; line-height:1.4; font-weight:700;
}
footer .footer-logo a .site-name span{
  color:var(--key-color);
  margin-right:0.2em;
}
footer p{
  font-size:0.9em; line-height:1.8;
  color:var(--base-light-color);
  margin-bottom:2em;
}
footer p a{
  color:var(--base-light-color);
}
footer #copyright{
  font-size:0.75em; line-height:1.8;
  color:var(--base-color);
}

#banner-sparc{
  width:100%;
  background:#fff;
  text-align:center;
  padding:15px 0 20px;
  border-top:1px solid #ccc;
  display:flex;
  justify-content:center;
  align-items:center;
}

.parents #banner-sparc{
  width:100%;
  background:#fff;
  text-align:center;
  padding:15px 0 20px;
  border: 0;
  display:flex;
  justify-content:center;
  align-items:center;
}
#banner-sparc a{
  display:block;
  width:260px; height:auto;
  margin:0 10px;
}
#chatbot{
}
iframe#bedore-webagent-inner{
}

#page-title{
  width:100%; height:200px;
  margin-top:100px;
  background-image:url(../../img/common/title_bg.jpg);
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
  position:relative;
}
#page-title h1{
  font-family:var(--eng-font);
  font-size:2.4em; line-height:1.3;
  color:var(--base-light-color);
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
}
#page-title h1.page-title-jp{
  font-family:var(--default-font);
  letter-spacing:0.08em;
  white-space:nowrap;
}
#page-title h1 span{
  display:block;
  font-family:var(--default-font);
  font-size:1rem; line-height:1.3; font-weight:500;
}

#container{
  background:#fff;
  padding:80px max(20px, calc((100% - 1100px) / 2));
  display:flex;
  justify-content:center;
}
#main{
  flex:1;
  max-width:920px;
}
#main section{
  width:100%;
  margin-bottom:80px;
  text-align:left;
}
#main section:last-of-type{
  margin-bottom:0;
}
section p{
  line-height:2.0;
  margin-bottom:3em;
}

#side{
  width:280px;
  margin-left:40px;
}
.students #side{
  width:260px;
  margin-left:60px;
}

ul.message-menu{
  display:flex;
  justify-content:center;
  margin-bottom:80px;
}
ul.message-menu li{
  list-style:none;
  margin:0 1.5em;
}
ul.message-menu li a{
  display:block;
  text-decoration:none;
  font-size:1.0em; line-height:1.8; font-weight:700;
  color:var(--base-light-color);
  position:relative;
}
ul.message-menu li a:hover{
  color:var(--key-color);
}
ul.message-menu li.active a{
  color:var(--key-color);
  pointer-events:none;
}
ul.message-menu li.active a::before{
  content:"";
  width:100%;
  border-top:2px solid var(--key-color);
  position:absolute;
  bottom:-4px; left:0;
}
ul.message-menu li.active a::after{
  content:"";
  border-top:0.5em solid var(--key-color);
  border-left:0.5em solid transparent;
  border-right:0.5em solid transparent;
  position:absolute;
  bottom:-18px; left:50%;
  transform:translateX(-50%);
}
.message-box{
  display:flex;
  justify-content:space-between;
}
.message-box figure{
  width:320px;
  margin-right:40px;
}
.message-box .text-box{
  flex:1;
}

section > .entry-title{
  margin-bottom:2em;
}
section > .entry-title > h1{
  font-size:2.0em; line-height:1.6; font-weight:500;
  margin-bottom:0.2em;
}
section > .entry-title > .entry-date{
  font-family:var(--eng-font);
  font-size:0.9em; line-height:1.8;
  color:var(--base-light-color);
}
section > .entry-title > .entry-date > .icon::before{
  margin-right:0.2em;
}

section > .entry-body h1{
  font-size:1.8em; line-height:1.6; font-weight:500;
  margin-bottom:1em;
}
section > .entry-body h2{
  font-size:1.5em; line-height:1.6; font-weight:500;
  margin-bottom:1em;
}
section > .entry-body h1:not(:first-of-type),
section > .entry-body h2:not(:first-of-type){
  margin-top:3em;
}
section > .post_body h1,
section > .post_body h2{
  border-bottom:2px solid rgba(119, 119, 119, 0.2);
}
#container-parents h2{
  /* border-bottom:2px solid rgba(119, 119, 119, 0.2); */
  /* font-size: 5.0rem; */
}

/* #container-parents h2.no-border{
  border: 0;
} */
section > .post_body h1 span,
section > .post_body h2 span{
  border-bottom-color:var(--key-color);
  padding:0 0 0.5em 0;
}

#container-parents h2 span.eng{
  /* border-bottom:2px solid var(--key-color); */
  /* padding:0 0 0.1em 0; */
  font-size: 5.0rem;
  color: #00B4DE;
}
#container-parents h2 span.eng2{
  color: #9DC814;
  font-size: 6.0rem;
}
section > .entry-body h3{
  font-size:1.25em; line-height:1.6; font-weight:500;
  margin-bottom:0.25em;
}
section > .entry-body h4{
  font-size:1.1em; line-height:1.6; font-weight:500;
  margin-bottom:0.25em;
}
section > .entry-body figure{
  margin-bottom:2em;
}
section > .entry-body img{
//  width:auto;
  max-width:100%;
  height:auto;
}
section > .entry-body figcaption{
  line-height:2;
  margin-bottom:2em;
}
section > .entry-body ul,
section > .entry-body ol{
  margin-bottom:2em;
}
section > .entry-body ul li,
section > .entry-body ol li{
  margin-left:1.5em;
}

section ul.entry-bottom{
  display:flex;
  justify-content:center;
  border-top:1px solid #ddd;
  margin-top:5em;
  padding-top:0.5em;
}
section ul.entry-bottom li{
  list-style:none;
  font-size:0.8em; line-height:1.8;
  color:var(--base-light-color);
}
section ul.entry-bottom li:not(:last-child)::after{
  content:"｜";
  margin:0 0.5em;
}
section ul.entry-bottom li a{
  color:var(--base-light-color);
}

.side-box{
  box-sizing:border-box;
  width:100%;
  background:rgba(251, 246, 241, 0.75);
  border-radius:11px;
  padding:1.0em 1.5em;
  text-align:left;
}
.students .side-box{
  background:transparent;
  padding:0;
}
.side-box h2{
  font-size:1.0em; line-height:1.8; font-weight:700;
}
.side-box ul.side-latest-list li{
  list-style:none;
  margin-top:1em;
  padding-top:1em;
  border-top:1px solid #ccc;
}
.side-box ul.side-latest-list li a{
  display:flex;
  justify-content:space-between;
  color:var(--base-color);
}
.side-box ul.side-latest-list li a .entry-date{
  font-family:var(--eng-font);
  font-size:0.8em; line-height:1.8;
  color:var(--base-light-color);
}
.side-box ul.side-latest-list li a h3{
  font-size:0.9em; line-height:1.5; font-weight:500;
}
.side-box ul.side-latest-list li a:hover h3{
  text-decoration:underline;
  color:var(--link-color);
}
.side-box ul.side-latest-list li a figure{
  width:68px;
  margin-right:10px;
  margin-bottom:0;
}
.side-box ul.side-latest-list li a .text-box{
  flex:1;
}
.side-box ul.side-latest-list > li.more{
  text-align:right;
  margin-bottom:0.5em;
}
.side-box ul.side-latest-list > li.more > a{
  display:inline-block;
  font-size:0.8em; line-height:1.8;
  position:relative;
  padding-right:1em;
}
.side-box ul.side-latest-list li.more a:hover{
  color:var(--link-color);
}
.side-box ul.side-latest-list li.more a::before{
  display:none;
}
.side-box ul.side-latest-list li.more a::after{
  content:"";
  border-left:0.5em solid var(--base-light-color);
  border-top:0.5em solid transparent;
  border-bottom:0.5em solid transparent;
  position:absolute;
  top:50%; right:0;
  transform:translateY(-50%);
}

ul.news-list{
  width:700px;
  margin:0 auto;
}
ul.news-list li{
  list-style:none;
  margin-bottom:1.5em;
  padding-bottom:1.5em;
  border-bottom:1px solid #ccc;
}
ul.news-list li a{
  display:flex;
  justify-content:space-between;
  color:var(--base-color);
  padding:0 5px;
  text-align:left;
}
ul.news-list li a figure{
  width:160px; height:auto;
  aspect-ratio:3/2;
  border-radius:13px;
  overflow:hidden;
  position:relative;
  margin:0 25px 0 0;
}
ul.news-list li a figure img{
  width:100%; height:100%;
  object-fit:cover;
}
ul.news-list li a figure.dummy{
  background-color:#f3f3f3;
  position:relative;
}
ul.news-list li a figure.dummy::after{
  content:"SPARC NAGANO";
  font-family:var(--eng-font);
  font-size:0.8em; line-height:1;
  color:var(--base-light-color);
  white-space:nowrap;
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
}

ul.news-list li a .text-box{
  flex:1;
}
ul.news-list li a .text-box.news{
  display:flex;
  justify-content:space-between;
}
ul.news-list li a .entry-date{
  font-family:var(--eng-font);
  font-size:0.9em; line-height:1.8;
  color:var(--base-light-color);
}
ul.news-list li a:hover .entry-title{
  text-decoration:underline;
  color:var(--link-color);
}
ul.news-list li a .news .entry-date{
  line-height:2.0;
  margin-right:25px;
}
ul.news-list li a .news .entry-title{
  flex:1;
}

section.page > h2{
  font-size:1.6em; line-height:1.8; font-weight:500;
  text-align:center;
  position:relative;
  margin-bottom:60px;
}
section.page > h2::before{
  content:"";
  box-sizing:border-box;
  width:8px; height:auto;
  aspect-ratio:1/1;
  border-radius:100%;
  border:1px solid var(--base-color);
  position:absolute;
  bottom:-8px; left:50%;
  margin-left:-4px;
}

section.page > h2::after{
  content:"";
  width:1px; height:60px;
  border-left:1px solid var(--base-color);
  display:block;
  margin:5px auto;
}

ul.vision-list li{
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:40px;
  background:#f6f6f6;
}
ul.vision-list li:nth-child(even){
  flex-direction:row-reverse;
}
ul.vision-list li figure{
  width:480px;
  margin-bottom:0;
}
ul.vision-list li .text-box{
  flex:1;
  padding:0 30px;
}
ul.vision-list li .text-box h2{
  font-size:1.5em; line-height:1.8; font-weight:500;
  color:var(--key-color);
}
figure.vision-image a,
figure.course-image a{
  display:block;
  box-sizing:border-box;
  width:100%;
  border:1px solid #ccc;
  padding:1em 3em;
  margin:60px 0 0;
}
figure.vision-image figcaption,
figure.course-image figcaption{
  margin-top:0.25em;
  font-size:0.75em; line-height:1.8;
  color:var(--base-light-color);
  text-align:center;
}

/*
course
*/
figure.course-image a{
  margin:0;
}
figure.course-image figcaption{
  margin-bottom:60px;
}
figure.curriculum-image{
  margin-bottom:3em;
  position:relative;
}
figure.curriculum-image a{
  display:block;
  width:94%;
  margin:0 auto;
}
figure.curriculum-image figcaption{
  display:none;
}
figure.curriculum-image + .entry-body{
  margin-top:-2.0em;
  margin-bottom:6em;
}
ul.course-list li{
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  margin-bottom:3.0em;
}
ul.course-list li figure{
  width:480px;
  margin:0 0 0;
}
ul.course-list li .text-box{
  margin-left:-5em;
  margin-top:1.5em;
  box-sizing:border-box;
  flex:1;
  padding:1.5em 2.0em;
  background:#fbfbfb;
  border-radius:5px;
  box-shadow:3px 3px rgb(0 0 0 / 20%);
}
ul.course-list li .text-box h2{
  font-size:1.6em; line-height:1.2; font-weight:500;
  color:var(--key-color);
}
ul.course-list li .text-box h2::after{
  content:"";
  display:block;
  width:25px;
  border-top:1px solid #222;
  margin:0.75em 0;
}
ul.course-list li .text-box h3{
  font-size:1.15em; line-height:1.6; font-weight:700;
  margin-bottom:0.3em;
}
ul.course-list li .text-box span.period{
  font-size:0.85em; line-height:1; font-weight:500;
  color:var(--base-light-color);
}
ul.course-list li .text-box span.period::after{
  content:"";
  display:block;
  width:25px;
  border-top:1px solid #222;
  margin:1.3em 0;
}
ul.course-list li .text-box span.annotation{
  font-size:0.8em; line-height:1; font-weight:500;
  color:var(--base-light-color);
}
ul.course-list li .text-box p{
  font-size:0.95em; line-height:1.6;
  color:var(--base-color);
  margin-bottom:0;
}
ul.course-list li .text-box .botton{
  text-align:left;
  margin-top:0.75em;
  margin-bottom:0.25em;
}
ul.course-list li .text-box .botton.no-link > a{
  pointer-events:none;
}

/* students */
#students-billboard{
  width:100%; height:auto;
  aspect-ratio:1638/688;
  overflow:hidden;
  position:relative;
}
#students-billboard > img{
  width:100%; height:100%;
  object-fit:cover;
}
/*
#students-billboard::after{
  content:"";
  width:30%; height:100px;
  clip-path: polygon(0 0, 100% 0, 88% 100%, 0% 100%);
  background:rgba(255,255,255,0.8);
  position:absolute;
  top:0; left:0; z-index:1;
  backdrop-filter:blur(5px);
}
*/
#students-billboard > #billboard-copy{
  font-family:var(--mincho);
  font-size:2.2em; line-height:1.6; font-weight:500;
  color:var(--base-color);
  position:absolute;
  top:74px; left:22px;
//  transform:translateY(-50%);
}

.students-index-topics{
  display:flex;
  justify-content:space-between;
}
.students-index-topics > h2{
  width:200px;
  font-size:1.4em; line-height:1.6;
  color:var(--base-light-color);
}
.students-index-topics > h2::after{
  content:attr(data-subtitle);
  display:block;
  font-size:0.8em;
  font-weight:500;
}
.students-index-topics > .text-box{
  flex:1;
}
ul.students-topics-list > li{
  list-style:none;
  margin-bottom:1.5em;
  padding-bottom:1.5em;
  border-bottom:1px dashed #999;
}
ul.students-topics-list > li > a{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  text-decoration:none;
  color:var(--base-light-color);
}
ul.students-topics-list > li > a > figure{
  width:220px; height:auto;
  aspect-ratio:3/2;
  margin-right:1.5em;
  margin-bottom:0;
}
ul.students-topics-list > li > a > figure > img{
  width:100%; height:100%;
  object-fit:cover;
  object-position:top center;
}
ul.students-topics-list > li > a > .text-box{
  flex:1;
  text-align:left;
}
ul.students-topics-list > li > a > .text-box .entry-date{
  font-size:0.9em; line-height:1.6;
  margin-bottom:0.5em;
}
ul.students-topics-list > li > a > .text-box h3{
  font-size:1.05em; line-height:1.6; font-weight:500;
  color:var(--link-color);
}
ul.students-topics-list > li > a:hover > .text-box h3{
  text-decoration:underline;
}
.students .more{
  text-align:right;
}
.students .more > a,
.students .more > span{
  font-size:0.85em; line-height:1.8;
  color:var(--base-light-color);
  position:relative;
}
.students .more > a:hover,
.students .more > span:hover{
  color:var(--link-color);
}
.students .more > a::before,
.students .more > span::before{
  content:"";
  width:0.8em; height:auto;
  aspect-ratio:1/1;
  clip-path: polygon(25% 0, 25% 100%, 75% 50%);
  background:var(--base-light-color);
  position:absolute;
  top:50%; left:0;
  transform:translate(-120%,-45%);
}
.students .more > a:hover::before{
  background:var(--link-color);
}

ul.students-contents-list{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
}
ul.parents-contents-list{
  justify-content: space-around;
}
ul.students-contents-list > li{
  list-style:none;
  width:48%;
  margin-bottom:2.5em;
}
ul.students-contents-list > li > a,
ul.students-contents-list > li > div{
  display:block;
  text-decoration:none;
  color:var(--base-light-color);
}
ul.students-contents-list > li > a > figure,
ul.students-contents-list > li > div > figure{
  box-sizing:border-box;
  width:100%; height:auto;
  aspect-ratio:806/340;
  aspect-ratio:40/17;
  border:1px solid #ccc;
  overflow:hidden;
  margin-bottom:0.5em;
}
ul.parents-contents-list > li > a > figure{
  aspect-ratio: 1.0;
  border-radius: 50%;
}
ul.parents-contents-list > li > a > figcaption{
  text-align: center;
}
ul.students-contents-list > li > a > figure > img,
ul.students-contents-list > li > div > figure > img{
  width:100%; height:100%;
  object-fit:cover;
  transition:0.2s ease-in;
}
ul.students-contents-list > li > a:hover > figure > img,
ul.students-contents-list > li > div:hover > figure > img{
  transform:scale(1.1);
  transition:0.2s ease-in;
}
ul.students-contents-list > li > a h2,
ul.students-contents-list > li > div h2{
  font-size:1.1em; line-height:1.6;
  color:var(--key-color);
  margin-bottom:0.25em;
}
ul.students-contents-list > li > a h2 > span,
ul.students-contents-list > li > div h2 > span{
  display:inline-block;
  position:relative;
}
ul.students-contents-list > li > a[target="_blank"] h2 > span::after,
ul.students-contents-list > li > div[target="_blank"] h2 > span::after{
  font-family:var(--google-icon);
  content:"\e89e";
  font-size:1.1em; line-height:1;
  color:#999;
  position:absolute;
  top:50%; right:0;
  transform:translate(120%,-45%);
}
ul.students-contents-list > li > a:hover h2 > span,
ul.students-contents-list > li > div:hover h2 > span{
  text-decoration:underline;
}
ul.students-contents-list > li > a p,
ul.students-contents-list > li > div p{
  font-size:0.9em; line-height:1.8;
  margin-bottom:0;
}
ul.students-contents-list > li > a .more,
ul.students-contents-list > li > div .more{
  border-top:1px dashed #ccc;
  margin-top:1.0em;
  padding-top:0.25em;
}

ul.students-contents-list > li > div .more.more-borderless {
	border-top: none;
	padding-top: 0;
	margin-top: 0;
}

.students #page-title{
  width:100%; height:240px;
  margin-top:0;
  background-image:url(../../img/students/title_bg.jpg);
}
.students #page-title.audience-topics-title{
  height:200px;
  margin-top:100px;
}
.students #page-title.audience-topics-title > h1{
  font-family:var(--default-font);
  font-size:2.4em;
  line-height:1.3;
}
.students.parents #page-title{
  width:100%; height:240px;
  margin-top:0;
  background-image:url(../../img/parents/title_bg.png?20240716);
  background-color: white;
}
.students #page-title > h1{
  font-family:var(--students-font);
  font-size:1.6em; line-height:1.6;
}
.students #page-title > h1::after{
  content:attr(data-subtitle);
  display:block;
  font-family:var(--eng-font);
  font-size:0.6em; line-height:1.6; font-weight:500;
  white-space:nowrap;
  text-transform:uppercase;
  position:absolute;
  bottom:0; left:50%;
  transform:translate(-50%,100%);
}

ul.syllabus-cat-list{
  display:flex;
  margin-bottom:4.5em;
}
ul.syllabus-cat-list > li{
  list-style:none;
  margin-right:0.5em;
}
ul.syllabus-cat-list > li:last-child{
  margin-right:0;
}
ul.syllabus-cat-list > li > a{
  display:block;
  text-decoration:none;
  font-size:1.05em; line-height:2; font-weight:700;
  color:var(--base-color);
  border:1px solid #999;
  padding:0 2em;
  border-radius:0.1rem;
  position:relative;
}
ul.syllabus-cat-list > li > a::before{
  content:"";
  width:0.75em; height:auto;
  aspect-ratio:1/1;
  clip-path:polygon(100% 25%, 0 25%, 50% 75%);
  background:var(--base-light-color);
  position:absolute;
  bottom:0; left:50%;
  transform:translate(-50%,75%);
}
.syllabus-box{
  box-sizing:border-box;
  margin-bottom:5.0em;
}
.syllabus-box > h2{
  font-size:1.6em; line-height:1.8;
  color:var(--key-color);
  margin-bottom:0.5em;
}
.syllabus-box > h2 > span{
  display:inline-block;
  position:relative;
}
.syllabus-box > h2 > span::after{
  content:"";
  width:100%; height:2px;
  background:var(--key-color);
  position:absolute;
  bottom:0; left:0;
}
.syllabus-box > .credit{
  font-size:0.95em; line-height:1.8;
  margin-bottom:1.0em;
}
.syllabus-box > table.syllabus-table{
  width:100%;
  border-collapse:collapse;
}
.syllabus-box > table.syllabus-table > thead > tr{
  border:1px solid #ccc;
  border-bottom:2px double #999;
}
.syllabus-box > table.syllabus-table > thead > tr > th{
  font-size:0.85em; line-height:1.6; font-weight:500;
  text-align:center;
  background:#f9f9f9;
  padding:0.5em 0;
}
.syllabus-box > table.syllabus-table > thead > tr > th:nth-of-type(2),
.syllabus-box > table.syllabus-table > thead > tr > th:nth-of-type(3),
.syllabus-box > table.syllabus-table > thead > tr > th:nth-of-type(4){
  border-left:1px dashed #999;
  border-right:1px dashed #999;
}
.syllabus-box > table.syllabus-table > tbody > tr{
  border:1px solid #ccc;
}
.syllabus-box > table.syllabus-table > tbody > tr > th{
  width:44%;
  font-size:0.95em; line-height:1.8;
  text-align:left;
  vertical-align:top;
  padding:1.0em 1.0em;
}
.syllabus-box > table.syllabus-table > tbody > tr > td{
  width:12%;
  font-size:0.9em; line-height:1.8;
  text-align:center;
  vertical-align:top;
  padding:1.1em 0;
  border-left:1px dashed #999;
  border-right:1px dashed #999;
}
.syllabus-box > table.syllabus-table > tbody > tr > td:nth-of-type(4){
  width:20%;
  border-left:none;
  border-right:none;
}
.syllabus-box > ul.syllabus-subcat{
  display:flex;
}
.syllabus-box > ul.syllabus-subcat > li{
  list-style:none;
  margin-right:2.0em;
}
.syllabus-box > ul.syllabus-subcat > li > a{
  display:block;
  text-decoration:none;
  color:var(--base-light-color);
  padding-left:1.1em;
  position:relative;
}
.syllabus-box > ul.syllabus-subcat > li > a::before{
  content:"";
  width:0.7em; height:auto;
  aspect-ratio:1/1;
  clip-path:polygon(100% 25%, 0 25%, 50% 75%);
  background:var(--base-light-color);
  position:absolute;
  top:50%; left:0;
  transform:translate(0,-45%);
}
.syllabus-box > ul.syllabus-subcat > li > a:hover{
  color:var(--link-color);
  text-decoration:underline;
}
.syllabus-box > ul.syllabus-subcat > li > a:hover::before{
  background:var(--link-color);
}
.syllabus-box > h3{
  font-size:1.1em; line-height:1.4;
  border-left:4px solid var(--key-color);
  padding-left:0.5em;
  margin-bottom:0.75em;
  margin-top:3em;
}
.syllabus-box > h3 > span{
  font-size:0.85em; font-weight:500;
}

/* #header {
  position: relative;
  height: 100vh;
}  */

/* #video-area{
  position: fixed;
  z-index: 0;
  top: 0;
  right:0;
  left:0;
  bottom:0;
  overflow: hidden;
} */

/* #video {
  position: absolute;
  z-index: 0;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 177.77777778vh;
  height: 56.25vw;
  min-height: 100%;
  min-width: 100%;
} */
#video-area {
  width: 100vw;
}
#video {
  width: 100%;
}

#container-parents {
  background:#fff;
  position: relative;
  /* padding-top: 100px; */
  padding:100px max(20px, calc((100% - 1100px) / 2));
  width: 100vw;
}

#floating {
  position: relative;
  z-index: 100;
  pointer-events:none;
}
.students.parents header{
  background:#fff;
  z-index:500;
}

#floating-lb {
  position: fixed;
  bottom: -1%;
  left: -1%;
  width: 20%;
  animation: floating-xr 3.6s ease-in-out infinite alternate-reverse;
}

#floating-lb-1 {
  animation: floating-yt 2.2s ease-in-out infinite alternate-reverse;
}

#floating-lb-2 {
  animation: floating-yt 1.8s ease-in-out infinite alternate-reverse;  
}

#floating-lt {
  position: fixed;
  top: -1%;
  left: -1%;
  width: 20%;
  animation: floating-xl 3.6s ease-in-out infinite alternate-reverse;
}

#floating-lt-1 {
  animation: floating-yt 2.0s ease-in-out infinite alternate-reverse;
}

#floating-lt-2 {
  animation: floating-yt 1.8s ease-in-out infinite alternate-reverse;  
}

#floating-rb {
  position: fixed;
  bottom: -1%;
  right: -1%;
  width: 20%;
  animation: floating-xr 3.6s ease-in-out infinite alternate-reverse;
}

#floating-rb-1 {
  animation: floating-yb 1.8s ease-in-out infinite alternate-reverse;
}

#floating-rb-2 {
  animation: floating-yb 1.6s ease-in-out infinite alternate-reverse;
}

#floating-rt {
  position: fixed;
  top: -1%;
  right: -1%;
  width: 20%;
  animation: floating-xl 3.6s ease-in-out infinite alternate-reverse;
}

#floating-rt-1 {
  animation: floating-yb 1.8s ease-in-out infinite alternate-reverse;
}

#floating-rt-2 {
  animation: floating-yb 2.2s ease-in-out infinite alternate-reverse;  
}

@keyframes floating-xl {
  0% {
    transform: translateX(-15%);
  }
  100% {
    transform: translateX(0%);
  }
}

@keyframes floating-xr {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(15%);
  }
}

@keyframes floating-yt {
  0% {
    transform: translateY(-15%);
  }
  100% {
    transform: translateY(0%);
  }
}

@keyframes floating-yb {
  0% {
    transform: translateY(0%);
  }
  100% {
    transform: translateY(15%);
  }
}

@keyframes floating-map {
  0% {
    transform: translateY(0%);
  }
  100% {
    transform: translateY(5%);
  }
}

#hs-oc-map {
  animation: floating-map 4.0s ease-in-out infinite alternate-reverse;
}

.floating-y1 {
  animation: floating-map 4.0s ease-in-out infinite alternate-reverse;
}

.floating-y2 {
  animation: floating-map 4.2s ease-in-out infinite alternate-reverse;
}

.floating-y3 {
  animation: floating-map 3.8s ease-in-out infinite alternate-reverse;
}

.floating-y4 {
  animation: floating-map 4.4s ease-in-out infinite alternate-reverse;
}

/* ボタン均等 */
.wp-block-buttons.equal-width {
	display: grid;
	grid-auto-columns: 1fr;
	grid-auto-flow: column;
}

.wp-block-buttons.equal-width .wp-block-button,
.wp-block-buttons.equal-width .wp-block-button .wp-block-button__link {
	width: 100%;
}

#eckb-archive-page-container,
.eckb-kb-template {
  margin-top: 100px !important;
}

.eckb-category-archive-header {
  display: none !important;
}

#epkb-ml-search-box {
  padding: 0 !important;
}

#eckb-article-content-body a,
#eckb-article-content-body a:visited {
  color: blue;
}

@media (max-width:1200px){
  header,
  .scrolling header{
    padding-left:24px;
    padding-right:24px;
  }
  .shinxia-logo{
    width:185px;
  }
  #logo h1 a{
    gap:9px;
  }
  #logo h1 a .site-copy{
    font-size:0.64rem;
  }
  #global-nav > ul > li{
    font-size:0.82em;
  }
  #global-nav > ul{
    gap:0.75em;
  }
}

@media (max-width:1100px){
  header,
  .scrolling header{
    align-items:center;
    height:72px;
    padding:8px 72px 8px 20px;
  }
  #logo{
    display:flex;
    align-items:center;
    height:100%;
  }
  #logo h1,
  .scrolling #logo h1{
    margin:0;
    line-height:1;
  }
  .shinxia-logo,
  .scrolling #logo .shinxia-logo{
    width:175px;
    margin:0;
  }
  #logo h1 a,
  .scrolling #logo h1 a{
    gap:10px;
  }
  #logo h1 a .site-copy,
  .scrolling #logo h1 a .site-copy{
    display:block;
    font-size:0.64rem;
    line-height:1.4;
  }
  #header-nav{
    display:none;
  }
  #fixed-nav{
    display:block;
    position:fixed;
    top:16px;
    right:14px;
    z-index:10004;
  }
  .admin-bar #fixed-nav{
    top:48px;
  }
  #fixed-nav #hamburger{
    box-sizing:border-box;
    width:42px;
    height:42px;
    border-radius:50%;
    background:var(--key-color);
  }
  .drawer-open #fixed-nav #hamburger{
    background:transparent;
  }
  #global-nav.drawer-nav{
    position:fixed;
    z-index:10001;
    top:0;
    right:-100%;
    box-sizing:border-box;
    width:min(420px, 100%);
    height:100vh;
    height:100dvh;
    background:rgba(255,255,255,0.98);
    box-shadow:none;
    text-align:left;
    transition:right 0.45s cubic-bezier(0.19, 1, 0.22, 1);
  }
  .drawer-open #global-nav.drawer-nav{
    right:0;
    box-shadow:-4px 0 18px rgba(0,0,0,0.18);
  }
  #global-nav > ul.drawer-menu{
    display:block;
    box-sizing:border-box;
    width:100%;
    margin:0;
    padding:72px 42px 36px;
  }
  #global-nav > ul > li,
  .scrolling #global-nav > ul > li{
    display:block;
    margin:0;
    padding:0.55em 0;
    border-bottom:1px dashed #ccc;
    font-family:var(--default-font);
    font-size:0.9rem;
    font-weight:500;
    line-height:1.8;
    text-align:left;
  }
  #global-nav > ul > li.menu-home,
  #global-nav > ul > li.menu-section-label,
  #global-nav > ul > li.menu-audience{
    display:block;
  }
  #global-nav > ul > li.menu-section-label{
    margin-top:0.75em;
    padding:1em 0 0.3em;
    border-bottom:2px solid var(--key-color);
    color:var(--key-color);
    font-size:0.76rem;
    font-weight:700;
    letter-spacing:0.08em;
  }
  #global-nav > ul > li.menu-audience-label{
    margin-top:1em;
  }
  #global-nav > ul > li > a,
  .scrolling #global-nav > ul > li > a{
    display:block;
    min-height:0;
    padding:0;
    color:var(--base-color);
  }
  #global-nav > ul > li.menu-lms > a{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0.08em 0.9em;
    color:#fff;
  }
  #global-nav > ul > li > a:hover::after{
    display:none;
  }
  #index-billboard,
  #page-title{
    margin-top:72px;
  }
  .students #page-title.audience-topics-title{
    margin-top:72px;
  }
}

@media (max-width:640px){
  header,
  .scrolling header{
    height:64px;
    padding:0 56px 0 10px;
  }
  .shinxia-logo,
  .scrolling #logo .shinxia-logo{
    width:140px;
  }
  #logo h1 a .site-copy,
  .scrolling #logo h1 a .site-copy{
    font-size:0.55rem;
    line-height:1.2;
  }
  #fixed-nav{
    top:12px;
    right:6px;
  }
  .admin-bar #fixed-nav{
    top:58px;
  }
  #global-nav.drawer-nav{
    width:100%;
  }
  #global-nav > ul.drawer-menu{
    padding:64px 12% 30px;
  }
  #index-billboard,
  #page-title{
    margin-top:64px;
  }
  .students #page-title.audience-topics-title{
    margin-top:64px;
  }
}