@charset "UTF-8";

/*--------------------------------------------
HEADER
---------------------------------------------*/

@keyframes fadein {
		0% {
				filter: blur(100px)
		}
		100% {
				filter: blur(0px)
		}
}

#header .top {
		width: 100vw;
		height: 100vh;
		margin: 0;
		padding: 0
}

#header .fadeIn {
		animation-name: fadein;
		animation-duration: 1s;
		animation-timing-function: ease-out;
		animation-fill-mode: forwards;
		overflow-x: hidden
}

@media screen and (max-width: 1024px) {
		#header {
				height: auto;
				background: url(../images/home/bg_header.png) center 0/ cover no-repeat;
				padding-top: 0
		}
		#header .top {
				width: 100vw;
				height: 74vh;
				margin: 0;
				padding: 0
		}
		.fixed-head.transform {
				padding-bottom: calc(15.5 * 100vw / 1024)
		}
		.topImage.up.is-sp {
				position: absolute;
				width: calc(100vw - 20px);
				height: auto;
				left: 10px;
				top: 20px
		}
		.topImage.bottom.is-sp {
				position: absolute;
				width: calc(100vw - 20px);
				height: auto;
				left: 10px;
				bottom: 10px
		}
}

@media print, screen and (min-width: 1025px) {
		#header {
				background: url(../images/home/bg_header.png) center 0/ cover no-repeat;
				width: 100vw;
				height: 95vh;
				margin: 0;
				padding: 0
		}
		#header::before {
				content: '';
				position: absolute;
				top: 0;
				right: 0;
				bottom: 0;
				left: 0
		}
		.topImage.is-pc {
				position: absolute;
				width: auto;
				height: 90vh;
				left: 50%;
				top: 48%;
				transform: translateX(-50%) translateY(-50%)
		}
}


/*--------------------------------------------
LIVE
---------------------------------------------*/

#live .iframe-container {
		position: relative;
		height: 0;
		padding: 0 0 56.25%;
		overflow: hidden
}

#live iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%
}

@media screen and (max-width: 1024px) {
		#live {
				width: 100%;
				padding: calc(34 * 100vw / 1024)
		}
}

@media print, screen and (min-width: 1025px) {
		#live {
				width: 100%;
				padding: 28px 81px
		}
}


/*--------------------------------------------
LOCAL NAV
---------------------------------------------
#localNav {
	z-index: 11;
    position: relative;
}
#localNav::before{
	content: '';
	background-color: #f2f4f4;
	opacity:50%;
}
#localNav a {
	color: #000;
}
@media screen and (max-width: 1024px){
	#localNav span {
		height: calc( 60 * 100vw / 1024 );
	}
	#localNav a .jp {
		font-size: 1.8rem;
		letter-spacing: .04em;
	}
	#localNav a .en {
		font-size: 2.4rem;
	}
}*/


/*--------------------------------------------
LEAD
---------------------------------------------*/

#lead {
		padding-bottom: 20px;
		padding-top: 100px
}

#lead .wrap {
		align-items: center;
		border: 2px solid #ccc;
		display: flex;
		flex-direction: column;
		padding: 50px
}

#lead .wrap img {
		width: 90%;
		height: 90%
}

#lead .title01 {
		text-align: center
}

@media screen and (max-width: 1024px) {
		#lead {
				padding-bottom: 20px;
				padding-top: 20px
		}
		#lead .wrap {
				border: 0;
				padding: calc(30 * 100% / 1024)
		}
		#lead .title01 {
				padding-bottom: 40px
		}
}

@media print, screen and (min-width: 1025px) {}


/*--------------------------------------------
STREAMING table
---------------------------------------------*/

table th, td {
		border: 1px solid #4d4d4d
}


/*　スクロールバーの実装 */

.timetable {
		display: block;
		overflow-y: scroll;
		height: calc(100vh/2);
		border: 1px solid;
		border-collapse: collapse;
		border-spacing: 0;
		width: 100%;
		table-layout: fixed;
		height: 700px
}

.timetable thead {
		height: 50px;
		text-align: center;
		font-weight: 600;
		font-size: 120%
}

.timetable tbody {
		overflow-x: hidden;
		overflow-y: scroll;
		height: 1500px
}

.timetable thead td {
		width: 100px;
		position: sticky;
		top: 0;
		z-index: 1;
		background: #E4007F;
		border: 1px solid #4d4d4d;
		color: #fff;
		vertical-align: middle
}

.timetable thead th {
		width: 500px;
		position: sticky;
		top: 0;
		z-index: 1;
		background: #E4007F;
		border: 1px solid #4d4d4d;
		color: #fff;
		vertical-align: middle
}

.timetable tbody th {
		height: 162px;
		background: #8fc31f;
		color: #fff;
		font-weight: 600
}

.timetable tbody td {
		width: 100px;
		padding: 10px;
		vertical-align: top
}

.timetable .empty {
		background-color: #4d4d4d
}

.timetable tbody tr {
		height: 27px
}

.timetable tbody strong {
		font-weight: 600
}

.timetable table th {
		width: 452px;
		padding-left: 30px;
		padding-right: 30px;
		padding-top: 22px;
		padding-bottom: 22px
}

@media screen and (max-width: 1024px) {
		.timetable td {
				font-size: 120%;
				line-height: 1.3
		}
		.timetable thead th {
				font-size: 120%
		}
}

