@charset "utf-8";
/* reset
================================================== */
*:where(:not(iframe,img,svg):not(svg *)){all:unset;display:revert;}
*,*::before,*::after{box-sizing: border-box;}
body{position:relative;width:100%;line-height:1;color:#333;font-family:"Adobe Clean", "Noto Sans JP",system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",  Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-weight:400;background:#fff;-webkit-text-size-adjust:100%;}
footer,header,main,section,picture{display:block;}
table{border-collapse:collapse;border-spacing:0;}
ol,ul{list-style:none;}
img{width:100%;height:auto;}
a{margin:0;padding:0;color:#01B8AF;vertical-align:bottom;background:transparent;cursor:pointer;}
a:link,a:visited,a:hover,a:active{text-decoration:none;}

/* Font */
// Noto Sans JP
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;700;900&display=swap');

// Adobe Clean
@font-face {
  font-family: "Adobe Clean";
  src: url("../fonts/AdobeClean-Light.woff2") format('woff2'),
       url("../fonts/AdobeClean-Light.woff") format('woff');
  font-weight: 200;
  font-display: swap;
}
@font-face {
  font-family: "Adobe Clean";
  src: url("../fonts/AdobeClean-SemiLight.woff2") format('woff2'),
       url("../fonts/AdobeClean-SemiLight.woff") format('woff');
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: "Adobe Clean";
  src: url("../fonts/AdobeClean-Regular.woff2") format('woff2'),
       url("../fonts/AdobeClean-Regular.woff") format('woff');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Adobe Clean";
  src: url("../fonts/AdobeClean-Bold.woff2") format('woff2'),
       url("../fonts/AdobeClean-Bold.woff") format('woff');
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Adobe Clean";
  src: url("../fonts/AdobeClean-ExtraBold.woff2") format('woff2'),
       url("../fonts/AdobeClean-ExtraBold.woff") format('woff');
  font-weight: 800;
  font-display: swap;
}
@font-face {
  font-family: "Adobe Clean";
  src: url("../fonts/AdobeClean-Black.woff2") format('woff2'),
       url("../fonts/AdobeClean-Black.woff") format('woff');
  font-weight: 900;
  font-display: swap;
}

/* header
================================================== */
#header_wrapper{
	position:fixed;
	width:100%;
	background:#fff;
	z-index:10000;
}
#header_wrapper header{
	position:relative;
	display:flex;
	align-items:center;
	width:100%;
	max-width:1440px;
	height:64px;
	margin:0 auto;
}
#logo{
	width:113px;
	height:24px;
	margin-right:auto;
	padding-left:20px;
}
#logo a{
	display:block;
	width:100%;
	height:100%;
}
#logo a img{
	width:auto;
	height:24px;
}
#header_navigation ul{
	position:absolute;
	top:12px;
	left:50%;
	display:flex;
	transform:translateX(-50%);
}
#header_navigation li:not(:first-of-type){
	border-left:1px solid #ccc;
}
#header_navigation li a{
	display:flex;
	justify-content:center;
	align-items:center;
	height:40px;
	padding:0 19px;
	font-size:13px;
	line-height:1.3846;
	color:#36383c;
	font-weight:700;
	text-align:center;
	letter-spacing:0.1em;
	text-indent:0.1em;
	white-space:nowrap;
}
#header_navigation li a:hover{
	color:#01b8af;
}

/* #menu
-------------------------------------------------- */
#menu{
	position:fixed;
	top:12px;
	right:12px;
	display:none;
	width:40px;
	height:40px;
	z-index:100000;
	cursor:pointer;
	transition:0.3s;
}
#menu.active{
	transform:rotate(135deg);
}
#menu span{
	position:absolute;
	top:50%;
	left:8px;
	display:block;
	width:24px;
	height:2px;
	margin-top:-1px;
	background:#36383c;
}
#menu span:nth-of-type(1):before{
	position:absolute;
	top:-11px;
	left:50%;
	display:block;
	width:2px;
	height:24px;
	margin-left:-1px;
	background:#36383c;
	opacity:0;
	transition:0.3s;
	content:'';
}
#menu.active span:nth-of-type(1):before{
  opacity:1;
}
#menu span:nth-of-type(2){
	margin-top:-9px;
	transition:0.3s ease-out;
}
#menu.active span:nth-of-type(2){
  transform:scaleX(0);
  opacity:0;
}
#menu span:nth-of-type(3){
	margin-top:7px;
	transition:0.3s ease-out;
}
#menu.active span:nth-of-type(3){
  transform:scaleX(0);
  opacity:0;
}

/* #navigation
-------------------------------------------------- */
#navigation{
	display:none;
}
@media screen and (max-width:1199px){
	#header_navigation{
		display:none;
	}
	#menu{
		display:block;
	}
	#navigation{
		position:fixed;
		top:0;
		right:0;
		visibility:hidden;
		display:block;
		width:0;
		height:100vh;
		background:#fff;
		overflow:hidden;
		transition:0.3s;
		z-index:30000;
	}
	#navigation.active{
		visibility:visible;
		width:360px;
		height:100vh;
	}
	#navigation #navigation_inner{
		position:absolute;
		top:0;
		right:0;
		width:360px;
		height:100vh;
		padding-top:79px;
		opacity:0;
		box-sizing:border-box;
		transition:.4s;
	}
	#navigation.active #navigation_inner{
		opacity:1;
	}
	#navigation li+li{
		margin-top:6px;
	}
	#navigation li a{
		display:block;
		padding:8px 40px;
		font-size:16px;
		line-height:1.3846;
		color:#36383C;
		font-weight:700;
		letter-spacing:0.1em;
	}
	#navigation li a span{
		display:inline-block;
	}
	#navigation_button{
		margin-top:43px;
		padding:0 40px;
	}
	#navigation_button a{
		letter-spacing:0.1em;
		text-indent:0.1em;
	}
	#navigation-overlay{
		position:fixed;
		top:0;
		left:0;
		display:none;
		width:100vw;
		height:100vh;
		background:rgba(237,238,236,0.75);
		z-index:20000;
	}
}
@media screen and (max-width:880px){
	#header_wrapper header{
		max-width:840px;
		height:60px;
		padding:0 40px;
	}
	#logo{
		width:93px;
		padding:0;
	}
	#menu{
		top:10px;
	}
}
@media screen and (max-width:599px){
	#header_wrapper{
		z-index:40000;
	}
	#header_wrapper header{
		padding:0 30px;
	}
	#navigation.active{
		width:100vw;
	}
	#navigation #navigation_inner{
		width:100vw;
		padding-top:92px;
	}
	#navigation li+li{
		margin-top:12px;
	}
	#navigation li a{
		padding:10px 30px;
		font-size:20px;
		line-height:1.4;
	}
	#navigation_button{
		margin-top:66px;
		padding:0 30px;
	}
}
@media screen and (max-width:413px){
	#header_wrapper header{
		padding:0 20px;
	}
	#navigation li a{
		padding:10px 20px;
	}
	#navigation_button{
		padding:0 20px;
	}
}
@media screen and (max-width:374px){
	#header_wrapper header{
		padding:0 15px;
	}
	#menu{
		right:7px;
	}
	#navigation #navigation_inner{
		padding-top:84px;
	}
	#navigation li+li{
		margin-top:11px;
	}
	#navigation li a{
		padding:8px 15px;
		font-size:16px;
		line-height:1.3846;
	}
	#navigation_button{
		margin-top:50px;
		padding:0 15px;
	}
}

/* footer
================================================== */

/* #application
-------------------------------------------------- */
#application{
	padding:61px 0 59px;
	color:#FFF;
	text-align:center;
	background:#36383c;
}
#application h2{
	font-size:20px;
	line-height:1.5;
	font-weight:700;
}
#application h2 span{
	display:inline-block;
}
.application_notes{
	margin-top:2px;
	font-size:12px;
	line-height:1.6667;
}
.application_button{
	width:240px;
	margin:19px auto 0;
}
.application_button a{
	letter-spacing:0.1em;
	text-indent:0.1em;
}
.application_text{
	margin-top:21px;
	font-size:13px;
	line-height:1.5385;
	font-weight:700;
}
.application_text+.application_text{
	margin-top:20px;
}

/* footer
-------------------------------------------------- */
footer{
	padding:9px 0 11px;
	background:#1a1a1a;
}
footer p{
	font-size:10px;
	line-height:1.6;
	color:#fff;
	text-align:center;
}
@media screen and (max-width:880px){
	#application{
		padding-bottom:60px;
	}
	.application_text{
		margin-top:31px;
	}
	.application_text+.application_text{
		margin-top:30px;
	}
}
@media screen and (max-width:767px){
	.application_button{
		width:100%;
	}
	.application_text{
		margin-top:33px;
	}
}
@media screen and (max-width:374px){
	#application h2 span{
		display:inline;
	}
}

/* #page-top
================================================== */
#page-top{
	position:fixed;
	bottom:10px;
	right:10px;
	display:block;
	width:40px;
	height:40px;
	border-radius:50%;
	border:2px solid #fff;
	background:#01b8af;
	box-sizing:border-box;
	z-index:10000;
}
#page-top::before{
	position:absolute;
	top:50%;
	left:50%;
	margin-top:-1px;
	border-bottom:10px solid #fff;
	border-right:6px solid transparent;
	border-left:6px solid transparent;
	transform:translate(-50%,-50%);
	content:'';
}
#page-top:hover{
	border-color:#01b8af;
	background:transparent;
}
#page-top:hover::before{
	border-bottom:10px solid #01b8af;
}
@media screen and (max-width:768px){
	#page-top:hover{
		background:#01b8af;
	}
	#page-top:hover::before{
		border-bottom:10px solid #fff;
	}
}

/* main
================================================== */

/* common
-------------------------------------------------- */
.tablet,
.mobile{
	display:none;
}
.inner{
	max-width:1000px;
	margin:0 auto;
	padding:0 60px;
}
.title{
	font-size:3.2rem;
	line-height:1.4375;
	font-weight:700;
	text-align:center;
}
.text{
	font-size:1.6rem;
	line-height:1.75;
}
a:link.underline,a.underline:visited{
	text-decoration:underline;
}
a:hover.underline,a.underline:active{
	text-decoration:none;
}
.stack{
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}
.reverse{
	flex-direction:row-reverse;
}
video{
	width:100%;
	height:auto;
}
.button{
	display:flex;
	justify-content:center;
	align-items:center;
	width:100%;
	height:40px;
	font-size:16px;
	line-height:1.5;
	font-weight:700;
	text-align:center;
	border-style:solid;
	border-width:2px;
	border-radius: 100px;
	transition:.3s;
}
.button.large{
	height:46px;
	font-size:20px;
}
.button.black{
	color:#fff;
	border-color:#000;
	background:#000;
}
.button.white{
	color:#333;
	border-color:#fff;
	background:#fff;
}
.button.lime{
	color:#fff;
	border-color:#52B5AE;
	background:#52B5AE;
}
.button.green{
	color:#000;
	border-color:#01b8af;
	background:#01b8af;
}
.button.ghost{
	color:#01b8af;
	border-color:#01b8af;
	background:transparent;
}
.button.ghost_black{
	color:#36383c;
	border-color:#36383c;
	background:transparent;
}
.button.black:hover,
.button.white:hover,
.button.green:hover,
.button.lime:hover{
	background:transparent;
}
.button.black:hover{
	color:#000;
}
.button.white:hover{
	color:#fff;
}
.button.green:hover{
	color:#01b8af;
}
.button.lime:hover{
	color:#52B5AE;
}
.button.ghost:hover,
.button.ghost_black:hover{
	color:#fff;
}
.button.ghost:hover{
	background:#01b8af;
}
.button.ghost_black:hover{
	background:#36383c;
}
.button br{
	display:none;
}
@media screen and (max-width:880px){
	.inner{
		max-width:840px;
		padding:0 40px;
	}
}
@media screen and (max-width:599px){
	.inner{
		padding:0 30px;
	}
}
@media screen and (max-width:413px){
	.inner{
		padding:0 20px;
	}
}
@media screen and (max-width:374px){
	.inner{
		padding:0 15px;
	}
}

