@charset "utf-8";

/* common */

.main-in,
.main-in *{
	box-sizing: border-box;
}

.main-in .page .flex-wrap{
  	display:flex;
  	flex-wrap: wrap;
}

.main-in .page .text-center{
	text-align:center;
}

.main-in .page .text-right{
	text-align:right;
}

.main-in .page .img-fluid{
	display:block;
	max-width:100%;
	width:100%;
	height:auto;
}

.pc-none{
	display:none;
}

/* recordbookcross */

#recordbookcross .main-in .page .fv{
	margin-bottom:60px;
}

#recordbookcross .main-in .page .page_content{
	margin-bottom:60px;
}

#recordbookcross .main-in .page .page_content:last-child{
	margin-bottom:0;
}

#recordbookcross .main-in .page .page_content p{
	font-size:16px;
	line-height:1.8;
}

.recordbookcross01 .txt{
	margin-bottom:28px;
}

.recordbookcross01 .content_wrap{
	justify-content: space-between;
}

.recordbookcross01 .content_wrap .box{
	width:32%;
	background:#0d2a7a;
	border-radius:10px;
	padding:28px 0 24px;
	color:#fff;
}

.recordbookcross01 .content_wrap .box .icon{
	display:inline-block;
	margin:0 auto 16px;
}

.recordbookcross01 .content_wrap .box .icon .img-fluid{
	height:90px;
	width:auto;
}

.recordbookcross01 .content_wrap .box h4{
	font-size:20px;
	line-height:1.6;
	font-weight:700;
	margin-bottom:0.5em;
}

.recordbookcross02 .txt{
	margin-bottom:28px;
}

.recordbookcross02 .content_wrap{
	justify-content: space-between;
	margin-bottom:12px;
}

.recordbookcross02 .content_wrap .box{
	width:32%;
	border-radius:10px;
	padding:20px 0 16px;
	border:2px solid #0d2a7a;
	color:#0d2a7a;
	margin-bottom:16px;
	text-decoration:none;
}

.recordbookcross02 .content_wrap .box:hover{
	opacity:1;
}

.recordbookcross02 .content_wrap .box .icon{
	display:inline-block;
	margin:0 auto 8px;
}

.recordbookcross02 .content_wrap .box .icon .img-fluid{
	height:80px;
	width:auto;
}

.recordbookcross02 .content_wrap .box p span{
	display:inline-block;
	font-size:20px;
	line-height:1.6;
	font-weight:700;
	position:relative;
	padding-right:1.3em;
}

.recordbookcross02 .content_wrap .box p span::after{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	right:0;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	content: "\f138";
	transition:.5s;
}

.recordbookcross02 .content_wrap .box:hover p span::after{
	right:-0.25em;
}

.recordbookcross02 .content_wrap .box h5{
	font-size:12px;
	font-weight:700;
}

.recordbookcross02 .comment{
	border-radius:10px;
	background:#eee;
	padding:28px;
}

.recordbookcross02 .comment .btn_wrap{
	margin-top:16px;
}

.recordbookcross02 .comment a{
	display:inline-block;
	text-decoration:none;
	background:#dc2f21;
	border-radius:8px;
	padding:16px 40px;
}

.recordbookcross02 .comment a span{
	color:#fff;
	font-weight:700;
	position:relative;
	padding-right:1.3em;
}

.recordbookcross02 .comment a span::after{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	right:0;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	content: "\f15c";
}

.recordbookcross03 .flow{
	position:relative;
}

.recordbookcross03 .flow::after{
	position:absolute;
	top:0;
	left:49px;
	content:"";
	width:2px;
	height:100%;
	background:#0d2a7a;
}

.recordbookcross03 .flow .flow_wrap{
	margin-bottom:28px;
	justify-content: space-between;
	align-items: center;
}

.recordbookcross03 .flow .flow_wrap:last-child{
	margin-bottom:0;
}

.recordbookcross03 .flow .flow_wrap .step{
	width:100px;
	height:100px;
	justify-content: center;
	align-items: center;
	background:#0d2a7a;
	color:#fff;
	border-radius:10px;
	position:relative;
	z-index:2;
}