@media print, screen and (min-width: 1025px) {
		.timetable td {
				line-height: 1.5
		}
}


/*--------------------------------------------
STREAMING
---------------------------------------------*/

#streaming li {
		display: flex
}

#streaming .jp p {
		line-height: 1.75
}

#streaming li+li {
		border-top: 1px solid #000
}

#streaming .datetime {
		color: var(--accentColor01);
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 600;
		letter-spacing: .02em;
		line-height: 1.6
}

@media screen and (max-width: 1024px) {
		#streaming li {
				flex-direction: column
		}
		#streaming li+li {
				margin-top: calc(40 * 100vw / 1024);
				padding-top: calc(40 * 100vw / 1024)
		}
		#streaming .text {
				margin-top: calc(30 * 100vw / 1024)
		}
		#streaming dl:not(:nth-child(1)) {
				margin-top: calc(40 * 100vw / 1024)
		}
		#streaming .datetime {
				width: 100%
		}
		#streaming .texts02 .photo {
				text-align: center
		}
		#streaming .texts02 .photo img {
				width: 50%
		}
}

@media print, screen and (min-width: 1025px) {
		#streaming li {
				align-items: first baseline;
				justify-content: space-between
		}
		#streaming li+li {
				margin-top: 25px;
				padding-top: 25px
		}
		#streaming .texts01 .text {
				/*margin-left: 80px;*/
				/*width: 427px;*/
		}
		#streaming dl:not(:nth-child(1)) {
				margin-top: 20px
		}
		#streaming .datetime {
				width: 100%
		}
		#streaming .texts02 .text {
				padding-left: 30px;
				width: 80%
		}
		#streaming .texts02 .photo {
				width: 20%
		}
		#streaming .texts02 .photo img {
				width: 100%
		}
}


/*--------------------------------------------
programs
---------------------------------------------*/

#programs .profile {
		margin-bottom: 60px
}

#programs .profile h3:before {
		height: 20px;
		top: 2px;
		width: 40px
}

#programs .profile .texts01 .photo img {
		width: 100%
}

@media screen and (max-width: 1024px) {
		#programs .profile .texts01 {
				margin-bottom: 30px
		}
		#programs .profile .texts01 .photo {
				margin-bottom: 20px
		}
}

@media print, screen and (min-width: 1025px) {
		#programs .profile {
				margin-bottom: 60px
		}
		#programs .profile .texts01 {
				margin-bottom: 30px;
				align-items: flex-start;
				display: flex;
				justify-content: left
		}
		#programs .profile .texts01 .photo {
				width: 15%
		}
		#programs .profile .texts01 .text {
				padding-left: 30px;
				width: 85%
		}
}


/*--------------------------------------------
OUTLINE
---------------------------------------------*/

#outline, #outline .title01, #outline a {
		color: #fff
}

#outline .jp p {
		line-height: 1.75
}

#outline .en {
		font-weight: 600;
		letter-spacing: .04em
}

#outline dl {
		display: flex;
		margin-top: 1em
}

#outline dt {
		flex-shrink: 0
}

#outline dt:after {
		content: '：'
}

@media screen and (max-width: 1024px) {
		#outline {
				background: url(../images/common/bg_head_sp.png) center 0/ cover no-repeat
		}
		#outline dl {
				flex-direction: column
		}
		#outline p, #outline dt, #outline dd {
				letter-spacing: .05em
		}
}

@media print, screen and (min-width: 1025px) {
		#outline {
				background: url(../images/common/bg_overview_pc.png) center 0/ cover no-repeat
		}
}


/*--------------------------------------------
Online Contents
---------------------------------------------*/

@media screen and (max-width: 1024px) {
		#online .online_button {}
		#online .online_button .link {
				width: 80%;
				margin: 20px auto
		}
		#online .online_button .link a {
				height: 65px;
				align-items: center;
				color: #fff;
				display: flex;
				font-family: 'Noto Sans JP', sans-serif;
				font-weight: 700;
				letter-spacing: .05em;
				border-radius: 4px;
				font-size: 4.5rem;
				margin-top: auto;
				padding-left: 70px
		}
		#online .online_button .link a span {
				align-items: center;
				display: flex
		}
		#online .online_button .link .games_link a {
				background-color: var(--accentColor02)
		}
		#online .online_button .link .usc_link a {
				background-color: var(--accentColor04)
		}
		#online .online_button .link .videos_link a {
				background-color: var(--accentColor03)
		}
		#online .online_button .link .games_link a:after {
				background: url(../images/home/play.svg) 0 0/ contain no-repeat;
				bottom: 50%;
				content: '';
				height: 50px;
				margin-bottom: -43px;
				position: absolute;
				left: 20px;
				width: 35px
		}
		#online .online_button .link .usc_link a:after {
				background: url(../images/home/about.svg) 0 0/ contain no-repeat;
				bottom: 50%;
				content: '';
				height: 50px;
				margin-bottom: -33px;
				position: absolute;
				left: 20px;
				width: 35px
		}
		#online .online_button .link .videos_link a:after {
				background: url(../images/home/watch.svg) 0 0/ contain no-repeat;
				bottom: 50%;
				content: '';
				height: 50px;
				margin-bottom: -40px;
				position: absolute;
				left: 20px;
				width: 35px
		}
}