/* #index
================================================== */

/* #index_contents_header
-------------------------------------------------- */
#index_contents_header{
	position:relative;
	min-height:662px;
	padding:64px 0 29px;
	background:url(../images/header_bg.png) no-repeat center top;
	z-index:60;
}
#index_contents_header_image{
	display:none;
}
.index_contents_header_inner{
	max-width:1000px;
	margin:0 auto;
	padding:93px 60px 0;
}
.index_contents_header_title{
	width:480px;
}
.index_header_speech_bubble{
	position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
	width:210px;
	height:34px;
	font-size:18px;
	line-height:1.5;
	color:#fff;
	font-weight:700;
	letter-spacing:0.06em;
	border-radius:17px;
	background:#01b8af;
}
.index_header_speech_bubble::after{
	position:absolute;
	bottom:-8px;
	left:50%;
	border-top:8px solid #01b8af;
	border-right:6px solid transparent;
	border-left:6px solid transparent;
	transform:translateX(-50%);
	content:'';
}
.index_header_title h1{
	width:358px;
	height:auto;
	margin-top:21px;
}
.index_header_text{
	margin-top:22px;
	font-size:20px;
	line-height:1.8;
	color:#000;
	font-weight:700;
}
.index_header_button{
	width:210px;
	margin-top:26px;
}
.index_contents_header_notes{
	margin-top:122px;
	font-size:18px;
	line-height:1.5;
	color:#000;
	font-weight:700;
	text-align:center;
}
.index_contents_header_notes span:not(.notes_wrapper){
	display:inline-block;
	padding-top:5px;
	background:linear-gradient(transparent 75%,#ffce00 0%);
}
.index_contents_header_notes span.notes_wrapper{
	display:inline-block;
}
.index_header_link{
	margin-top:14px;
}
.index_contents_header_link{
	margin-top:11px;
	text-align:center;
}
.index_header_link a,
.index_contents_header_link a{
	line-height:1.5;
	color:#1473e6;
	font-weight:700;
}
.index_header_link a{
	font-size:16px;
}
.index_contents_header_link a{
	font-size:14px;
}
@media screen and (max-width:880px){
	#index_contents_header{
		min-height:initial;
		padding-top:60px;
		padding-bottom:59px;
		background-image:url(../images/header_bg_tablet.png);
		background-position:center 60px;
		background-size:100% auto;
	}
	.index_contents_header_title{
		width:500px;
	}
	.index_contents_header_inner{
		max-width:840px;
		padding:82px 40px 0;
	}
	.index_header_title h1{
		width:358px;
		margin-top:18px;
	}
	.index_header_text{
		margin-top:19px;
	}
	.index_header_button{
		margin-top:27px;
	}
	.index_contents_header_notes{
		margin-top:8.4091vw;
	}
	.index_contents_header_link{
		margin-top:24px;
	}
}
@media screen and (max-width:838px){
	#index_contents_header{
		padding-top:60px;
		background-image:none;
	}
	#index_contents_header_image{
		display:block;
	}
	.index_contents_header_inner{
		max-width:initial;
		margin-top:-50px;
		padding-top:0;
	}
	.index_contents_header_title{
		width:100%;
	}
	.index_header_speech_bubble{
		width:180px;
		height:30px;
		margin:0 auto;
		font-size:16px;
		border-radius:15px;
	}
	.index_header_title h1{
		width:100%;
		max-width:254px;
		margin:18px auto 0;
	}
	.index_header_text{
		margin-top:14px;
		font-size:18px;
		line-height:1.8889;
		text-align:center;
	}
	.index_header_button{
		width:100%;
		max-width:296px;
		margin:21px auto 0;
	}
	.index_contents_header_notes{
		margin-top:56px;
	}
	.index_header_link{
		margin-top:20px;
		text-align:center;
	}
	.index_contents_header_link{
		margin-top:23px;
	}
}
@media screen and (max-width:599px){
	.index_contents_header_inner{
		padding-right:30px;
		padding-left:30px;
	}
}
@media screen and (max-width:413px){
	.index_contents_header_inner{
		padding-right:20px;
		padding-left:20px;
	}
}
@media screen and (max-width:374px){
	.index_contents_header_inner{
		margin-top:-30px;
	}
	.index_header_text{
		font-size:16px;
	}
	.index_contents_header_notes{
		font-size:16px;
	}
}

/* common
-------------------------------------------------- */
#tool h2,
#reason h2,
#learning h2{
	font-size:32px;
	line-height:1.5;
	font-weight:700;
	text-align:center;
	letter-spacing:0.05em;
}
#tool h2 span,
#reason h2 span,
#learning h2 span{
	background:linear-gradient(transparent 75%,#ffe600 0%);
}
@media screen and (max-width:880px){
	#tool h2,
	#reason h2,
	#learning h2{
		font-size:32px;
		line-height:1.5;
	}
}
@media screen and (max-width:599px){
	#tool h2,
	#reason h2,
	#learning h2{
		font-size:28px;
		line-height:1.4286;
	}
}
@media screen and (max-width:374px){
	#tool h2,
	#reason h2,
	#learning h2{
		font-size:24px;
	}
}