#recordbookcross .recordbookcross03 .flow .flow_wrap .step p{
	font-weight:700;
	line-height:1.4;
}

.recordbookcross03 .flow .flow_wrap .step p span{
	display:block;
	font-size:20px;
}

.recordbookcross03 .flow .flow_wrap .txt{
	width:calc(100% - 100px - 24px);
}

.recordbookcross03 .flow .flow_wrap .txt h3{
	color:#0d2a7a;
	font-weight:700;
	font-size:18px;
	line-height:1.8;
}

#recordbookcross .recordbookcross03 .flow .flow_wrap .txt .comment{
	font-size:14px;
}

.recordbookcross04 .txt{
	margin-bottom:28px;
}

.recordbookcross04 .detail h3{
	color:#0d2a7a;
	font-weight:700;
	font-size:20px;
	line-height:1.8;
}

/* product */

#product .main-in .page{
	padding:60px 30px 40px;
}

#product .main-in .page .page_content{
	margin-bottom:60px;
}

#product .main-in .page .page_content:last-child{
	margin-bottom:0;
}

#product .main-in .page .page_content p{
	font-size:16px;
	line-height:1.8;
}

.product01 h3{
	font-size:28px;
	font-weight:700;
	margin-bottom:0.5em;
}

.product01 p{
	margin-bottom:2em;
}

.product01 ul{
	gap:20px 2%;
}

.product01 ul li{
	width:32%;
}

.product01 ul li a{
	display:block;
	text-decoration:none;
	background:#545454;
	color:#fff;
	font-weight:700;
	padding:1em 0;
	border-radius:100vmax;
}

.product_list > p{
	margin-bottom:2em;
}

.product_list .content_wrap{
	gap:20px 2%;
}

.product_list .content_wrap .box{
	width:32%;
	border: 2px solid #0d2a7a;
	border-radius: 10px;
	padding: 24px 0 16px;
	color: #0d2a7a;
}

.product_list .content_wrap .box .img{
	display:inline-block;
	height:80px;
	width:auto;
	position:relative;
}

.product_list .content_wrap .box .img img{
	height:100%;
	width:auto;
}

.product_list .content_wrap .box .img .weight{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	right:-64px;
	width:64px;
	height:64px;
	background:#EB0000;
	border-radius:50%;
	justify-content: center;
	align-items: center;
}

#product .main-in .page .page_content.product_list .content_wrap .box .img .weight p{
	color:#fff;
	font-size:12px;
	font-weight:700;
	line-height:1.4;
}

#product .main-in .page .page_content.product_list .content_wrap .box .img .weight p span{
	display:block;
	font-size:14px;
}

.product_list .content_wrap .box > p{
	justify-content: center;
	align-items: center;
	min-height:3.2em;
	
}

.product_list .content_wrap .box > p span{
	font-weight:700;
	line-height:1.6;
}

/* catalog */

.catalog_list{
	margin-bottom:60px;
}

.catalog_list .toggle_wrap{
	margin-bottom:24px;
}

.catalog_list .toggle_wrap:last-child{
	margin-bottom:0;
}

.catalog_list .toggle_wrap .catalog_toggle_btn{
	cursor:pointer;
	background:#000;
	color:#fff;
	border-radius:8px;
	align-items: center;
	padding:16px 20px;
	position:relative;
}

.catalog_list .toggle_wrap:first-child .catalog_toggle_btn{
	background:#00913a;
}

.catalog_list .toggle_wrap:nth-child(2) .catalog_toggle_btn{
	background:#00a5e3;
}

.catalog_list .toggle_wrap:nth-child(3) .catalog_toggle_btn{
	background:#00aebb;
}

.catalog_list .toggle_wrap:nth-child(4) .catalog_toggle_btn{
	background:#1d50a2;
}

.catalog_list .toggle_wrap:nth-child(5) .catalog_toggle_btn{
	background:#9c4998;
}