@media print, screen and (min-width: 1025px) {
		#online .online_button {
				display: flex
		}
		#online .online_button .link {
				width: 100%;
				margin: 50px 10px
		}
		#online .online_button .link a {
				height: 80px;
				align-items: center;
				color: #fff;
				display: flex;
				font-family: 'Noto Sans JP', sans-serif;
				font-weight: 700;
				letter-spacing: .05em;
				border-radius: 4px;
				font-size: 2.3rem;
				margin-top: auto;
				padding-left: 70px
		}
		#online .online_button .link a span {
				align-items: center;
				display: flex
		}
		#online .online_button .link .games_link a {
				background-color: var(--accentColor02)
		}
		#online .online_button .link .usc_link a {
				background-color: var(--accentColor04)
		}
		#online .online_button .link .videos_link a {
				background-color: var(--accentColor03)
		}
		#online .online_button .link .games_link a:after {
				background: url(../images/home/play.svg) 0 0/ contain no-repeat;
				bottom: 50%;
				content: '';
				height: 50px;
				margin-bottom: -43px;
				position: absolute;
				left: 20px;
				width: 35px
		}
		#online .online_button .link .usc_link a:after {
				background: url(../images/home/about.svg) 0 0/ contain no-repeat;
				bottom: 50%;
				content: '';
				height: 50px;
				margin-bottom: -33px;
				position: absolute;
				left: 20px;
				width: 35px
		}
		#online .online_button .link .videos_link a:after {
				background: url(../images/home/watch.svg) 0 0/ contain no-repeat;
				bottom: 50%;
				content: '';
				height: 50px;
				margin-bottom: -40px;
				position: absolute;
				left: 20px;
				width: 35px
		}
}


/*--------------------------------------------
Exhibition
---------------------------------------------*/

#exhibition .exhibition_link {
		width: 50%;
		margin: 50px auto
}

#exhibition .exhibition_link a {
		align-items: center;
		background-color: var(--accentColor01);
		color: #fff;
		display: flex;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 700;
		justify-content: center;
		letter-spacing: .05em;
		border-radius: 4px;
		margin-top: auto;
		order: 4;
		text-align: center
}

#exhibition .exhibition_link a span {
		align-items: center;
		display: flex
}

@media screen and (max-width: 1024px) {
		#exhibition .exhibition_link {
				width: 80%;
				margin: 20px auto
		}
		#exhibition .exhibition_link a {
				height: 65px;
				font-size: 4.5rem
		}
}

@media print, screen and (min-width: 1025px) {
		#exhibition .exhibition_link a {
				height: 80px;
				font-size: 2.7rem
		}
}


/*--------------------------------------------
PREFACE
---------------------------------------------*/

#preface dl {
		/*background-color: #1a1a1a;*/
		background-color: var(--accentColor01);
		color: #fff;
		display: flex
}

#preface dt {
		display: flex
}

#preface dt img {
		width: auto
}

#preface dt div {
		display: flex;
		flex-direction: column;
		justify-content: center
}

#preface dt span {
		display: block
}

#preface dt span:nth-child(1) {
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 700;
		letter-spacing: .06em
}

#preface dt span:nth-child(2) {
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 700;
		letter-spacing: .04em
}

#preface dd {
		display: flex;
		flex-direction: column
}

#preface dd span:nth-child(1) {
		font-family: 'Noto Sans JP', sans-serif;
		letter-spacing: .06em;
		line-height: 1.5
}

#preface dd span:nth-child(2) {
		font-family: 'Noto Sans JP', sans-serif;
		letter-spacing: .02em;
		line-height: 1.42
}

@media screen and (max-width: 1024px) {
		#preface li:not(:last-child) {
				margin-bottom: calc(90 * 100vw / 1024)
		}
		#preface dl {
				flex-direction: column;
				margin-bottom: calc(60 * 100vw / 1024)
		}
		#preface dt {
				position: relative
		}
		#preface dt img {
				height: calc(149 * 100vw / 1024)
		}
		#preface dt div {
				padding: calc(30 * 100% / 1024);
				z-index: 2
		}
		#preface dt div span:nth-child(1) {
				font-size: 3.3rem
		}
		#preface dt div span:nth-child(2) {
				font-size: 2.4rem;
				margin-top: calc(14 * 100vw / 1024)
		}
		#preface dt:after {
				background: url(../images/ui/logo/badge_geidai01.svg) 0 0/ contain no-repeat;
				bottom: 50%;
				content: '';
				height: calc(99 * 100vw / 1024);
				margin-bottom: calc((-99 / 2) * 100vw / 1024);
				position: absolute;
				right: calc(26 * 100% / 1024);
				width: calc(93 * 100% / 1024)
		}
		#preface dd {
				border-top: .5px solid #fff;
				padding: calc(26 * 100vw / 1024)
		}
		#preface dd span:nth-child(1) {
				font-size: 2.7rem
		}
		#preface dd span:nth-child(2) {
				font-size: 2.3rem;
				margin-top: calc(10 * 100vw / 1024)
		}
}