/* #seminar, #index_contents_header_text
-------------------------------------------------- */
/*
#online_seminar{
	position:relative;
	margin-top:-80px;
}
#online_seminar .inner{
	padding:0 20px;
}
#online_seminar_container{
	position:relative;
	border-radius:10px;
	background:#AA3A23;
}
.online_seminar_container_top{
	display:grid;
	grid-template-columns:524px 1fr;
	column-gap:10px;
	padding:0 20px 40px 39px;
}
.online_seminar_details_top{
	position:relative;
	grid-row:1/2;
	grid-column:1/2;
}
.online_seminar_details_bottom{
	grid-row:2/3;
	grid-column:1/2;
}
.online_seminar_image{
	grid-row:1/3;
	grid-column:2/3;
	margin-top:20px;
}
.online_seminar_subtitle{
	position:absolute;
	top:-25px;
	left:0;
	display:flex;
	justify-content:center;
	align-items:center;
	width:680px;
	height:54px;
	font-size:26px;
	line-height:1.5;
	color:#333;
	font-weight:900;
	text-align:center;
	border-radius:6px;
	background:#FFCE00;
}
.online_seminar_subtitle::after{
	position:absolute;
	bottom:-11px;
	left:105px;
	border-top:11px solid #FFCE00;
	border-right:8px solid transparent;
	border-left:8px solid transparent;
	content:'';
}
.online_seminar_subtitle br{
	display:none;
}
.online_seminar_title{
	padding-top:52px;
	font-size:26px;
	line-height:1.3077;
	color:#FFE760;
	font-weight:900;
}
.online_seminar_title span{
	display:inline-block;
}
.online_seminar_date{
	padding-top:1px;
	font-size:18px;
	line-height:1.5;
	color:#FFF;
	font-weight:900;
}
.online_seminar_date .day{
	font-size:24px;
}
.online_seminar_date .brackets{
	font-size:12px;
}
.online_seminar_text{
	margin-top:9px;
	font-size:14px;
	line-height:1.7143;
	color:#FFF;
	font-weight:700;
}
.online_seminar_button{
	width:320px;
	margin-top:22px;
}
.online_seminar_button .button{
	color:#AA3A23;
}
.online_seminar_container_bottom{
	border-radius:0 0 10px 10px;
	background:#333333;
	overflow:hidden;
}
.online_seminar_container_bottom_inner{
	display:grid;
	grid-template-columns:auto 190px;
	column-gap:33px;
	align-items:center;
	padding:11px 40px 12px 37px;
}
.online_seminar_container_bottom_left{
	display:grid;
	grid-template-columns:108px auto;
	column-gap:20px;
	align-items:center;
}
.teachers_icon img{
	width:108px;
	height:72px;
}
.teachers_title{
	font-size:18px;
	line-height:1.3077;
	color:#ffce00;
	font-weight:700;
	letter-spacing:0.05em;
}
.teachers_text{
	margin-top:3px;
	font-size:13px;
	line-height:1.5385;
	color:#FFF;
	font-weight:700;
	letter-spacing:0.05em;
}
#index_contents_text{
	position:relative;
	padding:66px 0 70px;
	z-index:100;
}
.index_contents_notes{
	font-size:18px;
	line-height:1.5;
	color:#000;
	font-weight:700;
	text-align:center;
}
.index_contents_notes span:not(.notes_wrapper){
	display:inline-block;
	padding-top:5px;
	background:linear-gradient(transparent 75%,#ffce00 0%);
}
.index_contents_notes span.notes_wrapper{
	display:inline-block;
}
.index_contents_link{
	margin-top:11px;
	text-align:center;
}
.index_contents_link a{
	font-size:14px;
	line-height:1.5;
	color:#1473e6;
	font-weight:700;
}
#about{
	position:relative;
	margin-top:-64px;
	padding-top:64px;
	z-index:50;
}
#about::before{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:calc((100% - 64px) / 2);
	background:#f2f2f2;
	z-index:1;
	content:'';
}
#about .inner{
	padding:0 20px;
}
#about_container{
	position:relative;
	border-radius:10px;
	background:#ffce00;
	overflow:hidden;
	z-index:10;
}
.about_container_top{
	display:flex;
	justify-content:space-between;
	padding:35px 40px 40px 39px;
}
.about_details{
	width:320px;
}
.about_movie{
	width:calc(100% - 360px);
	position:relative;
}
.about_subtitle{
	display:flex;
	flex-direction:row-reverse;
	justify-content:flex-end;
	align-items:center;
}
.about_subtitle .subtitle_text{
	font-size:22px;
	line-height:1.5;
	font-weight:700;
	letter-spacing:0.1em;
}
.about_subtitle .speech_bubble{
	position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
	width:68px;
	height:28px;
	margin-right:15px;
	font-size:16px;
	line-height:1.5;
	color:#ffce00;
	font-weight:700;
	letter-spacing:0.4em;
	text-indent:0.4em;
	border-radius:4px;
	background:#333;
}
.about_subtitle .speech_bubble::after{
	position:absolute;
	top:50%;
	right:-7px;
	border-left:7px solid #333;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	transform:translateY(-50%);
	content:'';
}
.about_container_top_title{
	margin-top:9px;
	font-size:22px;
	line-height:1.3636;
	font-weight:900;
}
.about_container_top_text{
	margin-top:9px;
	font-size:14px;
	line-height:1.7143;
}
.about_container_top_subtitle{
	margin-top:12px;
	font-size:14px;
	line-height:1.5;
	font-weight:700;
}
.about_container_top_button{
	width:320px;
	margin-top:9px;
}
.about_container_top_button .button{
	color:#ffce00;
	border:2px solid #333;
	background:#333;
}
.about_container_top_button .button:hover{
	color:#333;
	background:transparent;
}
@media screen and (max-width:929px){
	#online_seminar .inner,
	#about .inner{
		width:100%;
		max-width:initial;
		padding:0;
	}
	#online_seminar_container,
	#about_container{
		border-radius:0;
	}
	.online_seminar_container_top{
		padding:0 20px 40px 60px;
	}
	.online_seminar_container_bottom{
		border-radius:0;
	}
	.online_seminar_container_bottom_inner{
		padding:11px 60px 12px 58px;
	}
	.about_container_top{
		padding:40px 60px 50px;
	}
}
@media screen and (max-width:880px){
	#online_seminar{
		margin-top:96px;
	}
	.online_seminar_container_top{
		grid-template-columns:380px 1fr;
		column-gap:35px;
		max-width:860px;
		margin:0 0 0 auto;
		padding:0 20px 40px 40px;
	}
	.online_seminar_image{
		margin-top:40px;
	}
	.online_seminar_title{
		padding-top:49px;
	}
	.online_seminar_date{
		padding-top:3px;
	}
	.online_seminar_text{
		margin-top:9px;
	}
	#index_contents_text{
		padding:46px 0 59px;
	}
	.index_contents_link{
		margin-top:24px;
	}
	#about{
		margin-top:-60px;
		padding-top:60px;
	}
	.about_container_top{
		max-width:840px;
		margin:0 auto;
		padding:40px 40px 50px;
	}
	.about_details{
		width:368px;
	}
	.about_container_top_title .tablet{
		display:block;
	}
	.about_container_top_subtitle{
		margin-top:23px;
	}
	.about_movie{
		width:calc(100% - 392px);
	}
}
@media screen and (max-width:838px){
	#online_seminar{
		margin-top:21px;
	}
	.online_seminar_container_top{
		grid-template-columns:1fr;
		column-gap:0;
		max-width:600px;
		margin:0 auto;
		padding:0 40px 40px;
	}
	.online_seminar_details_top{
		grid-row:1/2;
		grid-column:1/2;
	}
	.online_seminar_details_bottom{
		grid-row:3/4;
		grid-column:1/2;
	}
	.online_seminar_image{
		grid-row:2/3;
		grid-column:1/2;
		margin-top:20px;
	}
	.online_seminar_subtitle{
		top:-42px;
		left:50%;
		width:100%;
		max-width:356px;
		height:84px;
		font-size:22px;
		transform:translateX(-50%)
	}
	.online_seminar_subtitle::after{
		left:50%;
		transform:translateX(-50%)
	}
	.online_seminar_subtitle br{
		display:block;
	}
	.online_seminar_title{
		padding-top:60px;
		line-height:1.2308;
		text-align:center;
	}
	.online_seminar_title span{
		display:inline;
	}
	.online_seminar_date{
		padding-top:4px;
		text-align:center;
	}
	.online_seminar_text{
		margin-top:17px;
		font-size:18px;
		line-height:1.7778;
		font-weight:400;
		text-align:center;
	}
	.online_seminar_button{
		width:100%;
		margin-top:22px;
	}
	.online_seminar_container_bottom_inner{
		display:block;
		grid-template-columns:initial;
		column-gap:initial;
		align-items:initial;
		max-width:600px;
		margin:0 auto;
		padding:30px 40px 40px 38px;
	}
	.online_seminar_container_bottom_left{
		column-gap:15px;
	}
	.teachers_title{
		font-size:20px;
	}
	.teachers_text{
		margin-top:11px;
	}
	.teachers_button{
		width:100%;
		margin-top:17px;
	}
	#index_contents_text{
		padding:26px 0 39px;
	}
	.index_contents_link{
		margin-top:23px;
	}
	.about_container_top{
		flex-direction:column-reverse;
		justify-content:flex-start;
		max-width:600px;
		padding:60px 40px;
	}
	.about_details{
		width:100%;
		margin-top:20px;
	}
	.about_movie{
		width:100%;
	}
	.about_subtitle{
		justify-content:center;
	}
	.about_container_top_title{
		margin-top:5px;
		font-size:26px;
		line-height:1.2308;
		text-align:center;
	}
	.about_container_top_title span{
		display:inline;
	}
	.about_container_top_text{
		margin-top:21px;
		font-size:18px;
		line-height:1.7778;
		text-align:center;
	}
	.about_container_top_subtitle{
		margin-top:19px;
		text-align:center;
	}
	.about_container_top_button{
		width:100%;
	}
}
@media screen and (max-width:767px){
	.online_seminar_container_top,
	.online_seminar_container_bottom_inner,
	.about_container_top{
		width:100%;
		max-width:initial;
	}
	.about_container_top_title .tablet{
		display:none
	}
}
@media screen and (max-width:599px){
	.online_seminar_container_top{
		padding:0 30px 40px;
	}
	.online_seminar_container_bottom_inner{
		padding:30px 30px 40px 28px;
	}
	.about_container_top{
		padding:60px 30px;
	}
}
@media screen and (max-width:599px){
	.online_seminar_title .tablet{
		display:block;
	}
}
@media screen and (max-width:449px){
	.about_container_top_title span{
		display:inline-block;
	}
}
@media screen and (max-width:413px){
	.online_seminar_container_top{
		padding:0 20px 40px;
	}
	.online_seminar_container_bottom_inner{
		padding:30px 20px 40px 18px;
	}
	.about_container_top{
		padding:60px 20px;
	}
}
@media screen and (max-width:374px){
	#online_seminar{
		margin-top:17px;
	}
	.online_seminar_container_top{
		padding:0 15px 40px;
	}
	.online_seminar_subtitle{
		top:-40px;
		height:80px;
		font-size:18px;
	}
	.online_seminar_title{
		padding-top:56px;
		font-size:24px;
	}
	.online_seminar_date{
		font-size:16px;
	}
	.online_seminar_date .day{
		font-size:22px;
	}
	.online_seminar_date .brackets{
		font-size:10px;
	}
	.online_seminar_text{
		font-size:16px;
	}
	.online_seminar_container_bottom_inner{
		padding:30px 15px 40px 13px;
	}
	.online_seminar_container_bottom_left{
		column-gap:10px;
	}
	.teachers_title{
		font-size:16px;
		letter-spacing:0;
	}
	.index_contents_notes{
		font-size:16px;
	}
	.about_container_top{
		padding:60px 15px;
	}
	.about_container_top_title{
		font-size:24px;
	}
	.about_container_top_text{
		font-size:16px;
	}
}
*/

/* #about
-------------------------------------------------- */
#about{
	position:relative;
	margin-top:-64px;
	padding-top:64px;
	z-index:50;
}
#about::before{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:50%;
	background:#f2f2f2;
	z-index:1;
	content:'';
}
#about .inner{
	padding:0 20px;
}
#about_container{
	position:relative;
	border-radius:10px;
	background:#ffce00;
	overflow:hidden;
	z-index:10;
}
.about_container_top{
	display:flex;
	justify-content:space-between;
	padding:35px 40px 38px;
}
.about_details{
	width:320px;
}
.about_movie{
	width:calc(100% - 360px);
	position:relative;
}
.about_subtitle{
	display:flex;
	flex-direction:row-reverse;
	justify-content:flex-end;
	align-items:center;
}
.about_subtitle .subtitle_text{
	font-size:22px;
	line-height:1.5;
	font-weight:700;
	letter-spacing:0.1em;
}
.about_subtitle .speech_bubble{
	position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
	width:68px;
	height:28px;
	margin-right:15px;
	font-size:16px;
	line-height:1.5;
	color:#ffce00;
	font-weight:700;
	letter-spacing:0.4em;
	text-indent:0.4em;
	border-radius:4px;
	background:#333;
}
.about_subtitle .speech_bubble::after{
	position:absolute;
	top:50%;
	right:-7px;
	border-left:7px solid #333;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	transform:translateY(-50%);
	content:'';
}
.about_container_top_title{
	margin-top:7px;
	font-size:22px;
	line-height:1.4545;
	font-weight:900;
}
.about_container_top_text{
	margin-top:6px;
	font-size:18px;
	line-height:1.7778;
}
.about_container_top_notes{
	position:relative;
	margin-top:15px;
	padding-left:17px;
	font-size:12px;
	line-height:1.5;
}
.about_container_top_notes span{
	position:absolute;
	top:0;
	left:0;
	display:block;
}
.about_container_bottom{
	background:#333333;
}
.about_container_bottom_inner{
	display:grid;
	grid-template-columns:auto 190px;
	align-items:center;
	padding:11px 40px 12px 38px;
}
.about_container_bottom_left{
	display:grid;
	grid-template-columns:108px auto 1fr;
	align-items:center;
}
.teachers_icon img{
	width:108px;
	height:72px;
}
.teachers_title{
	margin-left:20px;
	font-size:26px;
	line-height:1.3077;
	color:#ffce00;
	font-weight:700;
	letter-spacing:0.05em;
}
.teachers_title br{
	display:none;
}
.teachers_text{
	position:relative;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	justify-content:center;
	align-items:flex-start;
	min-height:70px;
	padding-left:38px;
	font-size:18px;
	line-height:1.5556;
	color:#fff;
	font-weight:700;
	letter-spacing:0.05em;
	text-align:left;
}
.teachers_text::before{
	position:absolute;
	top:0;
	left:17px;
	display:block;
	width:1px;
	height:100%;
	background:#fff;
	content:'';
}
.teachers_text span{
	display:inline-block;
}

