@charset "utf-8";
/* CSS Document */

:root {
  --bs-nav-link-font-size: .64375rem;
}

html, body {
	margin:0;
	font-family:'Source Sans 3', Arial, Helvetica, sans-serif;
	color: #fff;
}

body {
  background: linear-gradient(-45deg, #92b6de, #577399, #34567d, #364663);
  background-size: 250% 250%;
  animation: gradient-animation 18s ease infinite;
}

body.home {
  height: 100vh;
}

@keyframes gradient-animation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.jp {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

main.container-fluid {
	height: 100%;
	padding: 0;
}

h1,
h2 {
	font-size: 1.875rem;
	font-weight: 300;
	letter-spacing: 0.5pt;
	transform: scale(1, 0.7);
}

h1 {
	font-size: 1.875rem;
	margin-bottom: 3.125rem;
}

h2 {
	font-size: 1.5625rem;
}

h2.jp,
h3.jp {
	letter-spacing: 1pt;
	transform: scale(1, 0.8);
}


h2.jp {
  font-size: 1.125rem;
}

a, 
a:hover, 
a:visited,
nav-link, 
nav-link:hover, 
nav-link:visited {
	color: #fff !important;
	text-decoration: none;
}

#wrapper_1, 
#wrapper_2 {
	height: auto;
	min-height: 50%;
	position: relative;
}

#container_1 {
	min-height: 18.75rem;
}

#container_1 > div {
	width: 100%;
	position: absolute;
	bottom: 0;
	margin-bottom: 5rem;
}

#container_2 {
	width: 100%;
	border-top: solid 1px #dcdddd;
	padding-top: 10rem;
}

#container_2 a {
	display: block;
	font-size: 1.375rem;
	font-weight: 100;
	letter-spacing: 0pt;
	transform: scale(1, 0.8);
}

#container_2 a span.jp {
	font-size: 1.0625rem;
}

body.inner-page .my-4 {
	margin-top: 1.875rem !important;
	margin-bottom: 1.875rem !important;
}

body.inner-page header.clearfix {
	height: 7.8125rem;
}

body.inner-page h1 {
	font-size: 1.875rem;
	margin-bottom: 0;
}

body.inner-page header.clearfix h1 {
	font-size: 1.25rem;
	letter-spacing: 0.8pt;
	transform: scale(1, 0.7);
}

body.inner-page h1.jp {
	font-size: 1.25rem;
	letter-spacing: 0pt;
	margin-top: 0;
	margin-bottom: 1.125rem;
}

body.inner-page h2,
body.inner-page h3 {
	transform: scale(1, 0.8);
}

body.inner-page h2 {
	margin-top: 3.125rem;
	margin-bottom: 0;
	font-size: 1.35rem;
}

body.inner-page h2.jp {
	margin-top: 0;
	font-size: .875rem;
	margin-bottom: 1.125rem;
}

body.inner-page header.clearfix h2 {
	margin-top: 1px;
	font-size: .8125rem;
	letter-spacing: 0;
	transform: scale(1, 0.8);
}

body.inner-page header.clearfix h2 span.jp {
	font-size: .7rem;
}

body.inner-page h3 {
	margin-top: 2rem;
  margin-bottom: 0;
  font-size: 1.25rem;
	font-weight: 300;
  border: 0;
}

body.inner-page h3.jp {
  font-size: .85rem;
  margin-top: .25rem;
  margin-bottom: .4rem;
  padding-bottom: .25rem;
  border-bottom: 1px solid #fff;
  transform: scale(1, .95);
}

.video-frame {
  position: relative;
}

.pdf-frame {
  background-color: #fff;
}

.pdf-frame img, 
.video-frame img {
  max-width: 100%;
}

a.pdf-link, 
a.video-link {
  text-decoration: underline;
 }

a.video-link {
  color: #cfe2ff !important;
}

.playbutton {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 5;
}

.playbutton:hover {
  opacity: 1;
}

body.inner-page .col-6.px-5 {
	padding-left: 2.5rem !important;
	padding-right: 2.5rem !important;
}

body.inner-page ul.nav {
	display: block;
	margin-top: 3.375rem;
}

body.inner-page ul.nav li.nav-item {
	padding: .75rem 0 2.25rem;
	height: 1.875rem;
	font-size: 1.125rem;
	font-weight: 100;
	letter-spacing: .5pt;
}

body.inner-page ul.nav li.nav-item.jp {
	font-size: 1rem;
}

body.inner-page p {
	padding: .375rem 0 .1875rem;
	margin: 0;
	font-size: 1rem;
  letter-spacing: 1%;
  font-weight: 370;
}

body.inner-page ul {
	margin-top: .75rem;
}

body.inner-page ul:last-of-type {
	margin-bottom: 0;
}