@media print, screen and (min-width: 1025px) {
		#preface li {
				margin-bottom: 60px
		}
		#preface dl {
				align-items: center;
				margin-bottom: 40px;
				position: relative
		}
		#preface dl:after {
				background: url(../images/ui/logo/badge_geidai01.svg) 0 0/ contain no-repeat;
				bottom: 50%;
				content: '';
				height: 86px;
				margin-bottom: -43px;
				position: absolute;
				right: 30px;
				width: 80px
		}
		#preface dt {
				width: 345px
		}
		#preface dt img {
				height: 130px
		}
		#preface dt div {
				padding-left: 20px
		}
		#preface dt span:nth-child(1) {
				font-size: 2rem
		}
		#preface dt span:nth-child(2) {
				font-size: 1.6rem;
				margin-top: 10px
		}
		#preface dd {
				border-left: 1px solid #fff;
				min-height: 98px;
				padding: 16px 30px;
				width: 755px
		}
		#preface dd span:nth-child(1) {
				font-size: 1.4rem
		}
		#preface dd span:nth-child(2) {
				font-size: 1.4rem;
				margin-top: 5px
		}
}

#preface h3 {
		font-weight: 700;
		position: relative
}

#preface .en h3 {
		letter-spacing: .04em
}

#preface h3:after {
		content: '';
		left: 0;
		position: absolute;
		top: 100%
}

#preface .jp h3:after {
		/*background-color: var(--accentColor02)*/
		/*background-color: #8dc21f;*/
}

#preface .en h3:after {
		/*background-color: var(--accentColor02)*/
		/*background-color: #e0c2a2;*/
}

#preface .en p {
		/*font-weight: 600;*/
}

#preface p+p {
		margin-top: 1em
}

@media screen and (max-width: 1024px) {
		#preface h3 {
				font-size: 3.4rem;
				letter-spacing: .02em;
				line-height: 1.2;
				margin-bottom: calc(24 * 100vw / 1024);
				padding-bottom: calc(14 * 100vw / 1024)
		}
		/*#preface h3:after {
				height: calc(6 * 100vw / 1024);
				width: calc(400 * 100vw / 1024)
		}*/
}

@media print, screen and (min-width: 1025px) {
		#preface h3 {
				font-size: 2rem;
				margin-bottom: 12px;
				padding-bottom: 10px
		}
		/*#preface h3:after {
				height: 3px;
				width: 50%
		}*/
}


/*--------------------------------------------
SQUARE ENIX
---------------------------------------------*/

#squareenix dl {
		/*background-color: #1a1a1a;*/
		background-color: var(--accentColor01);
		color: #fff;
		display: flex
}

#squareenix dt {
		display: flex
}

#squareenix dt img {
		width: auto
}

#squareenix dt div {
		display: flex;
		flex-direction: column;
		justify-content: center
}

#squareenix dt span {
		display: block
}

#squareenix dt span:nth-child(1) {
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 700;
		letter-spacing: .06em
}

#squareenix dt span:nth-child(2) {
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 700;
		letter-spacing: .04em
}

#squareenix dd {
		display: flex;
		flex-direction: column
}

#squareenix dd span:nth-child(1) {
		font-family: 'Noto Sans JP', sans-serif;
		letter-spacing: .06em;
		line-height: 1.5
}

#squareenix dd span:nth-child(2) {
		font-family: 'Noto Sans JP', sans-serif;
		letter-spacing: .02em;
		line-height: 1.42
}

@media screen and (max-width: 1024px) {
		#squareenix li:not(:last-child) {
				margin-bottom: calc(90 * 100vw / 1024)
		}
		#squareenix dl {
				flex-direction: column;
				margin-bottom: calc(60 * 100vw / 1024)
		}
		#squareenix dt {
				position: relative
		}
		#squareenix dt img {
				height: calc(149 * 100vw / 1024)
		}
		#squareenix dt div {
				padding-left: calc(30 * 100% / 1024);
				z-index: 2
		}
		#squareenix dt div span:nth-child(1) {
				font-size: 4.3rem
		}
		#squareenix dt div span:nth-child(2) {
				font-size: 2.4rem;
				margin-top: calc(14 * 100vw / 1024)
		}
		#squareenix dt:after {
				/*background: url("../images/ui/logo/sqenixlogo.svg") 0 0/ contain no-repeat;*/
				top: 40%;
				content: '';
				height: calc(99 * 100vw / 1024);
				margin-bottom: calc((-99 / 2) * 100vw / 1024);
				position: absolute;
				right: calc(26 * 100% / 1024);
				width: calc(293 * 100% / 1024)
		}
		#squareenix dd {
				border-top: .5px solid #fff;
				padding: calc(26 * 100vw / 1024)
		}
		#squareenix dd span:nth-child(1) {
				font-size: 2.7rem
		}
		#squareenix dd span:nth-child(2) {
				font-size: 2.3rem;
				margin-top: calc(10 * 100vw / 1024)
		}
}

@media print, screen and (min-width: 1025px) {
		#squareenix li {
				margin-bottom: 60px
		}
		#squareenix dl {
				align-items: center;
				margin-bottom: 40px;
				position: relative
		}
		#squareenix dl:after {
				/*background: url("../images/ui/logo/sqenixlogo.svg") 0 0/ contain no-repeat;*/
				top: 40%;
				content: '';
				height: 186px;
				margin-bottom: -43px;
				position: absolute;
				right: 30px;
				width: 280px
		}
		#squareenix dt {
				width: 345px
		}
		#squareenix dt img {
				height: 130px
		}
		#squareenix dt div {
				padding-left: 20px
		}
		#squareenix dt span:nth-child(1) {
				font-size: 2rem
		}
		#squareenix dt span:nth-child(2) {
				font-size: 1.6rem;
				margin-top: 10px
		}
		#squareenix dd {
				border-left: 1px solid #fff;
				min-height: 98px;
				padding: 16px 30px;
				width: 755px
		}
		#squareenix dd span:nth-child(1) {
				font-size: 1.4rem
		}
		#squareenix dd span:nth-child(2) {
				font-size: 1.4rem;
				margin-top: 5px
		}
}

