@charset "utf-8";

/*----------------------------------------------------------------
 /category/ under
----------------------------------------------------------------*/
/*----------------------------------------------------------------
 base
----------------------------------------------------------------*/
/*----------------------------------------------------------------
 layout
----------------------------------------------------------------*/
/*-----------------------------------------------------
 background skew
-----------------------------------------------------*/
#outline{
	padding: 50px 0 20px 0;
	z-index				: 7;
}
#wrap,#outline,#outline:after			{ background: var(--bg-color); }
@media screen and (min-width: 768px) {
#outline{
	padding: 100px 0 20px 0;
}
}

/*----------------------------------------------------------------
 styles
----------------------------------------------------------------*/
/*-----------------------------------------------------
 header
-----------------------------------------------------*/
@media screen and (min-width: 768px) {
#header .theme img{ max-width: 690px; }
}

/*-----------------------------------------------------
 contents
-----------------------------------------------------*/
#contents h2{
	margin				: 0 0 30px 0;
	line-height			: 1.4;
}
#contents h3{
	margin				: 3em 0 -30px 0;
	border-top			: 2px solid var(--text-color);
	padding				: 2.5em 0;
	text-align			: center;
	font-weight			: bold;
	font-size			: 1.5rem;
}
#contents h4{
	margin				: 30px 0 0 0;
	font-weight			: bold;
	font-size			: 1.4rem;
	color				: var(--main-color);
}
@media screen and (min-width: 768px) {
#contents h2{ margin: 0 0 50px 0; }
#contents h3{ font-size: 2rem; }
#contents h4{ font-size: 2rem; }
#contents .container>p{ font-size: 115%; }
}

/* outline-list
-----------------------------------------------------*/
@media screen and (min-width: 768px) {
#contents .outline-list dl>dt{ flex: 0 0 120px; }
}


/* outline-list
-----------------------------------------------------*/

#contents .text{ margin: 0 0 20px 0; }
#contents .text small{ font-size: 1.2rem; }


/* outline-list
-----------------------------------------------------*/
#contents .copy{ line-height: 2; }

/* case-list
-----------------------------------------------------*/
@media screen and (max-width: 767px) {
#contents .case-list>ul>li{ flex: 0 0 100%; }
}

/* copy
-----------------------------------------------------*/
#contents .copy{ line-height: 2; }

#contents .staff{
	margin: 50px 0 -10px 0;
}
#contents .staff dt{
	font-size: 1.6rem;
	text-align: center;
	margin: 20px 0;
}
#contents .staff dd{
	display: flex;
	gap: 3%;
	justify-content: center;
	flex-wrap: wrap;
}
#contents .staff dd figure{
	flex: 0 0 48%;
	text-align: center;
	font-size: 1.2rem;
}
#contents .staff dd figcaption{
	margin: 5px 0 10px 0;
}
@media screen and (min-width: 768px) {
#contents .staff dd{
	gap: 1%;
}
#contents .staff dd figure{
	flex: 0 0 24%;}
}




.modaal-container{
	box-shadow: none;
background: transparent; }

@media screen and (max-height: 1000px) {
.modaal-content-container { padding: 0; }
.modaal-inner-wrapper { padding: 0;}
}