@charset "utf-8";
/* CSS Document */

/*top-----------------------------------------------------------------------------------*/
	html { scroll-behavior: smooth;}
	
	header{
		height:80px;
	}
	nav{
		width:100%;
		background: #5156d2;
	}
	nav ul{
		display:flex;
		justify-content: space-around;
		width: 1000px;
		margin-left: auto;
		margin-right: auto;
	}
	nav ul li{
		display: flex;
		align-self: auto;
		flex: 1;
		/*border-right: 1px solid #fff;*/
		min-width: 0;
		
	}
	
	nav ul li a{
		display: block;
		align-items: center;
		justify-content: center;
		flex: 1;
		padding: 1em 1em 0.45em 1em;
		color: #fff;
		text-decoration: none;
		text-align: center;
		background: #5156d2;
		word-break: break-all;
		box-sizing: border-box;
		color:#fff;
		border-right:#797de5 solid 1px;
		border-bottom:#5156d2 solid 1px;
	}
	nav ul li a:hover{
		transition: all .7s;
		background:#fff;
		color:#5156d2;
	}
	nav ul li:first-child a{
		border-left:#797de5 solid 1px;
	}
	nav ul li a .subTitle{
		display: block;
		font-size:10px;
	}
	
	.fixed {
	  position: fixed;
	  top: 0;
	  padding: 0;
	  width: 100%;
	  z-index: 1000;
	  box-shadow: 0 5px 10px rgb(0 0 0 / 25%);
	}


	.caption{
		text-align:center;
		font-size:14px;
		margin-bottom:30px !important;
		color:#999;
	}
	.caption2{
		text-align:center;
		font-size:14px;
		margin-top:-20px !important;
		margin-bottom:30px !important;
		color:#999;
	}
	.read{
		text-align:center;
		font-size:26px;
		line-height:2em;
		
	}
	.bk_yellow,
	.bk_blue{
		background-color:#fffded;
		padding:50px 0px 1px 0px;
		margin-bottom:50px;
		
	}
	.bk_blue{
		background-color:#e2ebff;
	}
	
	
	.bk_yellow p,
	.bk_blue p{
		text-align:center;
		
	}
	
	.feature{
		display: flex;
		justify-content: space-between;
	}
	.feature .feature_unit{
		border-radius: 10px;
		background: rgb(2,0,36);
		background: linear-gradient(120deg, rgba(2,0,36,1) 0%, rgba(0,107,207,1) 0%, rgba(0,148,180,1) 100%);
		padding:30px 15px 10px 15px;
	}
	.feature .feature_unit p{
		text-align:center;
		font-size:20px;
		font-weight:normal;
		color:#FFF;
		line-height:1.5em;
		margin-top:15px;
	}
	
	.movie {
		text-align:center;
		width: 100%;
		aspect-ratio: 16 / 9;
	}
	.movie iframe {
		width: 100%;
		height: 100%;
	}
	
	.spec{
		display: flex;
		justify-content: space-between;
		border-radius: 10px;
		background: rgb(2,0,36);
		background: linear-gradient(120deg, rgba(2,0,36,1) 0%, rgba(0,107,207,1) 0%, rgba(0,148,180,1) 100%);
		padding:50px 50px 30px 50px;
	}
	.kokai{
		width:100%;
		font-size:40px;
		color:#FFF;
		text-align:center;
		--wght:600;
		font-variation-settings: "wght" var(--wght);
		margin-bottom: 10px !important;
		line-height:1.5em;
	}
	.spec .spec_unit{
		width:45%;
		color:#FFF;
	}
	.spec_unit h3{
		margin-bottom:20px;
		
	}
	.spec_unit ul{
		
	}
	
	#mainContent ol.tokucho{
		counter-reset: item;
		font-size:26px;
		width:850px;
		margin-left:auto;
		margin-right:auto;
	}
	#mainContent ol.tokucho li{
		margin-bottom:1.5em;
		list-style-type: none;
		margin-left: 1.3em;
		text-indent: -1.3em;
	}
	#mainContent ol.tokucho li:before {
		counter-increment: item;
		content: counter(item)'. ';
		/* 以下は自由に装飾... */
		color: #5156d2;
		--wght:700;
		font-variation-settings: "wght" var(--wght);
	}
	
	.faq{
		word-break: break-all ;
	}
	.faq dt{
		color:#0094b4;
		font-weight:normal;
		margin-left:50px;
		--wght:600;
		font-variation-settings: "wght" var(--wght);
	}
	.faq dt::before{
		content: "Q：";
		margin-left:-50px;
	}
	.faq dd{
		margin-left:1.7em;
		margin-bottom:2.5em;
	}
	.faq dd::before{
		content: "A：";
		font-weight:bold;
		margin-left:-1.7em;
	}
	
	/*ボタン矢印右_大*/
	#content a.btn_arrowR_L{
		width:auto;
		display:inline-block;
		text-align:left;
		padding:1em 2.5em 0.9em 1em;
		line-height:1.2em;
		font-size:20px;
		color:#fff;
		text-decoration:none;
		position: relative;
		margin-bottom:0.5em;
		
		border-radius: 10px;
		background: rgb(2,0,36);
		background: linear-gradient(120deg, rgba(2,0,36,1) 0%, rgba(0,107,207,1) 0%, rgba(0,148,180,1) 100%);

	}
	#content a.btn_arrowR_L::after {
		position: absolute;
		top: 50%;
		right: 10px;
		content: '';
		margin-top: -8px;
		border: 12px solid transparent;
		border-top-width: 8px;
		border-bottom-width: 8px;
		border-left-color: #fff;
		/*transition*/
		transition: all 0.2s ease;
		-webkit-transition: all 0.2s ease;
		-moz-transition: all 0.2s ease;
	}
	#content a.btn_arrowR_L:hover::after {
		right: 2px;
		/*transition*/
		transition: all 0.2s ease;
		-webkit-transition: all 0.2s ease;
		-moz-transition: all 0.2s ease;
	}
	#content a.btn_arrowR_S:hover,
	#content a.btn_arrowR_M:hover,
	#content a.btn_arrowR_L:hover,
	#content a.btn_arrowL_L:hover
	{
		opacity: 0.5;
		text-decoration:none;
		color:#fff;
		/*transition*/
		transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
	}
	#content table.tl_spec{
		width:70%;
		margin-left:auto;
		margin-right:auto;
		line-height:1.2em;
		border:none;
		border-collapse: collapse;
		background-color:#f4f4f4;
		margin-bottom:4em;
	}
	#content table.tl_spec th{
		background-color:#5156d2;
		color:#fff;
		text-align:left;
		width:30%;
		border:none;
		border-bottom:#797de5 solid 1px;
		padding:20px;
	}
	#content table.tl_spec td{
		border-top: 1px solid #fff;
    	border-bottom: 1px solid #fff;
		padding:20px;
	}
	table.tl_spec tr:nth-child(odd) td {
		background-color: #eee;
	}
	.btn_buy_wrapper{
		text-align:center;
		
	}
	
	#content table.tl_support{
		width:70%;
		margin-left:auto;
		margin-right:auto;
		line-height:1.2em;
		border:none;
		border-collapse: collapse;
		background-color:#f4f4f4;
		
	}
	#content table.tl_support th{
		background-color:#5156d2;
		color:#fff;
		
	}
	#content table.tl_support td{
		border-top: none;
    	border-bottom: none;
		
	}
	#content table.tl_support th.cell_app{
		width:30%;
		border-right:solid 1px #797de5;
	}
	#content table.tl_support td.cell_app{
		border-right:solid 1px #fff;
		
	}
	#content table.tl_support th.cell_support{
		width:20%;
		border-right:solid 3px #797de5;
	}
	
	#content table.tl_support td.cell_support{
		text-align:center;
		border-right:solid 3px #fff;
	}
	#content table.tl_support th:last-child{
		border-right:none;
	}
	#content table.tl_support td:last-child{
		border-right:none;
	}
	#content table.tl_support tr:nth-child(odd) td {
		background-color: #eee;
	}
	
	
	#content table.tl_tag{
		width:70%;
		margin-left:auto;
		margin-right:auto;
		line-height:1.2em;
		border:none;
		border-collapse: collapse;
		background-color:#f4f4f4;
		font-size:16px;
	}
	#content table.tl_tag th{
		background-color:#30a9c3;
		color:#fff;
		width:15%;
		border-top:none;
		border-bottom:solid 1px #5ec7dd;
	}
	#content table.tl_tag td{
		border-top: none;
    	border-bottom: none;
		border-right:solid 10px #fff;
	}
	#content table.tl_tag tr:nth-child(odd) td {
		background-color: #eee;
	}
	dl.price{
		display:flex;
		flex-wrap: wrap;
	}
	dl.price dt{
		width:40%;
	}
	dl.price dd{
		width:60%;
	}
	dl.price dt:last-child,
	dl.price dd:last-child{
		margin-bottom:0;
	}
	
	@media only screen and (max-width:510px){
	nav ul{
		width:100%;
	}
	nav ul li a{
		padding:0.8em 0em 0.4em 0em;
		font-size:16px;
	}
	nav ul li:first-child a{
		border-left:none;
	}
	nav ul li:last-child a{
		border-right:none;
	}
	#mainContent ol.tokucho{
		width:auto;
		font-size:24px;
	}
	.read{
		font-size:24px;
	}
	.feature{
		display:block;
		
	}
	.feature .feature_unit{
		width:70%;
		margin:auto;
		margin-bottom:20px;
	}
	.kokai{
		font-size:30px;
	}
	dl.list_spec{
		width:100%;
	}
	#content table.tl_spec,
	#content table.tl_support,
	#content table.tl_tag{
		width:100%;
	}
	.price{
		display:block;
	}
	dl.price dt,
	dl.price dd{
		width:auto;
	}
	}