#squareenix h3 {
		font-weight: 700;
		position: relative
}

#squareenix .en h3 {
		letter-spacing: .04em
}

#squareenix h3:after {
		content: '';
		left: 0;
		position: absolute;
		top: 100%
}

#squareenix .jp h3:after {
		/*background-color: var(--accentColor02)*/
}

#squareenix .en h3:after {
		/*background-color: var(--accentColor02)*/
}

#squareenix .en p {
		/*font-weight: 600;*/
}

#squareenix p+p {
		margin-top: 1em
}

@media screen and (max-width: 1024px) {
		#squareenix h3 {
				font-size: 3.4rem;
				letter-spacing: .02em;
				line-height: 1.2;
				margin-bottom: calc(24 * 100vw / 1024);
				padding-bottom: calc(14 * 100vw / 1024)
		}
		/*#squareenix h3:after {
				height: calc(2 * 100vw / 1024);
				width: calc(400 * 100vw / 1024)
		}*/
}

@media print, screen and (min-width: 1025px) {
		#squareenix h3 {
				font-size: 2rem;
				margin-bottom: 12px;
				padding-bottom: 10px
		}
		/*#squareenix h3:after {
				height: 2px;
				width: 50%
		}*/
}


/*--------------------------------------------
CREDIT
---------------------------------------------*/

#credit {
		/*background-color: var(--accentColor01);*/
}

#credit, #credit a {
		color: var(--accentColor01)
}

#credit dt {
		font-weight: 700;
		font-size: 120%
}

#credit dt:after {
		content: '：'
}

#credit .en dd {
		/*font-weight: 600;*/
}

#credit dl dl dt {
		font-weight: 600;
		font-size: 100%
}

@media screen and (max-width: 1024px) {
		#credit dl:not(:nth-child(1)), #credit .logo dl, #credit p {
				margin-top: calc(40 * 100vw / 1024)
		}
		#credit dt, #credit dd {
				letter-spacing: .02em
		}
		#credit .logo img {
				height: calc(102 * 100vw / 1024);
				margin-top: calc(14 * 100vw / 1024)
		}
		#credit .campus_map {
				width: 100%;
				height: auto;
				margin: 30px auto
		}
		#credit .campus_map img {
				width: 100%;
				height: auto
		}
}

@media print, screen and (min-width: 1025px) {
		#credit dl:not(:nth-child(1)), #credit .logo dl, #credit p {
				margin-top: 20px
		}
		#credit .logo {
				display: flex;
				position: relative;
				align-items: flex-end
		}
		#credit .logo img {
				flex-shrink: 0;
				margin-left: 10px;
				width: 162px
		}
		#credit .campus_map {
				width: 50%;
				height: auto;
				margin: 30px auto
		}
		#credit .campus_map img {
				width: 100%;
				height: auto
		}
}

.ggmap {
		width: 100%;
		position: relative;
		padding-top: 56.25%;
		margin-top: 15px
}

.ggmap iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%
}

#credit table {
		border-collapse: collapse;
		background-color: #ffffff;
		width: 100%;
		border-style: solid;
		border-width: 1px;
		border-color: #dddddd;
		table-layout: auto;
		word-break: break-all;
		word-wrap: break-word;
		margin-top: 15px
}

#credit table thead th, #credit table tbody th, #credit table tbody td {
		border-style: solid;
		border-width: 1px;
		border-color: #dddddd;
		padding: 8px 11px;
		/*font-size: 12px;
	line-height: 18px;*/
		color: #000000
}

#credit table thead th, #credit table tbody th {
		background-color: #eeeeee
}

#credit table.table_list {
		border-width: 0
}

#credit table.table_list thead th, #credit table.table_list tbody td {
		border-width: 0;
		vertical-align: top;
		padding: 4px 0;
		background-color: #ffffff
}

#credit table.table_noborder, #credit table.table_noborder thead th, #credit table.table_noborder tbody td {
		border: 0
}

#credit table.table_list tbody td:first-child {
		white-space: nowrap;
		vertical-align: top;
		padding: 4px 0;
		width: 1px;
		background-color: #ffffff
}


/*--------------------------------------------
GEIDAI-USC
---------------------------------------------*/

#message-from-usc h3 {
		font-weight: 700;
		position: relative
}

#message-from-usc .en h3 {
		letter-spacing: .04em
}

#message-from-usc h3:after {
		content: '';
		left: 0;
		position: absolute;
		top: 100%
}

#message-from-usc .jp h3:after {
		background-color: var(--accentColor02)
}

#message-from-usc .en h3:after {
		background-color: var(--accentColor02)
}

#message-from-usc .en p {
		/*font-weight: 600;*/
}

#message-from-usc p+p {
		margin-top: 1em
}