/* #modal */
#modal-content{
	position:fixed;
	display:none;
	width:96%;
	max-width:880px;
	margin:0;
	padding:0;
	border-top:none !important;
	background:#FFF;
	z-index:300000;
}
#modal-content .inner{
	position:relative;
	width:100%;
	padding-top:56.25%;
	overflow:hidden;
}
#modal-content #modal-close{
	position:absolute;
	top:-50px;
	right:0;
	display:block;
	width:40px;
	height:40px;
	padding:0;
	opacity:1;
	border-radius:50%;
	background:#36383C;
	transform:rotate(45deg);
	cursor:pointer;
}
#modal-content #modal-close::before{
	position:absolute;
	top:50%;
	left:8px;
	display:block;
	width:24px;
	height:2px;
	margin-top:-1px;
	background:#FFF;
	content:'';
}
#modal-content #modal-close::after{
	position:absolute;
	top:8px;
	left:50%;
	display:block;
	width:2px;
	height:24px;
	margin-left:-1px;
	background:#FFF;
	content:'';
}
#modal-content .inner #player{
	position:absolute;
	top:0;
	right:0;
	width:100%;
	height:100%;
}
#modal-overlay{
	position:fixed;
	top:0;
	left:0;
	display:none;
	width:100%;
	height:120%;
	background:rgba(237,238,236,0.75);
	z-index:200000;
}
@media screen and (max-width:999px){
	.teachers_title br{
		display:block;
	}
}
@media screen and (max-width:929px){
	#about .inner{
		width:100%;
		max-width:initial;
		padding:0;
	}
	#about_container{
		border-radius:0;
	}
	.about_container_top{
		padding:39px 60px 40px;
	}
	.about_container_bottom_inner{
		padding:12px 60px 13px 58px;
	}
	.teachers_text{
		padding-left:34px;
		letter-spacing:0;
	}
	.teachers_text::before{
		left:15px;
	}
}
@media screen and (max-width:880px){
	#about{
		margin-top:-60px;
		padding-top:60px;
	}
	.about_container_top{
		max-width:840px;
		margin:0 auto;
		padding:60px 40px 38px;
	}
	.about_details{
		width:368px;
	}
	.about_movie{
		width:calc(100% - 392px);
	}
	.about_container_bottom_inner{
		max-width:840px;
		margin:0 auto;
		padding:12px 40px 13px 38px;
	}
	.about_container_top_text{
		margin-top:7px;
		font-size:14px;
		line-height:1.7143;
	}
	.teachers_title{
		letter-spacing:0;
	}
	.teachers_text::before{
		left:16px;
	}
}
@media screen and (max-width:838px){
	.about_container_top{
		flex-direction:column-reverse;
		justify-content:flex-start;
		max-width:600px;
	}
	.about_details{
		width:100%;
		margin-top:26px;
	}
	.about_movie{
		width:100%;
	}
	.about_subtitle{
		justify-content:center;
	}
	.about_container_top_title{
		margin-top:5px;
		font-size:26px;
		line-height:1.2308;
		text-align:center;
	}
	.about_container_top_title .tablet{
		display:block
	}
	.about_container_top_text{
		margin-top:22px;
		font-size:18px;
		line-height:1.7778;
		text-align:center;
	}
	.about_container_top_notes{
		position:static;
		padding-left:0;
		text-align:center;
	}
	.about_container_top_notes span{
		position:static;
		display:inline-block;
		padding-right:5px;
	}
	.about_container_bottom_inner{
		display:block;
		max-width:600px;
		padding:29px 40px 39px;
		text-align:center;
	}
	.about_container_bottom_left{
		display:inline-grid;
		grid-template-columns:108px auto;
		column-gap:15px;
	}
	.teachers_icon{
		grid-row:1/3;
		grid-column:1/2;
		justify-self:end;
	}
	.teachers_title{
		grid-row:1/2;
		grid-column:2/3;
		margin-left:0;
		font-size:24px;
		line-height:1.4167;
		letter-spacing:0.05em;
		text-align:left;
	}
	.teachers_title br{
		display:none;
	}
	.teachers_text{
		grid-row:2/3;
		grid-column:2/3;
		min-height:initial;
		margin-top:4px;
		padding-left:0;
		letter-spacing:0.05em;
	}
	.teachers_text::before{
		content:none;
	}
	.teachers_button{
		max-width:380px;
		margin:18px auto 0;;
	}
}
@media screen and (max-width:767px){
	.about_container_top{
		width:100%;
		max-width:initial;
	}
	.about_details{
		margin-top:20px;
	}
	.about_container_top_title{
		margin-top:6px;
		line-height:1.2308;
	}
	.about_container_top_title .tablet{
		display:none;
	}
	.about_container_bottom_inner{
		width:100%;
		max-width:initial;
	}
	.teachers_button{
		width:100%;
		max-width:initial;
		padding:0;
	}
}
@media screen and (max-width:599px){
	.about_container_top{
		padding:60px 30px 38px;
	}
	.about_container_bottom_inner{
		padding:29px 0 39px;
	}
	.teachers_title{
		letter-spacing:0;
	}
	.teachers_text{
		letter-spacing:0;
	}
	.teachers_button{
		padding:0 30px;
	}
}
@media screen and (max-width:440px){
	.about_container_top_title span{
		display:inline-block;
	}
}
@media screen and (max-width:413px){
	.about_container_top{
		padding:40px 20px;
	}
	.about_container_bottom_inner{
		padding:29px 20px 39px;
	}
	.about_container_bottom_left{
		grid-template-columns:81px auto;
	}
	.teachers_icon img{
		width:81px;
		height:54px;
	}
	.teachers_title{
		font-size:24px;
	}
	.teachers_text{
		font-size:16px;
	}
	.teachers_button{
		padding:0;
	}
}
@media screen and (max-width:374px){
		.about_container_top{
		padding:40px 15px;
	}
	.about_container_top_title span{
		display:inline;
	}
	.about_container_bottom_inner{
		padding:29px 15px 39px;
	}
	.about_container_bottom_left{
		column-gap:10px;
	}
	.teachers_title{
		font-size:20px;
	}
	.teachers_text{
		font-size:14px;
	}
}

/* #tool
-------------------------------------------------- */
#tool{
	position:relative;
	margin-top:-64px;
	padding:144px 0 77px;
	background:#f2f2f2;
	z-index:40;
}
.tool_lead{
	margin:31px auto 0;
	font-size:14px;
	line-height:1.8571;
	text-align:center;
}
.tool_lead span{
	display:inline-block;
}
#tool ul{
	display:flex;
	justify-content:space-between;
	margin-top:36px;
	column-gap:clamp(20px,100vw,30px);
}
#tool li{
	position:relative;
	width:clamp(180px,26.8817vw,198px);
	padding-bottom:0;
}
#tool h3{
	font-size:18px;
	line-height:1.55;
	color:#01b8af;
	font-weight:700;
	letter-spacing:0.06em;
	text-align:center;
}
.tool_thumbnails{
	margin-top:16px;
}
.tool_title{
	margin-top:1px;
	font-size:12px;
	line-height:1.55;
	font-weight:700;
	text-align:center;
	letter-spacing:0.06em;
}
.tool_text{
	margin-top:14px;
	font-size:14px;
	line-height:1.7143;
}
.tool_bottom_area{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
}
.tool_app{
	display:flex;
	justify-content:center;
	margin:17px auto 0;
}
.tool_app_icon,
.tool_app_icon img{
	width:auto;
	height:clamp(37px,4.2026vw,39px);
}
.tool_app_icon+.tool_app_icon{
	margin-left:auto;
}
.tool_notes{
	margin-top:29px;
	font-size:12px;
	line-height:1.6667;
	text-align:center;
}
.tool_notes span{
	display:inline-block;
}
@media screen and (max-width:880px){
	#tool{
		margin-top:-60px;
		padding-top:150px;
	}
	#tool ul{
		justify-content:space-between;
		flex-wrap:wrap;
		column-gap:24px;
		row-gap:38px;
	}
	#tool ul li{
		position:static;
		min-width:calc(50% - 12px);
		padding-bottom:0;
	}
	.tool_thumbnails {
		margin-top: 20px;
	}
	.tool_text {
	 	margin-top: 19px;
	}
}
@media screen and (max-width:540px){
	.tool_lead{
		max-width:520px;
	}
	#tool ul{
		flex-direction:column;
		justify-content:flex-start;
		align-items:center;
		max-width:520px;
		margin:48px auto 0;
		row-gap:0;
	}
	#tool li{
		position:static;
		width:100%;
		padding-bottom:0;
	}
	#tool li+li{
		margin-top:56px;
	}
	.tool_bottom_area{
		position:static;
		margin-top:17px;
	}
	.tool_button_wrapper{
		width:250px;
		margin:0 auto;
	}
	.tool_app{
		max-width:250px;
	}
	.tool_app_icon,
	.tool_app_icon img{
		height:39px;
	}
}
@media screen and (max-width:767px){
	#tool h2 .mobile{
		display:block;
	}
	.tool_lead{
		max-width:initial;
	}
	#tool ul{
		width:100%;
		max-width:initial;
		margin-top:44px;
	}
	.tool_thumbnails{
		margin-top:20px;
	}
	.tool_text{
		margin-top:19px;
	}
	.tool_button_wrapper{
		width:100%;
	}
}
@media screen and (max-width:599px){
	#tool{
		padding:122px 0 90px;
	}
	.tool_lead span{
		display:inline;
	}
	.tool_lead br{
		display:none;
	}
	.tool_notes span{
		display:inline;
	}
}

/* #reason
-------------------------------------------------- */
#reason{
	position:relative;
	margin-top:-64px;
	padding:151px 0 80px;
	background:#fff;
	z-index:30;
}
#reason::before{
	position:absolute;
	right:0;
	bottom:0;
	display:block;
	width:calc(50% + 560px);
	height:calc(100% - 407px);
	background:#fffbe3;
	z-index:-1;
	content:'';
}
#reason ul{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	width:100%;
	margin-top:40px;
}
#reason ul+ul{
/*	justify-content:space-around;
	max-width:880px;*/
	flex-wrap:wrap;
	justify-content:space-between;
	margin:36px auto 0;
/*	padding:0 clamp(119px,13.5135vw,125px);*/
}
#reason li{
	width:clamp(237px,26.8817vw,250px);
}
.reason_title{
	font-size:18px;
	line-height:1.4444;
	color:#01b8af;
	font-weight:700;
	text-align:center;
}
.reason_image{
	width:200px;
	margin:16px auto 0;
}
.reason_text{
	margin-top:14px;
	font-size:14px;
	line-height:1.8571;
}
.reason_text a{
	color:#3394bf;
}
#reason .reason_subtitle{
	margin-top:14px;
	font-size:14px;
	line-height:1.8571;
	color:#01CAC3;
	font-weight:700;
}
#reason .reason_subtitle sup{
	font-size:10px;
	line-height:1.8;
	color:#000;
	font-weight:400;
	vertical-align:top;
}
#reason .ios_app .reason_subtitle{
	margin-top:10px;
}
#reason .ios_app dl{
	display:flex;
	align-items:center;
	height:32px;
	margin-top:7px;
}
#reason .ios_app dl+dl{
	margin-top:9px;
}
#reason .ios_app dt{
	width:85px;
	font-size:12px;
	line-height:1.333;
	font-weight:700;
}
#reason .ios_app .app_img{
	display:flex;
	align-items:center;
	column-gap:9px;
	height:32px;
	margin:0;
}
#reason .ios_app .app_img li{
	width:auto;
}
#reason .ios_app img{
	width:auto;
	height:28px;
	vertical-allign:top;
}
#reason .ios_app .reason_note{
	/*position:absolute;*/
	margin-top:19px;
	font-size:12px;
	line-height:1.5;
	color:#333;
}
.reason_notice p{
	margin-top:1px;
	font-size:12px;
	line-height:1.6667;
}
@media screen and (max-width:880px){
	#reason{
		margin-top:-60px;
		padding-top:160px;
	}
	#reason::before{
		height:calc(100% - 446px);
	}
	#reason ul{
		margin-top:70px;
	}
}
@media screen and (max-width:838px){
	#reason::before{
		height:calc(100% - 335px);
	}
	#reason ul,
	#reason ul+ul{
		flex-direction:column;
		justify-content:flex-start;
		align-items:center;
		row-gap:36px;
		max-width:520px;
		margin:70px auto 0;
	}
	#reason ul+ul{
		margin-top:36px;
		padding:0;
	}
	#reason li{
		display:grid;
		grid-template-columns:122px 1fr;
		column-gap:24px;
		width:100%;
	}
	.reason_title{
		grid-row:1/2;
		grid-column:2/3;
		text-align:left;
	}
	.reason_image{
		grid-row:1/3;
		grid-column:1/2;
		width:122px;
		margin:0;
	}
	.reason_text{
		grid-row:2/3;
		grid-column:2/3;
		margin-top:8px;
	}
	#reason .ios_app,
	#reason .reason_notice{
		grid-row:3/4;
		grid-column:1/3;
		max-width:353px;
		margin:0 auto;
	}
	#reason .reason_subtitle{
		text-align:center;
	}
	#reason .ios_app .reason_subtitle{
		margin-top:8px;
	}
	#reason .reason_app{
		display:grid;
		grid-template-columns:150px 187px;
		grid-gap:8px 16px;
		margin-top:5px;
	}
	#ios_app01{
		grid-row:1/2;
		grid-column:1/2;
	}
	#ios_app02{
		grid-row:2/3;
		grid-column:1/2;
	}
	#ios_app03{
		grid-row:1/2;
		grid-column:2/3;
	}
	#ios_app04{
		grid-row:2/3;
		grid-column:2/3;
	}
	#reason .ios_app dl,
	#reason .ios_app dl+dl{
		margin-top:0;
	}
	#reason .ios_app .app_img li{
		display:flex;
		align-items:center;
		width:auto;
		height:32px;
	}
	#reason .ios_app .reason_note{
		grid-row:3/4;
		grid-column:1/3;
		margin-top:7px;
	}
	.reason_notice p{
		text-align:center;
	}
}
@media screen and (max-width:767px){
	#reason::before{
		height:calc(100% - 357px);
	}
	#reason h2 .mobile{
		display:block;
	}
	#reason ul,
	#reason ul+ul{
		width:100%;
		max-width:initial;
		margin-top:41px;
	}
}
@media screen and (max-width:599px){
	#reason{
		padding:122px 0 73px;
	}
	#reason::before{
		height:calc(100% - 301px);
	}
	.reason_title .mobile{
		display:block;
	}
}
@media screen and (max-width:413px){
	#reason .reason_app{
		grid-template-columns:1fr;
	}
	#ios_app03{
		grid-row:3/4;
		grid-column:1/2;
	}
	#ios_app04{
		grid-row:4/5;
		grid-column:1/2;
	}
	#reason .ios_app dl{
		width:187px;
		margin:0 auto;
	}
	#reason .ios_app .reason_note{
		grid-row:5/6;
		grid-column:1/2;
	}
}
@media screen and (max-width:374px){
	#reason::before{
		height:calc(100% - 290px);
	}
	#reason li{
		grid-template-columns:82px 1fr;
		column-gap:15px;
	}
	.reason_image{
		width:82px;
	}
}

