@charset "utf-8";

/*----------------------------------------------------------------
 TopPage only
----------------------------------------------------------------*/
/*----------------------------------------------------------------
 base
----------------------------------------------------------------*/
/*----------------------------------------------------------------
 layout
----------------------------------------------------------------*/
.section{
	margin				: 50px 0;
}
#main{
	padding				: calc(var(--item-padding) * 1.5);
}
/*----------------------------------------------------------------
 styles
----------------------------------------------------------------*/
/*-----------------------------------------------------
 mainview
-----------------------------------------------------*/

/* mv-text
-----------------------------------------------------*/
#mainview{}
#mainview .mv-text{
	position			: relative;
	z-index				: 2;
}
@media screen and (max-width: 768px) {
#mainview .mv-text{
	margin				: 0 0 -1em 0;
	padding				: 0 var(--item-padding);
}
}
@media screen and (min-width: 769px) {
#mainview .mv-text{
	position			: absolute;
	top					: 0;
	left				: 0;
}
}

/* mv-image
-----------------------------------------------------*/
#mainview .mv-image{
	position			: relative;
	z-index: 1;
}
@media screen and (max-width: 768px) {
#mainview .mv-image{
	margin				: 0 auto;
	width				: 80%;
}
#mainview .mv-image img{
	width				: 100%;
	aspect-ratio		: 5 / 7;
	object-fit			: cover;
	object-position		: left top;
	border-radius		: var(--border-radius);
}
}
@media screen and (min-width: 769px) {
#mainview .mv-image{
	left				: -60px;
	top					: 25px;
	width				: 42.3423%;
	text-align			: left;
}
#mainview .mv-image img{ border-radius: 0 var(--border-radius) var(--border-radius) 0; }
}


/*-----------------------------------------------------
 news
-----------------------------------------------------*/
#news h2{
	margin				: 0 0 1em 0;
	text-align			: center;
	font-weight			: 700;
	font-size			: 137.5%;
	color				: var(--main-color);
}

/* topics-list
-----------------------------------------------------*/
#news .topics-list{
	margin				: 0 auto;
	max-width			: 770px;
	border-top			: 1px solid var(--main-color);
}
#news .topics-list li{ border-bottom: 1px solid var(--main-color); }
#news .topics-list li a{
	display				: flex;
	flex-direction		: column;
	padding				: 0.8em 0;
	font-size			: 87.5%;
	color				: var(--main-color);
}

@media screen and (min-width: 769px) {
#news .topics-list li a			{ flex-direction: row; }
#news .topics-list li a>time	{ flex: 0 0 7em; }
#news .topics-list li a>.title	{ flex: 1 1 auto; }
}

/* more
-----------------------------------------------------*/
#news .more{
	margin				: 2em 0;
	text-align			: center;
}

/*-----------------------------------------------------
 course
-----------------------------------------------------*/
#course{}

/* course-list
-----------------------------------------------------*/
#course .course-list li{ margin: 0 0 50px 0; }

/* course-item
-----------------------------------------------------*/
#course .course-item img{ border-radius: var(--border-radius); }
#course .course-item h2{
	margin				: 0 0 1em 0;
	line-height			: 1.2;
}
#course .course-item h2 .ja{ font-size: 107.1428%; }
#course .course-item h2 .en{
	display				: block;
	font-style			: italic;
	margin				: 0.5em 0;
}
#course .course-item h2 .en small{ font-size: 70%; }
#course .course-item .copy{
	margin				: 0 0 1em 0;
	line-height			: 1.2;
	font-size			: 125%;
	color				: var(--main-color);
}
@media screen and (max-width: 768px) {
#course .row.course-item{ flex-direction: column-reverse; }
#course .course-item h2{ margin: 0 0 0.5em 0; }
#course .course-item h2 .ja br{ display: none; }
#course .course-item h2 .en,
#course .course-item .copy{ font-size: 71.428571%; }
#course .course-item h2 .en{ margin: 0.25em 0; }
#course .course-item .link{
	margin-top			: -40px;
	text-align			: right;
}
}
@media screen and (min-width: 769px) {
#course .row.course-item{
	--item-gap: 30px;
	align-items			: center;
}
#course .course-list li:nth-child(even) .row{ flex-direction: row-reverse; }
#course .course-item h2 .ja{ font-size: 175%; }
}
@media screen and (min-width: 1150px) {
#course .course-item h2 .ja{ font-size: 250%; }
#course .course-item h2 .en{ font-size: 125%; }
#course .course-item .copy{ font-size: 156.25%; }
}

/* global-course
-----------------------------------------------------*/
#course .global-course{
	padding				: var(--item-padding);
	border-radius		: var(--border-radius);
	background			: var(--base-color);
}

@media screen and (min-width: 769px) {
#course .global-course .row{ flex-direction: row-reverse; }
}

/*-----------------------------------------------------
 aboutus
-----------------------------------------------------*/
#aboutus{ position: relative; }
#aboutus h2{
	width				: 100%;
	text-indent			: -9999em;
}
#aboutus nav{
	position			: absolute;
}
@media screen and (max-width: 768px) {
#aboutus h2{
	background			: url(../images/aboutus-sp.png) left top /cover no-repeat;
	aspect-ratio		: 650 / 582;
}
#aboutus nav{
	bottom				: 30%;
	width				: 100%;
	text-align			: center;
}
}
@media screen and (min-width: 769px) {
#aboutus h2{
	background			: url(../images/aboutus-pc.png) left top /cover no-repeat;
	aspect-ratio		: 2100 / 1005;
}
#aboutus nav{
	left				: 17%;
	top					: 40%;
}
}