.catalog_list .toggle_wrap:nth-child(6) .catalog_toggle_btn{
	background:#ea5539;
}

.catalog_list .toggle_wrap:nth-child(7) .catalog_toggle_btn{
	background:#ee86a8;
}

.catalog_list .toggle_wrap:nth-child(8) .catalog_toggle_btn{
	background:#f0831e;
}

.catalog_list .toggle_wrap:nth-child(9) .catalog_toggle_btn{
	background:#a96124;
}

.catalog_list .toggle_wrap:nth-child(10) .catalog_toggle_btn{
	background:#8dc556;
}

.catalog_list .toggle_wrap:nth-child(11) .catalog_toggle_btn{
	background:#ef8465;
}

.catalog_list .toggle_wrap .catalog_toggle_btn::after{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	right:20px;
	content:"";
	width:16px;
	height:16px;
	background:url('./../img/catalog/00.webp') 0 0 no-repeat;
	background-size:cover;
	transition:.5s;
}

.catalog_list .toggle_wrap .catalog_toggle_btn.active::after{
	transform:translateY(-50%) rotate(90deg);
}

.catalog_list .toggle_wrap .catalog_toggle_btn .icon{
	width:32px;
	margin-right:12px;
}

.catalog_list .toggle_wrap .catalog_toggle_btn h2{
	font-weight:700;
	font-size:18px;
}

.catalog_list .toggle_wrap .catalog_toggle_content {
	display: none;
	position: relative;
	width: 100%;
	max-width: 900px;
	height: 680px;
	margin: 0 auto;
	padding: 24px 0 0;
	overflow: hidden;
}

.catalog_list .toggle_wrap .catalog_toggle_content.is-open {
	display: block;
}

.catalog_list .toggle_wrap .catalog_toggle_content canvas {
	display: block;
	margin: 0 auto;
	width: auto;
	height: 100%;
}

.catalog_list .toggle_wrap .catalog_toggle_content .pdf-controls{
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	display: flex;
	justify-content: center;
	align-items: center;
	gap:12px;
}

.catalog_list .toggle_wrap .catalog_toggle_content .pdf-controls button{
	border:0;
	outline:none;
	line-height:1;
	padding:0.5em 1em;
	border-radius:2px;
}

#catalog .product02 .box .content_wrap .block{
	margin:0 auto;
}

/* recordbookcross common */

.product02 .box{
	border-radius: 10px;
	background: #eee;
	padding: 28px 46px;
}

.product02 .box .content_wrap{
	justify-content: space-between;
}

.product02 .box .content_wrap .block{
	width:48%;
}

#recordbookcross .main-in .page .page_content.product02 .box .content_wrap .block > p,
#product .main-in .page .page_content.product02 .box .content_wrap .block > p,
#catalog .main-in .page .page_content.product02 .box .content_wrap .block > p{
	margin-bottom:1em;
	font-size:14px;
}

.product02 .box .content_wrap .block a{
	text-decoration:none;
	background:#EB0000;
	border-radius: 10px;
	color:#fff;
	justify-content: center;
	align-items: center;
	padding:20px 0;
}

.product02 .box .content_wrap .block a .icon{
	width:18%;
	margin:0 2%;
}

.product02 .box .content_wrap .block a p{
	width:40%;
	margin:0 2%;
	font-weight:700;
}

#recordbookcross .main-in .page .page_content.product02 .box .content_wrap .block a p,
#product .main-in .page .page_content.product02 .box .content_wrap .block a p,
#catalog .main-in .page .page_content.product02 .box .content_wrap .block a p{
	font-size:20px;
	line-height:1.6;
}

.product02 .box .content_wrap .block a p span{
	display:block;
	font-size:16px;
}


@media screen and (max-width: 1300px) {}