/* #learning
-------------------------------------------------- */
#learning{
	position:relative;
	margin-top:-64px;
	padding:154px 0 100px;
	background:#fff;
	z-index:20;
}
@media screen and (max-width:880px){
	#learning{
		margin-top:-60px;
		padding-top:160px;
	}
}
@media screen and (max-width:599px){
	#learning{
		padding:122px 0 80px;
	}
}

/* common */
#case_study h3,
#work_example h3{
	font-size:24px;
	line-height:1.4;
	color:#01b8af;
	font-weight:700;
	letter-spacing:0.05em;
	text-align:center;
}
#case_study .notes,
#work_example .notes{
	font-size:12px;
	line-height:1.6667;
	text-align:center;
}
#case_study .notes span,
#work_example .notes span{
	display:inline-block;
}
@media screen and (max-width:599px){
	#case_study .notes span,
	#work_example .notes span{
		display:inline;
	}
}

/* #seminar */
#seminar{
	margin-top:60px;
}
#seminar ul{
	display:flex;
	justify-content:space-between;
}
#seminar li{
	width:calc((100% - 44px) / 2);
}
#seminar dl{
	display:grid;
	grid-template-columns:150px 1fr;
	column-gap:19px;
}
.seminar_title{
	font-size:16px;
	line-height:1.5;
	font-weight:700;
}
.seminar_date{
	font-size:16px;
	line-height:1.5;
}
.seminar_text{
	margin-top:9px;
	font-size:14px;
	line-height:1.5714;
}
.seminar_link{
	margin-top:11px;
	font-size:14px;
	line-height:1.5714;
	font-weight:700;
}
.seminar_link+.seminar_link{
	margin-top:7px;
}
@media screen and (max-width:838px){
	#seminar ul{
		flex-direction:column;
		justify-content:flex-start;
		row-gap:40px;
		max-width:520px;
		margin:0 auto;
	}
	#seminar li{
		width:100%;
	}
	#seminar dl{
		column-gap:24px;
	}
}
@media screen and (max-width:767px){
	#seminar{
		margin-top:41px;
	}
	#seminar ul{
		width:100%;
		max-width:initial;
	}
}
@media screen and (max-width:599px){
	#learning h2 .mobile{
		display:block;
	}
	#seminar dl{
		grid-template-columns:122px 1fr;
		column-gap:24px;
	}
}
@media screen and (max-width:374px){
	#seminar dl{
		grid-template-columns:82px 1fr;
		column-gap:15px;
	}
}

/* #case_study */
#case_study{
	margin-top:40px;
}
#case_study .notes{
	margin-top:11px;
}
.case_studies{
	position:relative;
	margin-top:39px;
	border:2px solid #01b8af;
	border-radius:16px;
	overflow:hidden;
}
.case_studies+.case_studies{
	margin-top:30px;
}
.case_studies::before{
	position:absolute;
	top:0;
	right:0;
	display:block;
	width:calc(100% - 548px);
	height:100%;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:auto 100%;
	content:'';
}
#case_studies1::before{
	background-image:url(../images/case_studies1_bg.jpg);
}
#case_studies2::before{
	background-image:url(../images/case_studies2_bg.jpg);
}
.case_studies_inner{
	width:548px;
	padding:38px 38px 37px;
}
.case_studies_title{
	display:grid;
	grid-template-columns:auto 1fr;
	align-items:center;
	column-gap:20px;
}
.case_studies_title h4{
	display:flex;
	justify-content:center;
	align-items:center;
	width:100px;
	height:36px;
	font-size:18px;
	line-height:1.5;
	color:#fff;
	font-weight:700;
	letter-spacing:0.15em;
	text-indent:0.15em;
	background:#01b8af;
}
.case_studies_title h5{
	font-size:24px;
	line-height:1.3333;
	font-weight:700;
	letter-spacing:0.075em;
}
.case_studies_text{
	margin-top:18px;
	font-size:16px;
	line-height:1.75;
}
.case_studies_link{
	margin-top:15px;
	font-size:15px;
	line-height:1.6667;
	font-weight:700;
}
.case_studies_link+.case_studies_link{
	margin-top:3px;
}
#case_studies1 .case_studies_link:last-of-type{
	margin-top:10px;
}
.case_studies_image_bottom{
	display:none;
}
.case_studies_image_bottom img{
	vertical-align:bottom;
}
@media screen and (max-width:880px){
	#case_study{
		margin-top:60px;
	}
	#case_study .notes{
		margin-top:21px;
	}
	.case_studies+.case_studies{
		margin-top:50px;
	}
	.case_studies::before{
		width:calc(100% - 428px);
	}
	.case_studies_inner{
		width:428px;
	}
	#case_studies2 .case_studies_title{
		grid-template-columns:1fr;
		align-items:start;
		row-gap:18px;
	}
	.case_studies_link{
		margin-top:17px;
	}
	.case_studies_link+.case_studies_link,
	#case_studies1 .case_studies_link:last-of-type{
		margin-top:8px;
	}
	.case_studies_link br{
		display:none;
	}
}
@media screen and (max-width:767px){
	.case_studies::before{
		content:none;
	}
	.case_studies_inner{
		width:100%;
		padding:28px 28px 36px;
	}
	.case_studies_title{
		grid-template-columns:1fr;
		align-items:start;
		row-gap:20px;
	}
	.case_studies_title h4{
		width:90px;
		height:34px;
		font-size:16px;
	}
	.case_studies_title h5{
		font-size:20px;
	}
	.case_studies_text{
		margin-top:20px;
	}
	.case_studies_link+.case_studies_link,
	#case_studies1 .case_studies_link:last-of-type{
		margin-top:10px;
	}
	.case_studies_image_bottom{
		display:block;
	}
}
@media screen and (max-width:413px){
	.case_studies_title h5{
		letter-spacing:0;
	}
}
@media screen and (max-width:374px){
	.case_studies{
		width:calc(100% + 14px);
		max-width:initial;
		margin:39px -7px 0;
	}
	.case_studies_inner{
		padding:23px 18px 36px;
	}
}

/* #work_example */
#work_example{
	margin-top:62px;
}
.work_example_lead{
	margin-top:19px;
	font-size:16px;
	line-height:1.75;
	text-align:center;
}
.work_example_lead span{
	display:inline-block;
}
.work_example_link{
	font-size:14px;
	line-height:1.5;
	margin-top:12px;
	text-align:center;
}
.work_example_img{
	margin-top:29px;
	text-align:center;
}
#work_example .notes{
	margin-top:2px;
}
#work_example ul{
	display:flex;
	justify-content:space-between;
	margin-top:29px;
}
#work_example li{
	width:clamp(242px,27.5vw,275px);
}
#work_example dd{
	margin-top:17px;
	font-size:16px;
	line-height:1.375;
	font-weight:700;
	text-align:center;
}
.usage_button_wrapper{
	max-width:350px;
	margin:40px auto 0;
}
.tooltutorial_button_wrapper{
	max-width:350px;
	margin:42px auto 0;
}

@media screen and (max-width:880px){
	.work_example_lead{
		margin-top:29px;
	}
	#work_example ul{
		margin-top:39px;
	}
}
@media screen and (max-width:838px){
	#work_example ul{
		flex-direction:column;
		justify-content:flex-start;
		row-gap:40px;
	}
	#work_example li{
		width:100%;
	}
	#work_example .notes{
		margin-top:2px;
	}
}
@media screen and (max-width:767px){
	#work_example{
		margin-top:80px;
	}
	.work_example_lead span{
		display:inline-block;
	}
	#work_example dd{
		margin-top:20px;
	}
	.usage_button_wrapper{
		width:100%;
		max-width:initial;
		margin-top:50px;
	}
	.tooltutorial_button_wrapper{
		width:100%;
		max-width:initial;
		margin-top:36px;
	}
}
@media screen and (max-width:599px){
	.work_example_contest2021 span{
		display:inline;
	}
}
@media screen and (max-width:413px){
	.work_example_lead{
		margin-top:17px;
	}
	.work_example_lead span{
		display:inline;
	}
}
@media screen and (max-width:376px){
	.button.large{
		font-size:18px;
	}
}