@media screen and (max-width: 1024px) {
		#message-from-usc h3 {
				font-size: 3.4rem;
				letter-spacing: .02em;
				line-height: 1.2;
				margin-bottom: calc(24 * 100vw / 1024);
				padding-bottom: calc(14 * 100vw / 1024)
		}
		#message-from-usc h3:after {
				height: calc(6 * 100vw / 1024);
				width: calc(400 * 100vw / 1024)
		}
}

@media print, screen and (min-width: 1025px) {
		#message-from-usc h3 {
				font-size: 2rem;
				margin-bottom: 12px;
				padding-bottom: 10px
		}
		#message-from-usc h3:after {
				height: 3px;
				width: 50%
		}
}

#geidai-usc h2 {
		align-items: center;
		border: 2px solid #ccc;
		display: flex;
		flex-direction: column
}

#geidai-usc h2 span {
		text-align: center
}

#geidai-usc h2>span {
		align-items: center;
		display: flex;
		flex-direction: column;
		font-family: 'Noto Serif JP', sans-serif;
		font-weight: 500;
		letter-spacing: .08em;
		line-height: 1.29
}

#geidai-usc span>span {
		font-family: 'Noto Serif JP', sans-serif;
		font-weight: 700;
		letter-spacing: .02em;
		line-height: 1.28
}

#geidai-usc h2>span:after {
		background: url(../images/ui/icon/cross01.svg) 0 0/ contain no-repeat;
		content: ''
}

#geidai-usc .geidai:before {
		background: url(../images/ui/logo/badge_geidai02.svg) 0 0/ contain no-repeat;
		content: ''
}

#geidai-usc .usc:before {
		background: url(../images/ui/logo/logo_usc01.svg) 0 0/ contain no-repeat;
		content: ''
}

@media screen and (max-width: 1024px) {
		#geidai-usc {
				padding-bottom: calc(30 * 100vw / 1024);
				padding-top: calc(60 * 100vw / 1024)
		}
		#geidai-usc h2 {
				margin-bottom: calc(40 * 100vw / 1024);
				padding: calc(30 * 100vw / 1024) 0
		}
		#geidai-usc h2>span {
				font-size: 3.4rem
		}
		#geidai-usc span>span {
				font-size: 2.3rem;
				margin-top: calc(8 * 100vw / 1024)
		}
		#geidai-usc .geidai:before {
				height: calc(106 * 100vw / 1024);
				margin-bottom: calc(16 * 100vw / 1024);
				width: calc(100 * 100vw / 1024)
		}
		#geidai-usc .usc:before {
				height: calc(87 * 100vw / 1024);
				width: calc(289 * 100vw / 1024)
		}
		#geidai-usc .geidai:after {
				height: calc(55 * 100vw / 1024);
				margin-top: calc(15 * 100vw / 1024);
				width: calc(55 * 100vw / 1024)
		}
}

@media print, screen and (min-width: 1025px) {
		#geidai-usc {
				/*padding: 50px 0*/
		}
		#geidai-usc h2 {
				margin-bottom: 40px;
				padding: 40px 0
		}
		#geidai-usc h2>span {
				font-size: 2.6rem
		}
		#geidai-usc span>span {
				font-size: 1.8rem;
				margin-top: 5px
		}
		#geidai-usc .geidai:before {
				height: 86px;
				margin-bottom: 12px;
				width: 81px
		}
		#geidai-usc .usc:before {
				height: 70px;
				width: 233px
		}
		#geidai-usc .geidai:after {
				height: 38px;
				margin: 15px 0 5px;
				width: 38px
		}
}


/*--------------------------------------------
message
---------------------------------------------*/

#message-from-usc dl {
		background-color: var(--accentColor01);
		color: #fff;
		display: flex
}

#message-from-usc dt {
		display: flex
}

#message-from-usc dt img {
		width: auto
}

#message-from-usc dt div {
		display: flex;
		flex-direction: column;
		justify-content: center
}

#message-from-usc dt span {
		display: block
}

#message-from-usc dt span:nth-child(1) {
		font-family: 'Noto Serif JP', sans-serif;
		font-weight: 700;
		letter-spacing: .06em
}

#message-from-usc dt span:nth-child(2) {
		font-family: 'Noto Serif JP', sans-serif;
		font-weight: 700;
		letter-spacing: .04em
}

#message-from-usc dd {
		display: flex;
		flex-direction: column
}

#message-from-usc dd span:nth-child(1) {
		font-family: 'Noto Serif JP', sans-serif;
		letter-spacing: .06em;
		line-height: 1.5
}

#message-from-usc dd span:nth-child(2) {
		font-family: 'Noto Serif JP', sans-serif;
		letter-spacing: .02em;
		line-height: 1.42
}