body.inner-page p.jp {
	padding: 0 0 .375rem;
  font-size: .85rem;
  line-height: 1.5rem;
  font-weight: var(--bs-body-font-weight);
}

.bordered-content {
	border-left-width: 1px;
	border-left-color: #dcdddd;
	border-left-style: solid;
}

.img_drop img {
	height: 5.5625rem;
	aspect-ratio: 1 / 1;
}

.img_drop img.video-thumbnail {
	aspect-ratio: unset;
	width: 5.5625rem;
	object-fit: cover;
	cursor: pointer;
  margin-top: .6rem;
}

.video-mobile {
	cursor: pointer;
}

.img_drop div {
	padding-left: 1.25rem;
}

.mail a {
	text-decoration: underline;
}

footer.footer {
	margin-top: 2.5rem;
	padding: 1.25rem 0 1.5rem;
	font-size: .8125rem;
}

footer.footer div.text-end {
  margin-right: 2.3rem;
}

body.videos .col-1, 
body.programs .col-1, 
body.videos .k-tab-sidebar-listing .col-1, 
body.programs .k-tab-sidebar-listing .col-1 {
  width: unset;
}

body.programs .modal__container {
  background-color: #d5dae0;
}

button.modal__close {
  font-size: 2rem;
}

.k-video .chapter-container {
  max-height: 293px !important;
}

@media (min-width: 1024px) {
  .k-video .chapter-container {
    max-height: 381px !important;
  }
}

@media (min-width: 1200px) {
  .k-video .chapter-container {
    max-height: 460px !important;
  }
}

@media (max-width: 1024px) and (orientation: portrait) {
  .k-video .chapter-container {
    max-height: unset !important;
  }
}

body.inner-page .nav-link {
  font-size: 1.125rem;
}

body.inner-page .jp .nav-link {
  font-size: 1rem;
}

@media only screen and (min-device-width: 320px) 
	and (max-device-width: 480px) and (orientation: portrait) {

	#container_1 > div {
		margin-bottom: 1.5625rem;
	}
	
	h1 {
		font-size: 1.25rem;
		margin-bottom: 1.25rem;
		letter-spacing: .3pt;
		line-height: 175%;
	}
	
	body.inner-page h1.jp {
		margin-top: -.5rem;
	}
		
	body.inner-page header.clearfix {
		height: auto;
	}
	
	body.inner-page header.clearfix h1 {
		font-size: .8rem;
	}

	body.inner-page header.clearfix h2 {
		font-size: .65rem;
		marign-top: 0;
	}
		
	body.inner-page header.clearfix h2 span.jp {
		font-size: .5rem;
	}
		
	body.inner-page ul.nav {
		margin-top: 0;
		margin-bottom: .6rem;
		display: flex;
		justify-content: center;
	}
		
  body.inner-page ul.nav li.nav-item {
    padding: 0;
  }

  .mobile .nav-item {
    background-color: #f2eabe;
    flex-basis: 0;
    flex-grow: 1;
    white-space: nowrap;
    font-size: 10px;
    cursor: pointer;
    border-top: solid 1px #888;
    border-bottom: solid 1px #888;
    border-left: solid 1px #888;
    background: #000 linear-gradient(to bottom, #333333 0%, #464646 38%, #000 100%);
  }
    
  body.inner-page ul.nav.mobile li.nav-item {
    font-weight: var(--bs-body-font-weight);
    font-size: .625rem;
    letter-spacing: unset;
  }
    
  body.inner-page ul.nav.mobile li.nav-item a {
    line-height: 1.2;
    letter-spacing: -.5px;
  }

  body.inner-page ul.nav.mobile li.nav-item.jp a {
    line-height: var(--bs-body-line-height);
  }

  .mobile .nav-item.active {
    background: linear-gradient(to bottom, #b9b9bb 0%, #818285 38%, #818285 100%);
  }

  .mobile .nav-item:first-of-type {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
  }

  .mobile .nav-item:last-of-type {
    border-right: solid 1px #888;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
  }
    
  body.inner-page .mobile .nav-link {
    font-size: var(--bs-nav-link-font-size);
  }

  body.inner-page .mobile .jp .nav-link {
    font-size: .5625rem;
    padding-top: .5rem;
  }

	#container_2 a {
		font-size: .8125rem;
	}
	
	#container_2 a span.jp {
		font-size: .75rem;
	}
	
	.border-light-subtle {
		border-color: #dcdddd;
	}

	.img_drop div {
		padding-left: 0;
	}
		
		.bordered-content {
			border: none;
		}

	footer.footer {
		margin-top: .625rem;
		font-size: .625rem;
	}
}

@media only screen and (max-width: 768px) {

  body {
    letter-spacing: 0;
  }

  #container_1 h1 span {
    display: block;
  }
  #container_2 {
    padding-top: 3.125rem;
  }
}

}