/* #ael AEL
-------------------------------------------------- */
#ael{
	position:relative;
	margin:0;
	padding:0 0 64px;
	background-image: linear-gradient(90deg, rgba(167, 255, 255, 1), rgba(255, 168, 221, 1));
	z-index:10;
}
#ael .ael_inner{
	display:flex;
	max-width:880px;
	margin:0 auto;
	padding:30px 0 32px;
}
#ael .ael_inner .wideblock_ace{
	border-right:2px dotted #36383C;
	padding-right:40px;
	width:100%;
	max-width:50%;
	padding-top:6px;
}
#ael .ael_inner .block_ace{
	width:100%;
}
#ael .ael_inner .block_ace .ace{
	display:flex;
}
#ael .ael_inner .block_ace .ace .logo_ace{
	max-width:60px;
}
#ael .ael_inner .block_ace .ace .txt_ace{
	padding-left:21px;
}
#ael .ael_inner .block_ace .ace .txt_ace h4{
	font-size:24px;
	font-weight:600;
	line-height:30px;
}
#ael .ael_inner .block_ace .ace .txt_ace p{
	font-size:12px;
	line-height:28px;
	font-weight:600;
	padding-top:0;
	padding-bottom:0;
}
#ael .ael_inner .block_ace p{
	font-size:13px;
	line-height:22px;
	font-weight:600;
	padding-top:10px;
	padding-bottom:4px;
}
#ael .ael_inner .block_ace a{
	font-size:13px;
	line-height:22px;
	font-weight:600;
	color:#1473e6;
}
#ael .ael_inner .wideblock_ael{
	padding-left:40px;
	width:100%;
	max-width:50%;
	padding-top:6px;
}
#ael .ael_inner .block_ael{
	width:100%;
}
#ael .ael_inner .block_ael .ael{
	display:flex;
}
#ael .ael_inner .block_ael .ael .logo_ael{
	max-width:60px;
}
#ael .ael_inner .block_ael .ael .txt_ael{
	padding-left:21px;
}
#ael .ael_inner .block_ael .ael .txt_ael h4{
	font-size:24px;
	font-weight:600;
	line-height:30px;
}
#ael .ael_inner .block_ael .ael .txt_ael p{
	font-size:12px;
	line-height:28px;
	font-weight:600;
	padding-top:0;
	padding-bottom:0;
}
#ael .ael_inner .block_ael p{
	font-size:13px;
	line-height:22px;
	font-weight:600;
	padding-top:10px;
	padding-bottom:4px;
}
#ael .ael_inner .block_ael a{
	font-size:13px;
	line-height:22px;
	font-weight:600;
	color:#1473e6;
}
@media screen and (max-width:920px){
	#ael .ael_inner .wideblock_ace{
		padding-left:30px;
		padding-right:30px;
	}
	#ael .ael_inner .wideblock_ael{
		padding-left:30px;
	}
}
@media screen and (max-width:800px){
	#ael .ael_inner{
		display:block;
		padding:37px 30px 32px;
	}
	#ael .ael_inner .wideblock_ace{
		width:100%;
		max-width:100%;
		border-right:none;
		border-bottom:2px dotted #36383C;
		padding:0;
	}
	#ael .ael_inner .block_ace{
		padding-left:0;
		padding-right:0;
		max-width:500px;
		margin:0 auto;
		padding:0 0 30px 0;
	}
	#ael .ael_inner .block_ace .ace .logo_ace{
		max-width:50px;
	}
	#ael .ael_inner .block_ace .ace .txt_ace{
		padding-left:15px;
	}
	#ael .ael_inner .block_ace .ace .txt_ace h4{
		font-size:22px;
		line-height:28px;
	}
	#ael .ael_inner .block_ace .ace .txt_ace p{
		font-size:10px;
		line-height:22px;
		padding-top:0;
		padding-bottom:0;
	}
	#ael .ael_inner .block_ace p{
		font-size:12px;
		line-height:20px;
		padding-top:7px;
		padding-bottom:4px;
	}
	#ael .ael_inner .block_ace a{
		font-size:12px;
		line-height:20px;
	}
	#ael .ael_inner .wideblock_ael{
		width:100%;
		max-width:100%;
		padding:0;
	}
	#ael .ael_inner .block_ael{
		padding-left:0;
		width:100%;
		max-width:500px;
		margin:0 auto;
		padding:30px 0 0 0;
	}
	#ael .ael_inner .block_ael .ael .logo_ael{
		max-width:50px;
	}
	#ael .ael_inner .block_ael .ael .txt_ael{
		padding-left:15px;
	}
	#ael .ael_inner .block_ael .ael .txt_ael h4{
		font-size:22px;
		line-height:28px;
	}
	#ael .ael_inner .block_ael .ael .txt_ael p{
		font-size:10px;
		line-height:22px;
		padding-top:0;
		padding-bottom:0;
	}
	#ael .ael_inner .block_ael p{
		font-size:12px;
		line-height:20px;
		padding-top:7px;
		padding-bottom:4px;
	}
	#ael .ael_inner .block_ael a{
		font-size:12px;
		line-height:20px;
	}
	.pc {
		display:none;
	}
}
/* #faq
-------------------------------------------------- */
#faq{
	position:relative;
	margin-top:-64px;
	padding:156px 0 100px;
	background:#f2f2f2;
	z-index:10;
}
#faq h2{
	font-size:30px;
	line-height:1.4;
	font-weight:700;
	text-align:center;
	letter-spacing:0.05em;
}
.faq_contents_wrapper{
	display:flex;
	justify-content:space-between;
	margin-top:42px;
}
.faq_contents{
	width:calc((100% - 40px) / 2);
}
.faq_contents li:not(:first-of-type){
	margin-top:20px;
}
.faq_hidden_contents{
	display:none;
}
.question{
	position:relative;
	display:flex;
	align-items:center;
	min-height:54px;
	padding:8px 54px 8px 20px;
	font-size:14px;
	line-height:1.3571;
	font-weight:700;
	background:#fff;
	cursor:pointer;
}
.question::before{
	position:absolute;
	top:50%;
	right:12px;
	display:block;
	width:30px;
	height:30px;
	border-radius:50%;
	background:#01B8AF;
	transform:translateY(-50%);
	content:'';
}
.question::after{
	position:absolute;
	top:50%;
	right:22px;
	margin-top:1px;
	border-top:6px solid #FFF;
	border-right:5px solid transparent;
	border-left:5px solid transparent;
	transform:translateY(-50%);
	transform-origin:center 1px;
	transition:.3s;
	content:'';
}
.question.active::after{
	margin-top:0;
	transform:rotate(180deg);
}
.answer{
	display:none;
}
.answer p{
	padding-top:19px;
	font-size:12px;
	line-height:1.6667;
}
.answer p+p{
	margin-top:10px;
	padding:0;
}
.faq_button_wrapper{
	max-width:440px;
	margin:41px auto 0;
}
@media screen and (max-width:880px){
	#faq{
		margin-top:-60px;
		padding-top:153px;
	}
	#faq h2{
		font-size:28px;
	}
	.faq_contents_wrapper{
		margin-top:41px;
	}
	.faq_contents li:not(:first-of-type){
		margin-top:20px;
	}
	.faq_contents li:not(:last-of-type) .answer{
		padding-bottom:20px;
	}
	.question{
		min-height:77px;
		padding:15px 54px 14px 20px;
		font-size:15px;
		line-height:1.6;
	}
	.question br{
		display:none;
	}
	.faq_button_wrapper{
		margin-top:40px;
	}
	.usage_button_wrapper{
		margin-top:40px;
	}
	.tooltutorial_button_wrapper{
		margin-top:36px;
	}
}
@media screen and (max-width:767px){
	.faq_contents{
		width:100%;
	}
	.faq_contents.right{
		display:none;
	}
	.faq_hidden_contents{
		display:block;
	}
	.faq_button_wrapper{
		width:100%;
		max-width:initial;
	}
}
@media screen and (max-width:599px){
	#faq{
		padding:124px 0 80px;
	}
	#faq h2{
		font-size:22px;
	}
	.faq_contents li:not(:last-of-type) .answer{
		padding-bottom:16px;
	}
	.faq_button_wrapper{
		margin-top:30px;
	}
	#faq .button{
		height:64px;
	}
	#faq .button .mobile{
		display:block;
	}
}
@media screen and (max-width:413px){
	.usage_button_wrapper{
		margin-top:30px;
	}
}
@media screen and (max-width:374px){
	.question{
		padding-left:15px;
		font-size:14px;
	}
}

/* #sub_page
================================================== */

/* common
-------------------------------------------------- */
#sub_page main{
	padding-top:64px;
}
#contents_header{
	padding: 80px 0 90px;
	background: linear-gradient(101deg, #917BF5 17.78%, #EB56D9 84.09%);
	color: #fff;
}
#contents_header header{
	max-width:1000px;
	margin:0 auto;
	padding:0 60px;
	text-align:center;
}
#contents_header h1{
	font-size:32px;
	line-height:1.45;
	font-weight:700;
	letter-spacing:0.05em;
}
#contents_header h1 span{
	/* background: linear-gradient(transparent 85%,#ffe600 0%);
	padding-bottom: .2em; */
}
#contents_header p{
	margin-top:39px;
	font-size:16px;
	line-height:1.75;
}
#contents_header p.plusimg{
	margin-top:16px;
	margin-bottom:9px;
}
#contents_header p span{
	display:inline-block;
}
#contents_header .notes{
	margin-top:5px;
	font-size:12px;
	line-height:1.75;
}
#contents_header .notes+.notes{
	margin-top:1px;
	margin-bottom:30px;
}
.contents{
	padding:80px 0 60px;
}
#contents_header header .link_button{
	width:315px;
}
#contents_header header ul{
	display:flex;
	justify-content: center;
	gap:14px;
	margin:39px 0 17px;
}
#contents_header header ul li{
	width:48px;
}
#contents_header header ul li img{
	width:100%;
	height:auto;
}
#contents_header.training_header{
	background: linear-gradient(101deg, #917BF5 17.78%, #EB56D9 84.09%);
	color: #fff;
}

#contents_header.training_header h1 span {
	display:inline-block;
	background:none;
}

@media screen and (max-width:880px){
	#contents_header{
		padding:56px 0 75px;
	}
	#contents_header header{
		max-width:840px;
		padding:0 40px;
	}
	#contents_header h1{
		font-size:28px;
		line-height:1.6429;
	}
	#contents_header p{
		margin-top:41px;
	}
}
@media screen and (max-width:599px){
	#contents_header{
		padding:49px 0 50px;
	}
	#contents_header header{
		padding:0 30px;
	}
	#contents_header h1{
		font-size:22px;
		line-height:1.5455;
		letter-spacing:0;
	}
	#contents_header h1 .mobile{
		display:block;
	}
	#contents_header p{
		margin-top:28px;
	}
	#contents_header p span{
		display:inline;
	}
	#contents_header p br{
		display:none;
	}
	#contents_header p br.mobile{
		display:block;
	}
	#contents_header .notes{
		margin-top:12px;
	}
	#contents_header header{
		padding:0 30px;
	}
}
@media screen and (max-width:413px){
	#contents_header h1{
		font-size:21px;
	}
}
@media screen and (max-width:400px){
	#contents_header header{
		padding:0 20px;
	}
	#contents_header h1{
		font-size:20px;
	}
}
@media screen and (max-width:374px){
	#contents_header header{
		padding:0 15px;
	}
	#contents_header header .link_button{
		width:100%;
	}
}

/* #config
-------------------------------------------------- */
#config{
	padding:80px 0 64px;
	color:#333;
	background:#fff;
}
#config h1{
	letter-spacing:0.04em;
}
.config_text{
	margin-top:39px;
	text-align:center;
}
.config_note{
	margin-top:6px;
	font-size:1.2rem;
	line-height:1.75;
	color:#888;
	text-align:center;
}
#config dl{
	position:relative;
	align-items:flex-end;
}
/*#config dl+dl{
	margin:0;
	border-top:1px solid #888;
}*/
#config dl+dl {
	margin:0;
}
#config dl+dl::before {
	background-image: radial-gradient(#888 10%, transparent 0), radial-gradient(#888 10%, transparent 0);
	background-position: 0 0, 6px 0;
	background-size: 12px 12px;
	content: '';
	display: inline-block;
	height: 12px;
	width: 100%;
	position:absolute;
	top:0;
}
#config #step1{
	padding-bottom:52px;
}
#config #step2{
	padding:52px 0 56px;
}
#config #step3{
	align-items:flex-start;
	padding:66px 0 58px;
}
#config dt,
#config dd{
	width:calc((100% - 60px) / 2);
}
#config dt{
	padding-bottom:2px;
}
.config_step{
	font-size:60px;
	line-height:80px;
	font-weight:700;
	letter-spacing:0.04em;
}
.config_step span{
	font-size:75px;
	color:#01B8AF;
}
#step2 img{
	margin:0 0 58px;
}