@media screen and (max-width: 1024px) {
		#message-from-usc li:not(:last-child) {
				margin-bottom: calc(90 * 100vw / 1024)
		}
		#message-from-usc dl {
				flex-direction: column;
				margin-bottom: calc(60 * 100vw / 1024)
		}
		#message-from-usc dt {
				position: relative
		}
		#message-from-usc dt img {
				height: calc(149 * 100vw / 1024)
		}
		#message-from-usc dt div {
				padding-left: calc(30 * 100% / 1024);
				z-index: 2
		}
		#message-from-usc dt div span:nth-child(1) {
				font-size: 4.3rem
		}
		#message-from-usc dt div span:nth-child(2) {
				font-size: 2.4rem;
				margin-top: calc(14 * 100vw / 1024)
		}
		/*#message-from-usc dt:after {
		display:none;
		background: url("../images/ui/logo/logo_usc01.png") 0 0/ contain no-repeat;
		content: '';
		height: calc( 99 * 100vw / 1024 );
		margin-bottom: calc( ( -99 / 2 ) * 100vw / 1024 );
		position: absolute;
		right: calc( 26 * 100% / 1024 );
		width: calc( 125 * 100% / 1024 );
	}
	*/
		#message-from-usc dd {
				border-top: .5px solid #fff;
				padding: calc(26 * 100vw / 1024)
		}
		#message-from-usc dd span:nth-child(1) {
				font-size: 2.7rem
		}
		#message-from-usc dd span:nth-child(2) {
				font-size: 2.3rem;
				margin-top: calc(10 * 100vw / 1024)
		}
}

@media print, screen and (min-width: 1025px) {
		#message-from-usc li {
				margin-bottom: 60px
		}
		#message-from-usc dl {
				align-items: center;
				margin-bottom: 40px;
				position: relative
		}
		/*#message-from-usc dl:after {
		background: url("../images/ui/logo/logo_usc01.png") 0 0/ contain no-repeat;
		bottom: 50%;
		content: '';
		margin-bottom: -63px;
		position: absolute;
		right: 30px;
	}
	*/
		#message-from-usc dt {
				width: 345px
		}
		#message-from-usc dt img {
				height: 130px
		}
		#message-from-usc dt div {
				padding-left: 20px
		}
		#message-from-usc dt span:nth-child(1) {
				font-size: 3rem
		}
		#message-from-usc dt span:nth-child(2) {
				font-size: 1.6rem;
				margin-top: 10px
		}
		#message-from-usc dd {
				border-left: 1px solid #fff;
				min-height: 98px;
				padding: 16px 30px;
				width: 755px
		}
		#message-from-usc dd span:nth-child(1) {
				font-size: 1.4rem
		}
		#message-from-usc dd span:nth-child(2) {
				font-size: 1.4rem;
				margin-top: 5px
		}
}

#message-from-usc h3 {
		font-weight: 700;
		position: relative
}

#message-from-usc .en h3 {
		letter-spacing: .04em
}

#message-from-usc h3:after {
		content: '';
		left: 0;
		position: absolute;
		top: 100%
}

#message-from-usc .jp h3:after {
		background-color: var(--accentColor02)
		/*background-color: #8dc21f;*/
}

#message-from-usc .en h3:after {
		background-color: var(--accentColor02)
		/*background-color: #e0c2a2;*/
}

#message-from-usc .en p {
		/*font-weight: 600;*/
}

#message-from-usc p+p {
		margin-top: 1em
}

@media screen and (max-width: 1024px) {
		#message-from-usc h3 {
				font-size: 3.4rem;
				letter-spacing: .02em;
				line-height: 1.2;
				margin-bottom: calc(24 * 100vw / 1024);
				padding-bottom: calc(14 * 100vw / 1024)
		}
		#message-from-usc h3:after {
				height: calc(6 * 100vw / 1024);
				width: calc(400 * 100vw / 1024)
		}
}

@media print, screen and (min-width: 1025px) {
		#message-from-usc h3 {
				font-size: 2rem;
				margin-bottom: 12px;
				padding-bottom: 10px
		}
		#message-from-usc h3:after {
				height: 3px;
				width: 50%
		}
}

.message dl {
		background-color: var(--accentColor01);
		color: #fff;
		display: flex
}

.message dt {
		display: flex
}

.message dt div {
		display: flex;
		flex-direction: column;
		justify-content: center
}

.message dt span {
		display: block
}

.message dt span:nth-child(1) {
		font-family: 'Noto Serif JP', sans-serif;
		font-weight: 700;
		letter-spacing: .04em
}

.message dt span:nth-child(2) {
		font-family: 'Noto Serif JP', sans-serif;
		font-weight: 700;
		letter-spacing: .06em
}

.message dd {
		/*align-items: center;*/
		display: flex;
		font-family: 'Noto Serif JP', sans-serif;
		letter-spacing: .02em;
		line-height: 1.5
}

@media screen and (max-width: 1024px) {
		.message li:not(:last-child) {
				margin-bottom: calc(90 * 100vw / 1024)
		}
		.message dl {
				flex-direction: column;
				margin-bottom: calc(40 * 100vw / 1024)
		}
		.message dt {
				position: relative
		}
		.message dt img {
				height: calc(149 * 100vw / 1024);
				width: auto
		}
		.message dt div {
				padding-left: calc(30 * 100% / 1024);
				z-index: 2
		}
		.message dt div span:nth-child(1) {
				font-size: 3.9rem
		}
		.message dt div span:nth-child(2) {
				font-size: 2.2rem;
				margin-top: calc(10 * 100vw / 1024)
		}
		/*.message dt:after {
		background: url("../images/ui/logo/logo_usc01.png") 0 0/ contain no-repeat;
		bottom: 0;
		content: '';
		height: calc( 75 * 100vw / 1024 );
		position: absolute;
		right: calc( 8 * 100% / 1024 );
		width: calc( 249 * 100% / 1024 );
	}*/
		.message dd {
				border-top: 1px solid #fff;
				font-size: 2.7rem;
				padding: calc(26 * 100vw / 1024)
		}
}

