/*------------------------------------------------------------------------------
  PC or ALL 
------------------------------------------------------------------------------*/

/* ======================================
2024/7/24 added by tsuji
======================================== */

.box001 {
    padding: 30px 30px;
    margin: 15px 0;
    background: #FAFAFA;
}
.mainvisual2{
	background: #d6faff;
}
.title-type03,
.title-type04{
	.box-h2{
		.ja{
			color: #1187d5;
			opacity: 1;
		}
	}
}
.main-menu{
	.lead-type01{
		.text{
			.copy{
				font-size: 1.8rem;
				font-weight: 500;
			}
		}
	}
	.row{
		margin-bottom: 30px;
		.col{
			.image{
				padding: 50px;
				background: #e6e6e6;
			}
			h3{
				padding: 0;
				font-size: 2.4rem;
				&::after{
					display: none;
				}
			}
		}
	}
}

.main-online{
	background: url(/mwp/wp-content/uploads/2024/07/main-online-bg.webp) no-repeat center center / cover;
	padding: 75px 0 65px !important;
	.banner-type01{
		margin: 0 auto;
		max-width: 1200px;
		ul{
			li{
				.text{
					a{
						padding: 50px 50px 100px;
						&::after{
							display: none;
						}
						.cats{
							margin-bottom: 5px;
							display: flex;
							justify-content: flex-start;
							align-items: center;
							gap: 14px;
							.cat{
								width: 120px;
								height: 120px;
								line-height: 120px;
								text-align: center;
								-webkit-border-radius: 50%;
								-moz-border-radius: 50%;
								border-radius: 50%;
								background: #eb396c;
								font-size: 2.4rem;
							}
						}
						.title{
							color: #0e3975;
							font-size: 6.8rem;
							font-weight: 900;
							text-shadow: 
								2px 2px 0 white,
								-2px 2px 0 white,
								2px -2px 0 white,
								-2px -2px 0 white,
								2px 0 0 white,
								-2px 0 0 white,
								0 2px 0 white,
								0 -2px 0 white;
						}
					}
				}
			}
		}
	}
}

.main-reason{
	position: relative;
	.list-number-type02{
		position: relative;
		margin: 0 auto;
		max-width: 1200px;
		z-index: 10;
		ol{
			li{
				.text{
					text-align: center;
					.box-h3.ja{
						color: #1187d5;
					}
					.copy,p{
						text-align: left;
					}
				}
				&::before{
					top: -12px;
					border: none;
					width: 80px;
					height: 80px;
					line-height: 80px;
					text-align: center;
					-webkit-border-radius: 50%;
					-moz-border-radius: 50%;
					border-radius: 50%;
					background: #ffad42;
					color: #fff;
					font-size: 5.2rem;
				}
			}
		}
	}
	&::before{
		display: block;
		content: '';
		position: absolute;
		bottom: 0;
		right: 0;
		left: 0;
		top: 320px;
		background: #f2f2f2;
	}
}

.main-news{
	.blog-type03{
		ul{
			li{
				padding: 1.0em 0;
				border-bottom: #ccc 1px solid;
				.date{
					color: var(--text-color);
					font-weight: 700;
				}
			}
		}
	}
}

.main-contact{
	h2{
		margin-bottom: 30px;
		text-align: center;
		position: relative;
		z-index: 10;
		color: #fff;
		font-weight: 700;
		.en{
			font-size: 6rem;
		}
		.ja{
			font-size: 1.8rem;
		}
	}
}

.footer{
	background: #d6faff;
	.logo{
		width: 340px;
	}
}
.fixed-footer{
	background: #ffdb33;
}

/*------------------------------------------------------------------------------
  TABLET and SHONE
------------------------------------------------------------------------------*/
@media screen and (max-width: 1024px) {
	.main-menu{
		.row{
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 3vw 2vw;
			.col{
			}
		}
	}
	
	.main-online{
		padding: 5vw 0 10vw !important;
		.banner-type01{
			ul{
				li{
					.text{
						a{
							padding: 3vw 3vw 6vw;
							.cats{
								gap: 2vw;
								.cat{
									width: 20vw;
									height: 20vw;
									line-height: 20vw;
									font-size: 4vw;
								}
							}
							.title{
								font-size: 8vw;
							}
						}
					}
				}
			}
		}
	}
}

/*------------------------------------------------------------------------------
  TABLET ONLY
------------------------------------------------------------------------------*/
@media screen and (min-width: 600px) and (max-width: 1024px) {
}

/*------------------------------------------------------------------------------
  SPHONE ONLY
------------------------------------------------------------------------------*/
@media screen and (max-width: 599px) {
}