#step3 .config_step{
	margin-top:11px;
}
#config h2{
	margin:32px 0 18px;
	padding:1px 0 4px 20px;
	font-size:22px;
	line-height:32px;
	font-weight:700;
	letter-spacing:0.075em;
	border-left:6px solid #1DB8AF;
	color:#1DB8AF;
}
.step1_text, .step2_text, .step3_text{
	margin-top:8px;
	font-size:16px;
	line-height: 1.75;
}
.step1_text a{
	text-decoration:underline;
}
.step1_text+.step1_text{
	margin-top:8px;
}
.config_link{
	margin-top:17px;
	font-size:16px;
	line-height:1.625;
	font-weight:700;
}
.link_button{
	max-width:510px;
	margin:0 auto;
}
#config .link_button+p{
	margin-top:16px;
	font-weight:700;
	text-align:center;
}
#config .linkinfo {
	font-size:16px;
}
.config_link-list{
	width:-moz-fit-content;
  width:fit-content;
	margin:18px auto 0;
	text-align:center;
}
.config_link-list li+li{
	margin-top:8px;
}
.config_link-list a{
	font-size:16px;
	line-height:1.5;
	font-weight:700;
}
.config_link-contact {
	margin-top: 32px;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.6;
	max-width: 480px;
}
@media screen and (max-width:910px){
	.config_text .pc{
		display:none;
	}
	.config_text .tablet{
		display:block;
	}
}
@media screen and (max-width:880px){
	#config{
		padding:58px 0 99px;
	}
	.config_text{
		margin-top:38px;
	}
	#config dl{
		margin-top:0;
	}
	#config #step2{
		padding:52px 0 53px;
	}
	#config #step3{
		padding:49px 0 72px;
	}
	#config dt{
		width:calc(100% - 360px);
	}
	#config dd{
		width:320px;
	}
	#config #step2 dd .config_link{
		margin-right:-30px;
	}
	#step3 dt{
		padding-top:22px;
	}
	#step3 .config_step{
		margin-top:5px;
	}
	.link_button{
		margin-top:0;
	}
}
@media screen and (max-width:767px){
	#config{
		padding:46px 0 57px;
	}
	#config h2{
		margin:23px 0 18px;
	}
	.config_text{
		margin-top:27px;
	}
	.config_text br,
	.config_text .tablet{
		display:none;
	}
	.config_note{
		margin-top:13px;
	}
	.config_note .mobile{
		display:block;
	}
	#config dl{
		flex-direction:column-reverse;
		justify-content:flex-start;
		align-items:center;
		margin-top:0;
	}
	#config #step1{
		padding-bottom:53px;
	}
	#config #step2{
		padding:39px 0 53px;
	}
	#step2 img{
		margin:0;
	}
	#config #step3{
		padding:39px 0 72px;
	}
	#config dt,
	#config dd{
		width:100%;
	}
	#config dt{
		max-width:400px;
		margin:38px auto 0;
		padding-bottom:0;
	}
	.config_step{
		font-size:46px;
		line-height:72px;
		letter-spacing:0.04em;
		text-align:center;
	}
	.config_step span{
		font-size:60px;
	}
	#config #step2 dd .config_link{
		margin-right:0;
	}
	#step3 dt{
		padding-top:0;
	}
	.link_button{
		max-width:initial;
		text-align:center;
	}
	.link_button a .mobile{
		display:block;
	}
	#config .link_button+p{
		margin-top:15px;
	}
	.config_link-list{
		margin-top:25px;
	}
	.config_link-list li+li{
		margin-top:16px;
	}
	.config_link-list a{
		line-height:1.875;
	}
	#config .link_button a{
		height:76px;
	}
}
@media screen and (max-width:399px){
	.link_button a .mobile{
		display:none;
	}
	.link_button a br{
		display:block;
	}
}

/* #usage
-------------------------------------------------- */
#usage{
	padding:57px 0 40px;
	color:#333;
	background:#fff;
}
.usage_contents_header_notes{
	font-size:18px;
	line-height:1.5;
	color:#000;
	font-weight:700;
	text-align:center;
}
.usage_contents_header_notes span:not(.notes_wrapper){
	display:inline-block;
	padding-top:5px;
	background:linear-gradient(transparent 75%,#FFCE00 0%);
}
.usage_contents_header_notes span.notes_wrapper{
	display:inline-block;
}
#usage p.usage_contents_header_link{
	padding-bottom:63px;
	padding-top:5px;
	text-align:center;
	border-bottom:1px dashed #999;
}
#usage p.usage_contents_header_link a{
	font-size:14px;
	line-height:32px;
	color:#1473E6;
	font-weight:700;
}
#usage .spark_page .title, #usage .spark_video .title, #usage .adobe_express .title{
	width:100%;
	height:auto;
	max-width:269px;
	margin:0 auto;
	line-height:1;
	margin-bottom:35px;
}
#usage .spark_video .title, #usage .spark_page .title{
	margin-top:54px;
}
#usage .adobe_express .title{
	margin-top:70px;
	max-width:315px;
}
#usage .spark_page .title{
	max-width:627px;
}
#usage .spark_video .title{
	max-width:269px;
}
#usage ul {
	display:grid;
	grid-template-columns: repeat(auto-fit, minmax(176px, 1fr));
	column-gap:40px;
	row-gap:40px;
	padding-bottom:67px;
	position:relative;
}
#usage .spark_page ul::after, #usage .adobe_express ul::after {
	background-image: radial-gradient(#888 11%, transparent 0), radial-gradient(#888 11%, transparent 0);
	background-position: 0 0, 5px 0;
	background-size: 10px 10px;
	content: '';
	display: inline-block;
	height: 12px;
	width: 100%;
	position:absolute;
	bottom:0;
}
#usage ul li{
	position:relative;
}
#usage ul li::before{
	background-image: radial-gradient(#999 11%, transparent 0), radial-gradient(#999 11%, transparent 0);
	background-position: 0 0, 0 5px;
	background-size: 10px 10px;
	content: '';
	display: inline-block;
	height: 100%;
	width: 10px;
	position:absolute;
	bottom:0;
	left:-25px;
}
#usage ul li:nth-of-type(4n+1)::before{
	background:none;
}
#usage ul li h3 {
	font-size:12px;
	line-height:26px;
	letter-spacing:0.025em;
	font-weight:600;
	margin:11px 0 0;
}
#usage ul li p {
	font-size:14px;
	line-height:22px;
	letter-spacing:0.05em;
	font-weight:600;
	color:#01B8AF;
	margin-bottom:15px;
}
#usage .spark_video ul {
	row-gap:40px;
	padding-bottom:100px;
	position:relative;
}
#usage .spark_video ul li ul {
	column-gap: 20px;
	padding-bottom:0;
}
#usage .spark_video ul li ul li::before {
	background:none;
}
#usage .spark_video ul li ul li+li div+div {
	margin-top:10px;
}
#usage .spark_video ul li:nth-of-type(3n+1)::before{
	background:none;
}
#usage .spark_video ul li:nth-of-type(5n)::before{
	background-image: radial-gradient(#999 11%, transparent 0), radial-gradient(#999 11%, transparent 0);
	background-position: 0 0, 0 5px;
	background-size: 10px 10px;
	content: '';
	display: inline-block;
	height: 100%;
	width: 10px;
	position:absolute;
	bottom:0;
}
#usage .spark_video>ul>li:nth-of-type(2) {
	grid-column: 2 / 4;
}
@media screen and (max-width:944px){
	#usage ul {
		column-gap:50px;
	}
	#usage ul li+li::before{
		left:-29px;
	}
	#usage ul li:nth-of-type(4n+1)::before{
		background-image: radial-gradient(#999 11%, transparent 0), radial-gradient(#999 11%, transparent 0);
		background-position: 0 0, 0 5px;
		background-size: 10px 10px;
	}
	#usage ul li:nth-of-type(3n+1)::before {
		background:none;
	}
	#usage .spark_video ul li:nth-of-type(4)::before{
		background-image: radial-gradient(#999 11%, transparent 0), radial-gradient(#999 11%, transparent 0);
		background-position: 0 0, 0 5px;
		background-size: 10px 10px;
	}
	#usage .spark_video ul li:nth-of-type(3)::before{
		background:none;
	}
}
@media screen and (max-width:839px){
	#usage .spark_page .title{
		max-width:230px;
	}
	#usage p.usage_contents_header_link{
		padding-top:18px;
		padding-bottom:53px;
	}
}
@media screen and (max-width:707px){
	#usage ul {
		column-gap:46px;
	}
	#usage ul li+li::before{
		left:-27px;
	}
}
@media screen and (max-width:699px){
	#usage .adobe_express .title{
		max-width:230px;
	}
	#usage .spark_video .title{
		max-width:195px;
	}
	#usage ul li:nth-of-type(3n+1)::before {
		background-image: radial-gradient(#999 11%, transparent 0), radial-gradient(#999 11%, transparent 0);
		background-position: 0 0, 0 5px;
		background-size: 10px 10px;
	}
	#usage ul li::before {
		background-image: radial-gradient(#999 11%, transparent 0), radial-gradient(#999 11%, transparent 0);
		background-position: 0 0, 0 5px;
		background-size: 10px 10px;
	}
	#usage ul li:nth-of-type(2n+1)::before {
		background:none;
	}
	#usage .spark_video ul li:nth-of-type(3)::before, #usage .spark_video ul li:nth-of-type(5)::before {
		background-image: radial-gradient(#999 11%, transparent 0), radial-gradient(#999 11%, transparent 0);
		background-position: 0 0, 0 5px;
		background-size: 10px 10px;
	}
	#usage .spark_video ul li:nth-of-type(2)::before, #usage .spark_video ul li:nth-of-type(4)::before {
		background:none;
	}
	#usage .spark_video>ul>li:nth-of-type(4) {
		order:2;
	}
	#usage .spark_video>ul>li:nth-of-type(5) {
		order:2;
	}
	#usage .spark_video>ul>li:nth-of-type(2) {
		grid-column: 1 / 3;
		order:1;
	}
	#usage .spark_video ul li:nth-of-type(2) ul {
		column-gap: 46px;
	}
	#usage .spark_video ul li:nth-of-type(2) ul {
		column-gap: 46px;
	}
	.mobile {
		display:block;
	}
	.pc {
		display:none;
	}
}
@media screen and (max-width:880px){
	#usage{
		padding:57px 0 99px;
	}
}
@media screen and (max-width:767px){
	#usage{
		padding:57px 0 57px;
	}
	#usage h2{
		margin:23px 0 18px;
	}
}
@media screen and (max-width:549px){
	#usage ul {
		grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	}
}

@media screen and (max-width:385px){
	#usage ul li::before {
		background:none !important;
	}
	#usage .spark_video>ul>li:nth-of-type(2) {
		grid-column: 1 / 1;
		order:2;
	}
	#usage .spark_video ul li:nth-of-type(2) ul {
	    column-gap: 46px;
	    row-gap: 0;
	}
}
@media screen and (max-width:374px){
	.usage_contents_header_notes{
		font-size:16px;
	}
}