@media print, screen and (min-width: 1025px) {
		.message li {
				margin-bottom: 60px
		}
		.message dl {
				align-items: center;
				margin-bottom: 30px;
				position: relative
		}
		/*.message dl:after {
		background: url("../images/ui/logo/logo_usc01.png") 0 0/ contain no-repeat;
		bottom: 0;
		content: '';
		height: 70px;
		position: absolute;
		right: 10px;
		width: 228px;
	}*/
		.message dt {
				width: 345px
		}
		.message dt img {
				height: 130px;
				width: auto
		}
		.message dt div {
				padding-left: 20px
		}
		.message dt div span:nth-child(1) {
				font-size: 2rem
		}
		.message dt div span:nth-child(2) {
				font-size: 1.2rem;
				margin-top: 5px
		}
		.message dd {
				border-left: 1px solid #fff;
				font-size: 1.4rem;
				min-height: 98px;
				padding: 16px 30px;
				width: 755px
		}
}


/*--------------------------------------------
TEXTS
---------------------------------------------*/

@media screen and (max-width: 1024px) {
		.texts01 .jp dt, .texts01 .jp dd {
				/*font-size: 2.7rem;*/
				font-size: 3.2rem;
				line-height: 1.74
		}
		.texts01 .en dt, .texts01 .en dd {
				/*font-size: 2.7rem;*/
				font-size: 3.2rem;
				/*font-weight: 600;*/
				line-height: 1.6
		}
		.texts01 .jp dt {
				font-weight: 700
		}
		.texts01 .en dt {
				font-weight: 700
		}
		.texts01 .session_title {
				font-weight: 700
		}
		.texts02 .jp dt, .texts02 .jp dd {
				/*font-size: 2.7rem;*/
				font-size: 3.2rem;
				line-height: 1.74
		}
		.texts02 .en dt, .texts02 .en dd {
				/*font-size: 2.7rem;*/
				font-size: 3.2rem;
				/*font-weight: 600;*/
				line-height: 1.6
		}
		.texts02 .jp dt {
				font-weight: 700
		}
		.texts02 .en dt {
				font-weight: 700
		}
		.texts02 .session_title {
				font-weight: 700
		}
		.texts02 .profile_name {
				font-weight: 700
		}
}

@media print, screen and (min-width: 1025px) {
		.texts01 .jp dt, .texts01 .jp dd {
				font-size: 1.6rem;
				line-height: 1.75
		}
		.texts01 .jp dt {
				font-weight: 700
		}
		.texts01 .en dt, .texts01 .en dd {
				font-size: 1.7rem;
				line-height: 1.6
		}
		.texts01 .en dt {
				font-weight: 700
		}
		.texts01 .session_title {
				font-weight: 700
		}
		.texts02 .jp dt, .texts02 .jp dd {
				font-size: 1.6rem;
				line-height: 1.75
		}
		.texts02 .jp dt {
				font-weight: 700
		}
		.texts02 .en dt, .texts02 .en dd {
				font-size: 1.7rem;
				line-height: 1.6
		}
		.texts02 .en dt {
				font-weight: 700
		}
		.texts02 .session_title {
				font-weight: 700
		}
		.texts02 .profile_name {
				font-weight: 700
		}
}


/*--------------------------------------------
CATALOG_DOWNLOAD BANNER
---------------------------------------------*/

#catalog_download {
		margin-top: 0
}

@media screen and (max-width: 1024px) {
		#catalog_download .catalog_download_banner {
				width: 80%;
				margin: 20px auto
		}
		#catalog_download .catalog_download_banner a {
				align-items: center;
				background-color: #B24996;
				background-color: var(--accentColor01);
				color: #fff;
				display: flex;
				font-family: 'Noto Sans JP', sans-serif;
				font-weight: 700;
				justify-content: center;
				letter-spacing: .05em;
				line-height: 1.5;
				border: 5px solid #aaa;
				border-radius: 4px;
				font-size: 3.2rem;
				height: 70px;
				margin-top: auto;
				order: 4;
				text-align: center;
				background: url(../images/common/bg_banner.png) center 0/ cover no-repeat
		}
		#catalog_download .catalog_download_banner span {
				vertical-align: middle
		}
		#catalog_download .catalog_download_banner span img {
				vertical-align: middle
		}
}

@media print, screen and (min-width: 1025px) {
		#catalog_download .catalog_download_banner {
				width: 80%;
				margin: 60px auto
		}
		#catalog_download .catalog_download_banner a {
				align-items: center;
				background-color: #B24996;
				background-color: var(--accentColor01);
				color: #fff;
				display: flex;
				font-family: 'Noto Sans JP', sans-serif;
				font-weight: 700;
				justify-content: center;
				letter-spacing: .05em;
				line-height: 1.5;
				border: 5px solid #aaa;
				border-radius: 4px;
				font-size: 3.3rem;
				height: 150px;
				margin-top: auto;
				order: 4;
				text-align: center;
				background: url(../images/common/bg_banner.png) center 0/ cover no-repeat
		}
		#catalog_download .catalog_download_banner span {
				vertical-align: middle
		}
		#catalog_download .catalog_download_banner span img {
				vertical-align: middle
		}
}