@media screen and (max-width: 960px) {

	/* common */

	.pc-none{
		display:block;
	}
	
	.sp-none{
		display:none;
	}
	
	/* recordbookcross */
	
	#recordbookcross .main-in .page .fv{
		margin-bottom:calc(100vw / 750 * 120);
	}
	
	#recordbookcross .main-in .page .page_content{
		margin-bottom:calc(100vw / 750 * 120);
	}
	
	#recordbookcross .main-in .page .page_content p{
		font-size:calc(100vw / 750 * 30);
	}
	
	.recordbookcross01 .txt{
		margin-bottom:calc(100vw / 750 * 56);
	}
	
	.recordbookcross01 .content_wrap .box{
		width:100%;
		margin-bottom:calc(100vw / 750 * 56);
		padding:calc(100vw / 750 * 56) calc(100vw / 750 * 60) calc(100vw / 750 * 48);
	}
	
	.recordbookcross01 .content_wrap .box:last-child{
		margin-bottom:0;
	}
	
	.recordbookcross01 .content_wrap .box .icon{
		margin:0 auto calc(100vw / 750 * 24);
	}
	
	.recordbookcross01 .content_wrap .box .icon .img-fluid{
		height:calc(100vw / 750 * 120);
	}
	
	.recordbookcross01 .content_wrap .box h4{
		font-size:calc(100vw / 750 * 36);
	}
	
	.recordbookcross02 .txt{
		margin-bottom:calc(100vw / 750 * 56);
	}
	
	.recordbookcross02 .content_wrap{
		margin-bottom:calc(100vw / 750 * 24);
	}
	
	.recordbookcross02 .content_wrap .box{
		width:48%;
		padding:calc(100vw / 750 * 40) calc(100vw / 750 * 32) calc(100vw / 750 * 32);
		margin-bottom:calc(100vw / 750 * 32);
	}
	
	.recordbookcross02 .content_wrap .box .icon{
		margin:0 auto calc(100vw / 750 * 16);
	}
	
	.recordbookcross02 .content_wrap .box .icon .img-fluid{
		height:calc(100vw / 750 * 160);
	}
	
	.recordbookcross02 .content_wrap .box p span{
		font-size:calc(100vw / 750 * 34);
		line-height:1.4;
	}
	
	.recordbookcross02 .content_wrap .box h5{
		font-size:calc(100vw / 750 * 24);
		line-height:1.4;
	}
	
	.recordbookcross02 .comment{
		padding:calc(100vw / 750 * 48);
	}
	
	.recordbookcross02 .comment .btn_wrap{
		margin-top:calc(100vw / 750 * 32);
	}
	
	.recordbookcross02 .comment a{
		padding:calc(100vw / 750 * 32) calc(100vw / 750 * 80);
	}
	
	.recordbookcross03 .flow::after{
		content:none;
	}
	
	.recordbookcross03 .flow .flow_wrap{
		align-items: flex-start;
		margin-bottom:calc(100vw / 750 * 56);
	}
	
	.recordbookcross03 .flow .flow_wrap .step{
		width:calc(100vw / 750 * 120);
		height:calc(100vw / 750 * 120);
		z-index:1;
	}
	
	.recordbookcross03 .flow .flow_wrap .step p span{
		font-size:calc(100vw / 750 * 36);
	}
	
	.recordbookcross03 .flow .flow_wrap .txt{
		width:calc(100% - (100vw / 750 * 120) - (100vw / 750 * 32));
	}
	
	.recordbookcross03 .flow .flow_wrap .txt h3{
		font-size:calc(100vw / 750 * 36);
	}
	
	#recordbookcross .recordbookcross03 .flow .flow_wrap .txt .comment{
		font-size:calc(100vw / 750 * 26);
	}
	
	.recordbookcross04 .txt{
		margin-bottom:calc(100vw / 750 * 56);
	}
	
	.recordbookcross04 .detail h3{
		font-size:calc(100vw / 750 * 36);
	}
	
	/* product */
	
	#product .main-in .page{
		padding:20px 10px;
	}
	
	#product .main-in .page .page_content{
		margin-bottom:calc(100vw / 750 * 120);
	}
	
	#product .main-in .page .page_content p{
		font-size:calc(100vw / 750 * 32);
	}
	
	.product01 h3{
		font-size:calc(100vw / 750 * 40);
		line-height:1.6;
	}
	
	.product01 p{
		margin-bottom:1em;
	}
	
	.product01 ul{
		gap:calc(100vw / 750 * 12) 2%;
	}
	
	.product01 ul li{
		width:48%;
	}
	
	.product01 ul li a{
		padding:0.75em 0;
	}
	
	.product_list .content_wrap{
		gap:calc(100vw / 750 * 40) 0;
	}
	
	.product_list .content_wrap .box{
		width:100%;
		padding:calc(100vw / 750 * 40) 0 calc(100vw / 750 * 56);
	}
	
	.product_list .content_wrap .box .img{
		height:calc(100vw / 750 * 200);
	}
	
	.product_list .content_wrap .box .img .weight{
		right:-calc(100vw / 750 * 120);
		width:calc(100vw / 750 * 120);
		height:calc(100vw / 750 * 120);
	}
	
	#product .main-in .page .page_content.product_list .content_wrap .box .img .weight p{
		font-size:calc(100vw / 750 * 24);
	}
	
	#product .main-in .page .page_content.product_list .content_wrap .box .img .weight p span{
		font-size:calc(100vw / 750 * 28);
	}
	
	.product_list .content_wrap .box > p{
		min-height:auto;
	}
	
	/* catalog */
	
	.catalog_list{
		margin-bottom:calc(100vw / 750 * 80);
	}
	
	.catalog_list .toggle_wrap{
		margin-bottom:calc(100vw / 750 * 32);
	}
	
	.catalog_list .toggle_wrap .catalog_toggle_btn{
		padding:calc(100vw / 750 * 20) calc(100vw / 750 * 32);
	}
	
	.catalog_list .toggle_wrap .catalog_toggle_btn::after{
		right:calc(100vw / 750 * 32);
		width:calc(100vw / 750 * 32);
		height:calc(100vw / 750 * 32);
	}
	
	.catalog_list .toggle_wrap .catalog_toggle_btn .icon{
		width:calc(100vw / 750 * 60);
		margin-right:calc(100vw / 750 * 20);
	}
	
	.catalog_list .toggle_wrap .catalog_toggle_btn h2{
		font-size:calc(100vw / 750 * 32);
	}
	
	.catalog_list .toggle_wrap .catalog_toggle_content{
		max-width:calc(100vw / 750 * 670);
		height:calc(100vw / 750 * 560);
		padding:calc(100vw / 750 * 48) 0 0;
	}
	
	.catalog_list .toggle_wrap .catalog_toggle_content .pdf-controls{
		gap:calc(100vw / 750 * 20);
	}
	
	/* recordbookcross common */
	
	.product02 .box{
		border-radius:calc(100vw / 750 * 20);
		padding:calc(100vw / 750 * 56);
	}
	
	.product02 .box .content_wrap .block{
		width:100%;
		margin-bottom:calc(100vw / 750 * 56);
	}
	
	.product02 .box .content_wrap .block:last-child{
		margin-bottom:0;
	}
	
	#recordbookcross .main-in .page .page_content.product02 .box .content_wrap .block > p,
	#product .main-in .page .page_content.product02 .box .content_wrap .block > p,
	#catalog .main-in .page .page_content.product02 .box .content_wrap .block > p{
		font-size:calc(100vw / 750 * 28);
		text-align:left;
	}
	
	.product02 .box .content_wrap .block a{
		width:100%;
		border-radius:calc(100vw / 750 * 20);
		padding:calc(100vw / 750 * 40) 0;
	}
	
	#recordbookcross .main-in .page .page_content.product02 .box .content_wrap .block a p,
	#product .main-in .page .page_content.product02 .box .content_wrap .block a p,
	#catalog .main-in .page .page_content.product02 .box .content_wrap .block a p{
		width:58%;
		font-size:calc(100vw / 750 * 40);
	}
	
	.product02 .box .content_wrap .block a p span{
		font-size:calc(100vw / 750 * 32);
	}

}