/* #training
-------------------------------------------------- */
#intro{
	padding:58px 0 80px;
	position:relative;
	text-align:center;
}
.training_contents_header_notes{
	font-size:18px;
	line-height:1.5;
	color:#000;
	font-weight:700;
	text-align:center;
}
.training_contents_header_notes span:not(.notes_wrapper){
	display:inline-block;
	padding-top:5px;
	background:linear-gradient(transparent 75%,#FFCE00 0%);
}
.training_contents_header_notes span.notes_wrapper{
	display:inline-block;
}
#training p.training_contents_header_link{
	padding-bottom:63px;
	padding-top:5px;
	text-align:center;
	border-bottom:1px dashed #999;
}
#training p.training_contents_header_link a{
	font-size:14px;
	line-height:32px;
	color:#1473E6;
	font-weight:700;
}
#intro p{
	padding-bottom:54px;
	padding-top:16px;
}
#intro p a{
	font-size:14px;
	line-height:32px;
	color:#1473E6;
	font-weight:700;
}
#intro p strong{
	font-size:20px;
	line-height:36px;
	color:#01B8AF;
	letter-spacing:0.05em;
	font-weight:700;
}
#intro p+p{
	padding-top:57px;
	border-top:1px dashed #999;
	padding-bottom:26px;
}
#intro img {
	width:100%;
	max-width:408px;
}
#online_training{
	text-align:center;
}
#online_training.contents{
	padding-top:0;
	position:relative;
}
#online_training::before{
	background:#FFFBE3;
	content: '';
	display: block;
	width:calc(50% + 560px);
	height:100%;
	position:absolute;
	z-index:-1;
	right:0;
}
#online_training .inner{
	padding-top:80px;
	padding-bottom:40px;
}
#online_training .inner section .online_training_img{
	text-align:right;
}
#online_training .inner section .online_training_img img{
	max-width:409px;
}
#online_training h2{
	font-size:32px;
	line-height:46px;
	font-weight:700;
	letter-spacing:0.05em;
	padding-bottom:60px;
}
#online_training h2 span{
	background:linear-gradient(transparent 75%,#FFE600 0%);
}
#online_training .online_grid{
	display:grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	column-gap:50px;
	row-gap:32px;
	padding-bottom:10px;
	position:relative;
}
#online_training .online_grid{
	text-align:left;
}
#online_training .online_grid p{
	font-size:14px;
	line-height:26px;
}
#online_training .online_grid p strong{
	font-weight:600;
}
#online_training .online_grid h3{
	display: flex;
	align-items: center;
	color:#01B8AF;
	font-weight:600;
	padding:20px 0 10px;
}
#online_training .online_grid .training_contents ul.training_contents_course{
	padding-left:18px;
}
#online_training .online_grid .training_contents ul.training_contents_course li{
	font-size:14px;
	line-height:22px;
	font-weight:700;
	position:relative;
	padding-bottom:4px;
}
#online_training .online_grid .training_contents ul.training_contents_course li:before{
	background:#01B8AF;
	content: '';
	display: block;
	width:8px;
	height:8px;
	border-radius:4px;
	position:absolute;
	left:-18px;
	top:8px;
}
#online_training .online_grid .training_contents ul.training_contents_course li:last-child{
	padding-bottom:7px;
}
#online_training .online_grid .training_contents .training_contents_notes{
	padding-left:18px;
}
#online_training .online_grid .training_contents .training_contents_notes li strong{
	font-weight:700;
}
#online_training .online_grid .training_contents .training_contents_notes li{
	font-size:12px;
	line-height:18px;
	position:relative;
	padding-bottom:6px;
}
#online_training .online_grid .training_contents .training_contents_notes li:before{
	content:"\203B";
	position:absolute;
	left:-17px;
	top:0px;
}
#online_training .online_grid .training_preparation ul{
	padding-left:18px;
}
#online_training .online_grid .training_preparation ul li{
	font-size:14px;
	line-height:22px;
	font-weight:700;
	position:relative;
	padding-bottom:4px;
}
#online_training .online_grid .training_preparation ul li:before{
	background:#01B8AF;
	content: '';
	display: block;
	width:8px;
	height:8px;
	border-radius:4px;
	position:absolute;
	left:-18px;
	top:7px;
}
#online_training .online_grid .training_preparation .training_preparation_notes{
	font-size:12px;
	line-height:22px;
}

#online_training .online_grid h3:after {
	content: "";
	flex-grow: 1;
	height: 1px;
	display: block;
	margin-left: 10px;
	background:#01B8AF;
}
#online_training .online_grid div:nth-of-type(3){
	grid-column: 1 / 3;
}
#online_training .online_grid .training_apply ul{
	padding-left:18px;
}
#online_training .online_grid .training_apply ul li{
	font-size:14px;
	line-height:26px;
	position:relative;
	padding-bottom:4px;
}
#online_training .online_grid .training_apply ul li strong{
	font-weight:700;
}
#online_training .online_grid .training_apply ul li:before{
	background:#01B8AF;
	content: '';
	display: block;
	width:8px;
	height:8px;
	border-radius:4px;
	position:absolute;
	left:-18px;
	top:9px;
}
#online_training .link_button{
	max-width:315px;
}

#video_training{
	text-align:center;
	padding:0 0 0;
	position:relative;
	margin-top:60px;
	margin-bottom:100px;
	overflow:hidden;
}
#video_training::before{
	background:#F2F2F2;
	content: '';
	display: block;
	width:calc(50% + 560px);
	height:100%;
	position:absolute;
	z-index:-1;
	left:0;
}
#video_training h2{
	font-size:32px;
	line-height:46px;
	font-weight:700;
	letter-spacing:0.05em;
	padding-bottom:60px;
}
#video_training h2 span{
	background:linear-gradient(transparent 75%,#FFE600 0%);
}
#video_training .online_grid{
	display:grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	column-gap:50px;
	row-gap:32px;
	position:relative;
	text-align:left;
}
#video_training .online_grid p{
	font-size:14px;
	line-height:26px;
}
#video_training .online_grid p strong{
	font-weight:600;
}
#video_training .online_grid p.notes{
	font-size:12px;
	line-height:21px;
	margin-top:5px;
}
#video_training .online_grid h3{
	display: flex;
	align-items: center;
	color:#01B8AF;
	font-weight:600;
	padding:20px 0 10px;
}
#video_training .online_grid h3:after {
	content: "";
	flex-grow: 1;
	height: 1px;
	display: block;
	margin-left: 10px;
	background:#01B8AF;
}
#video_training .inner{
	padding-top:80px;
	padding-bottom:65px;
}
#video_training .inner section .video_training_img{
	text-align:right;
}
#video_training .inner section .video_training_img img{
	max-width:409px;
}
#video_training .online_grid div ul{
	padding-left:18px;
	margin-bottom:15px;
}
#video_training .online_grid div ul li{
	font-size:14px;
	line-height:22px;
	font-weight:700;
	position:relative;
	padding-bottom:4px;
}
#video_training .online_grid div ul li:first-of-type{
	padding-bottom:7px;
}
#video_training .online_grid div ul li:before{
	background:#01B8AF;
	content: '';
	display: block;
	width:8px;
	height:8px;
	border-radius:4px;
	position:absolute;
	left:-17px;
	top:7px;
}
#video_training .online_grid div ul ul{
	padding-left:14px;
	margin-bottom:0;
}
#video_training .online_grid div ul ul li:first-of-type{
	margin-left:-14px;
	padding-bottom:0;
}
#video_training .online_grid div ul ul li:first-of-type:before{
	display: none;
}
#video_training .online_grid div ul ul li:not(:first-of-type){
	font-weight:400;
	padding-bottom:0;
}
#video_training .online_grid div ul ul li:not(:first-of-type):before{
	background:#000;
	content: '';
	display: block;
	width:3px;
	height:3px;
	border-radius:4px;
	position:absolute;
	left:-8px;
	top:10px;
}
#video_training .link_button{
	max-width:315px;
	margin-left:0;
}
@media screen and (max-width:839px){
	#training .spark_page .title{
		max-width:331px;
	}
	#training p.training_contents_header_link{
		padding-top:18px;
		padding-bottom:53px;
	}
}
@media screen and (max-width:767px){
	#online_training.contents .tablet{
		display:block;
	}
	#online_training.contents br{
		display:none;
	}
	#video_training .inner section .video_training_img {
		text-align:center;
	}
	#online_training h2{
		font-size:22px;
		line-height:34px;
		padding-bottom:30px;
	}
	#online_training .inner{
		padding-top:54px;
		padding-bottom:40px;
	}
	#online_training .online_grid div:nth-of-type(1){
		order:2;
	}
	#online_training .online_grid div:nth-of-type(2){
		order:1;
	}
	#online_training .online_grid div:nth-of-type(3){
		order:3;
		grid-column: 1;
	}
	#online_training .inner section .online_training_img{
		text-align:center;
		margin-bottom:32px;
	}
	#online_training .online_grid h3{
		padding-top:23px;
	}
	#online_training .online_grid .training_contents .training_contents_notes li:last-child{
		padding-bottom:1px;
	}
	#online_training .online_grid{
		row-gap:17px;
	}
	#online_training .online_grid{
		grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	}
	#online_training .online_grid .training_apply ul li:last-child{
		padding-bottom:7px;
	}
	#online_training .link_button{
		max-width:100%;
	}
	#video_training{
		margin-top:0;
		margin-bottom:0;
	}
	#video_training h2{
		font-size:22px;
		line-height:34px;
		padding-bottom:40px;
	}
	#video_training .inner{
		padding-top:55px;
		padding-bottom:80px;
	}
	#video_training .online_grid{
		display:grid;
		row-gap:17px;
		position:relative;
	}
	#video_training .online_grid{
		grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	}
	#video_training .online_grid div:nth-of-type(1){
		order:2;
	}
	#video_training .online_grid div:nth-of-type(2){
		order:1;
	}
	#video_training .inner section .video_training_img{
		text-align:center;
	}
	#video_training .link_button{
		max-width:100%;
	}
}
@media screen and (max-width:699px){
	#contents_header.training_header p span {
		display:inline;
	}
	#intro img {
		max-width:354px;
	}
}
@media screen and (max-width:374px){
	.training_contents_header_notes{
		font-size:16px;
	}
	#video_training .online_grid{
		grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	}
	#online_training .online_grid{
		grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	}
}
.share {
	padding:81px 0 101px;
	background-color:#F2F2F2;
}
.share h1{
	font-size:32px;
	line-height:46px;
	font-weight:700;
	letter-spacing:0.05em;
}
.share h1 span{
	background:linear-gradient(transparent 75%,#ffe600 0%);
}
.share p{
	margin-top:37px;
	font-size:16px;
	line-height:28px;
}
.share>div{
	max-width:1000px;
	margin:0 auto;
	padding:0 60px;
	text-align:center;
}
.share .link_button{
	margin-top:45px;
	max-width:314px;
}
@media screen and (max-width:880px){
	.share{
		padding:56px 0 75px;
	}
	.share div{
		max-width:840px;
		padding:0 40px;
	}
	.share h1{
		font-size:28px;
		line-height:1.6429;
	}
	.share p{
		margin-top:41px;
	}
}
@media screen and (max-width:599px){
	.share{
		padding:49px 0 59px;
	}
	.share div{
		padding:0 30px;
	}
	.share h1{
		font-size:22px;
		line-height:1.5455;
	}
	.share h1 .mobile{
		display:block;
	}
	.share p{
		margin-top:28px;
	}
}
@media screen and (max-width:599px){
	.share div{
		padding:0 30px;
	}
}
@media screen and (max-width:413px){
	.share div{
		padding:0 20px;
	}
}
@media screen and (max-width:374px){
	.share div{
		padding:0 15px;
	}
}