@charset "utf-8";
/* CSS Document */
/* Smart Phone (-767)*/
@media (max-width: 767px){
	section{
	scroll-margin-top:20px;
	}
	.header__box{
		display:block;
		height:622px!important;
		position:relative;
		overflow-x:hidden;
	}
	.header__box p{
		z-index:25;
		position:absolute;
		top:27%;
		left:4%;
		color: #1C3963;
		font-family: "Noto Sans";
		font-size: 26.956px;
		font-style: normal;
		font-weight: 700;
		line-height: 130%; /* 35.043px */
		letter-spacing: 1.887px;
	}
	.top_parts1{
		position:absolute;
		top:16%;
		left:33%;
		width:500px;
		height:auto;
	}
	.top_parts2{
		position:absolute;
		top:56%;
		left:-65%;
		width:500px;
		height:auto;
	}
	.top_parts3{
		position:absolute;
		top:92%;
		left:-45%;
		width:500px;
		height:auto;
	}
	.top_parts4{
		position:absolute;
		top:67%;
		left:-15%;
		width:auto;
		height:92px;
	}
	.top_parts5{
		position:absolute;
		top:82%;
		left:28%;
		width:500px;
		height:auto;
	}
	nav{
		min-width:325px;
		padding:10px;
		margin:10px 10px 0px 10px;
	}
	.logo{
		max-width:260px;
	}
	.mobile-menu-button{
		cursor:pointer;1
		border:1px solid #005AC7;
		border-radius:2.28px;
		height:45px;
		width:45px;
		position:relative;
	}
	.mobile-menu-button span{
		display:block;
		background-color:#005AC7;
		height:1px;
		width:29px;
		position:absolute;
		left:7px;
	}
	.mobile-menu-button span:first-child{
		top:10px;
	}
	.mobile-menu-button span:nth-child(2){
		top:18px;
	}
	.mobile-menu-button span:nth-child(3){
		top:26px;
	}
	.mobile-menu-button p:nth-child(4){
		display:block;
	}
	.mobile-menu-button p:nth-child(5){
		display:none;
	}
	.mobile-menu-button p{
		margin:0;
		padding:0;
		font-size:8.635px;
		position:absolute;
		bottom:0px;
		left:0;
		width:100%;
		text-align:center;
		color:#005AC7;
		font-family: "Noto Sans";
		font-size: 8.635px;
		font-style: normal;
		font-weight: 500;
		line-height: 200%;
		letter-spacing: 0.864px;
	}
	#drawer-switch:checked~.drawer-page{
		opacity:1;
		transform:translateY(0);
		pointer-events:auto;
	}
	#drawer-switch:checked ~nav>.mobile-menu-button>span:first-child{
		top:15px;
		transform: rotate(30deg);
	}
	#drawer-switch:checked ~nav>.mobile-menu-button>span:nth-child(2){
		top:15px;
		transform: rotate(-30deg);
	}
	#drawer-switch:checked ~nav>.mobile-menu-button>span:nth-child(3){
		display:none;
	}
	#drawer-switch:checked ~nav>.mobile-menu-button>p:nth-child(4){
		display:none;
	}
	#drawer-switch:checked ~nav>.mobile-menu-button>p:nth-child(5){
		display:block;
	}
	body:has(#drawer-switch:checked){
		overflow:hidden;
		height:100vh;
	}
	.drawer-page{
		position:fixed;
		/*display:none;*/
		pointer-events:none;
		/*background-color:red;*/
		width:100%;
		height:100dvh;
		z-index:50;
		transition:0.4s ease;
		transform:translateY(-10px);
		opacity:0;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0 0 11.7px 0 rgba(0, 0, 0, 0.05);
		padding:118px 10px 0px 10px;
	}
	.information-button{
		color: #FFFFFF;
		height:58px;
		padding:0px 25px;
		display:flex;
		flex-wrap:nowrap;
		align-items:center;
		justify-content:space-between;
		border-radius: 5px;
		border: 1px solid #FFF;
		background: linear-gradient(91deg, #E1546D 15.24%, #AB4082 53.08%, #3351BA 86.15%);
		text-decoration:none;
		margin-bottom:40px;
	}
	.information-button p{;
		font-family: "Noto Sans";
		font-size: 18px;
		font-style: normal;
		font-weight: 700;
		line-height: 120%;
	}
	.information-button img:first-child{
		height:28px;
		width:auto;
	}
	.information-button img:last-child{
		height:19px;
		width:auto;	
	}
	.drawer__menu__wrapper1{
		margin-bottom:20px;
	}
	.drawer__menu__item1{
		color: #002552;
		font-family: "Noto Sans";
		font-size: 16px;
		font-style: normal;
		font-weight: 700;
		line-height: 150%; 
		letter-spacing: 0.32px;
		padding:15px;
		display:flex;
		flex-wrap:nowrap;
		align-items:center;
		gap:34px;
		text-decoration:none;
	}
	.drawer__menu__item1 img{
		height:42px;
		width:auto;
	}
	.drawer__menu__wrapper2{
		gap:10px;
		margin-bottom:46px;
	}
	.drawer__menu__item2 {
		display:flex;
		flex-wrap:nowrap;
		align-items:center;
		justify-content:space-between;
		padding:14px 18px;
		border-radius: 3.612px;
		background: #D9E7F3;
		width:calc((100% - 10px) / 2);
		text-decoration:none;
	}
	.drawer__menu__item2 span{
		color: #002552;
		font-family: "Noto Sans";
		font-size: 12px;
		font-style: normal;
		font-weight: 400;
		line-height: 120%;
	}
	.drawer__menu__item2 img{
		width:14px;
		height:14px;
	}
	.mobile-copyright{
		color: #002552;
		text-align: center;
		font-family: "Noto Sans";
		font-size: 12px;
		font-style: normal;
		font-weight: 400;
		line-height: 200%; /* 24px */
		letter-spacing: 0.24px;
	}
	section{
		padding:64px 20px!important;
	}
	h2{
		font-size:26px;
	}
	#anchor01{
		row-gap:20px;
	}
	.introduction{
		row-gap:22px;
		padding:0px;
	}
	.introduction p{
		font-size:16px;
	}
	.introduction~.container-fluid>.row{
		row-gap:20px;
	}
	.pointBox{
		padding:20px;
		row-gap:16px;
	}
	.pointBox__topText{
		font-size:22px;
	}
	.serviceBox{
		padding:20px;
	}
	.serviceBox__inner>div{
		align-items:center!important;
	}
	.serviceBox__item{
		flex-wrap:wrap;
	}
	.serviceBox__image{
		display:block;
	}
	.serviceBox__topText{
		font-size:24px;
		line-height:150%;
	}
	.serviceBox__number{
		font-size:25px;
	}
	.serviceBox span{
		font-size:16px;
	}
	.row:has(.needsBox__inner){
		row-gap:10px!important;
	}
	.needsBox__inner{
		padding:15px 20px;
	}
	.needsBox__inner__title{
		align-items:flex-start;
	}
	.needsBox__inner__topText{
		font-size:20px;
	}
	.needsBox__inner__mainText{
		font-size:14px;
	}
	.needsBox{
		padding:64px 20px;
	}
	.needsBox{
		--bs-gutter-y:15px;
	}
	.caseBox__title{
		margin:0px;
	}
	.processBox__left h2{
		margin-bottom:27px;
	}
	.processBox__inner{
		padding:16px 10px;
		flex-wrap:wrap;
		row-gap:20px;
	}
	.processBox__inner__left,
	.processBox__inner__right{
		width:100%;
	}
	.processBox__number{
		font-size:28px;
	}
	.processBox__number>span{
		font-size:18px;
	}
	.processBox__title{
		font-size:18px;
	}
	.processBox__inner__right >p{
		font-size:16px;
	}
	footer{
		padding:64px 20px 24px 20px!important;
		row-gap:24px;
	}
	footer section{
		padding:0px!important;
		row-gap:24px!important;
	}
	div.row:has(.footer__link__item){
		row-gap:16px;
	}
	.informationBox{
		padding:16px 20px;
		margin:0px;
	}
	.copyright{
		margin:18px 0px 0px 0px;
	}
}