#main{
	max-width: 1140px;
	margin:auto;
}
.anchor-nav {
  margin-bottom: 2rem;
}
@media (min-width:768px) and (max-width:1350px){
	.anchor-nav{
		padding: 1.125rem 1.75rem;
		gap: 1.5rem;
	}
}
.white_box{
	background: #fff;
	padding: 55px 65px;
	border-radius: 20px;
	margin-bottom: 40px;
	& .white_box_fl{
		display: flex;
		gap:50px;
	}
	& h3{
		color: var(--main-color);
		margin-bottom: 30px;
		font-size: 2rem;
	}

	& h4{
		font-size: 1.4rem;
		margin-bottom: 20px;
	}
	.img{
		max-width: 490px;
	}
}
@media screen and (max-width: 767px) {
	.sec_sp_pad{
		padding:0 20px;
	}
	.white_box {
    padding: 30px 20px;
    margin-bottom: 40px;
		& .white_box_fl {
				display: flex;
				gap: 20px;
				flex-direction: column;
		}
		& h3 {
        margin-bottom: 20px;
    }
	}

}

#assingnment{
	margin-bottom: 120px;
	& .fl{
		display: flex;
		gap:17px;
		justify-content: center;
		& > div {
			position: relative;
			border-radius: 200px;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			aspect-ratio:1/1;
			width: 100%;
			max-width: 270px;
			background: var(--gradient4);
			&:before{
				position:absolute;
				content:"";
				position: absolute;
        top: -2px;
        right: -2px;
        bottom: -2px;
        left: -2px;
        background:linear-gradient(to right, #AF90E5 0, #65BEFF 100%);
        border-radius: 20000px;
        z-index: -1;
			}
			& h3{
				color: var(--main-color);
				text-align: center;
				margin-bottom: 10px;
				font-size: 1.6rem;
				line-height: 1.4;
			}
			& p{
				text-align: center;
			}
		}
	}
}


#technology{
	& .lead{
		margin-bottom: 20px;
	}
	& .anchor-nav{
		width: fit-content;
		margin: auto;
		padding-left: 10%;
		padding-right: 10%;
		margin-bottom: 30px;
	}
	& .white_box{
		padding:50px;
		border-radius: 30px;
		background: #fff;
	}
	& h3{
		color: var(--main-color);
	}
	& .image{
		margin-bottom: 40px;
		.gr{
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap:20px;
		}
	}
	& .effect{
		margin-bottom: 40px;
		& .effect_lead{
			margin-bottom: 1rem;
		}
		& > .gr{
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap:20px;

			& > .effect_box{
				border-radius: 10px;
				border:solid 1px var(--main-color);
				padding:20px;

				& .fl{
					display: flex;
					gap:20px;
					justify-content: space-evenly;
					align-items:center;
				}
				& h5{
					text-align: center;
					font-size: 1.6rem;
					font-family: "MFW-UDShinGoPr6N-DeBold", sans-serif;
					font-weight: 600;
					margin-bottom: 10px;
				}
				& P{
					text-align: center;
					font-size: 2.5rem;
					padding-bottom: 5%;
					& span{
						font-size: 5rem;
						color: var(--main-color);
						font-weight: 400;
						font-family: 'MFW-UDShinGoPr6N-Regular';
					}
				}
				.box_lead{
					font-size: 1rem;
				}
				& img{
					max-width: 180px;
				}
			}
		}
	}
	& .voice{
		margin-bottom: 40px;
		& > .gr{
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap:20px;
			& .fl{
				display: flex;
				gap:10px;
				& img{
					width: 80px;
					height: 80px;
				}
			}
		}
	}
	& .facility{
		& dl{
			margin-bottom: 50px;
			& dt{
				cursor: pointer;
				position: relative;
				font-size: 1rem;
				padding:20px;
				background: var(--gradient4);
				border-radius: 20px;
				&.on{
					border-radius: 20px 20px 0 0;
					padding-bottom:0;
				}
				&:after{
					position:absolute;
					content:"";
					top:0;
					bottom: 0;
					right: 25px;
					width:29px;
					height: 29px;
					margin: auto;
					background: url(../img/qa/ico_open.svg) center / 100% 100%;
					background-size: cover;
				}
				&.on:after{
					position:absolute;
					content:"";
					top:20px;
					bottom: 0;
					right: 25px;
					width:29px;
					height: 29px;
					margin: auto;
					background: url(../img/qa/ico_close.svg) center / 100% 100%;
					background-size: cover;
					z-index: 99;
				}
			}
			dd{
				padding:20px;
				padding-top:0;
				border-radius: 0 0 20px 20px;
				position: relative;
				display: none;
				background: var(--gradient4);
				& p{
					margin-bottom: 1rem;
				}
				& p:last-of-type{
					margin-bottom: 1rem;
				}
				& .a_ul{
					text-decoration: underline;
					color: var(--main-color);
				}
				& .tel{
					font-size: 1.6rem;
					color: var(--main-color);
					font-family: "MFW-UDShinGoPr6N-DeBold", sans-serif;
					font-weight: 600;
				}
			}
			& .acc_none{
				pointer-events: none;
				&:after{
					content:none;
				}
			}
		}
	}
}


#personality{
	& .overlay-heading.centering h2 {
    left: 0;
    right: 0;
    margin: auto;
		transform: none;
	}
	& .image{
		display: flex;
		gap:20px;
		justify-content: space-between;
		margin-bottom: 30px;
		& ul{
			width: 100%;
			& li{
				font-family: "MFW-UDShinGoPr6N-DeBold", sans-serif;
				font-weight: 600;
				border-bottom: solid 1px var(--main-color);
				padding:10px 10px;
				position: relative;
				vertical-align: sub;
				font-size: 1.6rem;
				& span{
					padding-right: 30px;
					font-size:3.2rem;
					color: var(--main-color);
					font-family: 'BIZ UDGothic';
					font-style: italic;
					font-weight: 500;
					background: linear-gradient(to right, #AF90E5 0, #65BEFF 100%);
			    -webkit-background-clip: text;
			    -webkit-text-fill-color: transparent;
				}
			}
		}
		img{
			width: 100%;
			max-width: 50%;
			display: block;
		}
	}
	.condi{
		padding:20px;
		border-radius: 20px;
		border: solid 1px var(--main-color);
		margin-bottom: 30px;
	}
}


#smartcaregiver{
	& .overlay-heading.centering h2 {
    left: 0;
    right: 0;
    margin: auto;
		transform: none;
	}
	& .lead{
		margin-bottom: 30px;
	}
	& .white_box{
		& .fl{
			display: flex;
			gap:40px;
		}
		& .txt{
			& h4{
				font-size: 1.4rem;
			}
			& p{
				margin-bottom: 1rem;
			}
			& .mar_adj{
				margin-bottom: 2rem;
			}
		}
		& img{
			max-width: 50%;
			height: fit-content;
		}
		& ul{
			padding-left: 5px;
			& li{
				line-height: 1.8;
				padding-left: 20px;
				position: relative;
				&:before{
					top:0;
					bottom: 0;
					left: 0;
					margin: auto;
					position: absolute;
					content:"";
					width: 8px;
					height: 8px;
					border-radius: 20px;
					font-size: 1.8rem;
					background:  linear-gradient(to right, #AF90E5 0, #65BEFF 100%);

				}
			}
		}
	}
}

#voice{
	& .white_box{
		& .fl{
			display: flex;
			gap:40px;
		}
		& .txt{
			& h4{
				font-size: 1.4rem;
			}
			& p{
				margin-bottom: 1rem;
			}
			& .mar_adj{
				margin-bottom: 2rem;
			}
		}
		& img{
			max-width: 50%;
			height: fit-content;
		}
	}
}

#faq{
	dl{
		margin-bottom: 50px;
		dt{
			cursor: pointer;
			position: relative;
			font-family: "MFW-UDShinGoPr6N-DeBold", sans-serif;
			font-weight: 600;
			font-size: 1.4rem;
			padding: 2.1875rem 4.6875rem 2.1875rem 5.125rem;
			background: var(--gradient4);
			border-radius: 20px;
			&.on{
				border-radius: 20px 20px 0 0;
			}
			&:before{
				position:absolute;
				content:"";
				top:0;
				bottom: 0;
				left: 1.6875rem;
				width: 2.3125rem;
				height: 2.0625rem;
				margin: auto;
				background: url(../img/qa/icon_q2.svg) center / 100% 100%;
				background-size: cover;
			}
			&:after{
				position:absolute;
				content:"";
				top:0;
				bottom: 0;
				right: 25px;
				width:29px;
				height: 29px;
				margin: auto;
				background: url(../img/qa/ico_open.svg) center / 100% 100%;
				background-size: cover;
			}
			&.on:after{
				position:absolute;
				content:"";
				top:0;
				bottom: 0;
				margin: auto;
				background: url(../img/qa/ico_close.svg) center / 100% 100%;
				background-size: cover;
			}
		}
		dd{
			padding: 1.25rem 4.6875rem 1.25rem 5.125rem;
			border-radius: 0 0 20px 20px;
			position: relative;
			display: none;
			&:before{
				position:absolute;
				content:"";
				top:30px;
				bottom: auto;
				left: 1.6875rem;
				width: 2.3125rem;
				height: 2.0625rem;
				margin: auto;
				background: url(../img/qa/icon_a2.svg) center / 100% 100%;
				background-size: cover;
			}
			& p{
				margin-bottom: 1rem;
			}
			& p:last-of-type{
				margin-bottom: 1rem;
			}
			& .a_ul{
				text-decoration: underline;
				color: var(--main-color);
			}
			& .tel{
				font-size: 1.6rem;
				color: var(--main-color);
				font-family: "MFW-UDShinGoPr6N-DeBold", sans-serif;
				font-weight: 600;
			}
		}
	}
	dl:last-of-type{
		margin-bottom: 0px;
	}
}

@media screen and (max-width: 767px) {
	#assingnment {
    & .fl {
        flex-direction: column;
        align-items: center;
				& > div {
            & h3 {
                color: var(--main-color);
                text-align: center;
                margin-bottom: 10px;
                font-size: 1.2rem;
                line-height: 1.4;
            }
        }
    }
	}
	#technology {
		margin-bottom: 100px;
		& .overlay-heading {
        margin-bottom: 4.5rem;
        margin-inline: -1rem;
    }
    & .anchor-nav {
        padding-left: 5%;
        width: 100%;
    }
		& .white_box {
        padding:30px 20px;
    }
		& h3 {
        font-size: 1.4rem;
    }
		& .image {
        .gr {
            grid-template-columns: 1fr;
            gap: 20px;
        }
    }
		& h4 {
				font-size: 1rem;
		}
		& .effect {
        & > .gr {
            display: grid;
            grid-template-columns: 1fr;
            gap: 20px;
						& > .effect_box {
							padding:10px 10px;
							& h5 {
                    text-align: center;
                    font-size: 1.2rem;
										margin-bottom: 0;
							}
                & img {
                    max-width: 100px;
                    width: 100%;
                }
								& p {
									font-size: 1.4rem;
                    & span {
                        font-size: 3.2rem;
                    }
                }
            }
        }
    }
		& #medication{
			& h5{
				margin-bottom: 20px;
			}
		}
		& .voice {
        & > .gr {
            display: grid;
            grid-template-columns: 1fr;
            gap: 20px;
						& .fl {
                & img {
                    width: 60px;
                    height:60px;
                }
            }
        }
    }
		& .facility {
      & dl {
        & dt {
            cursor: pointer;
            position: relative;
            font-size: 1rem;
            padding: 20px 10px;
						padding-right: 50px;
						&:after {
              right: 15px;
            }
						&.on:after {
							right: 15px;
						}
        }
				& dd{
					padding: 20px 10px;
					padding-top: 0px;
					padding-right: 50px;
				}
			}
		}
	}
	& #personality {
		.overlay-heading {
				margin-bottom: 4.5rem;
				margin-inline: -1rem;
		}
    & .image {
      flex-direction: column-reverse;
			& img {
          width: 100%;
          max-width: 100%;
          display: block;
      }
			& ul {
				& li {
					font-size: 1.2rem;
					padding: 10px 10px 0px
					& span {
						padding-right: 30px;
						font-size: 2.4rem;
					}
				}
			}
    }
		& .condi {
        padding: 15px 15px;
        border-radius: 10px
		}
		.white_box {
			box-shadow: 0 0 20px #46368940;
    	& h3 {
        font-size: 1.4rem;
    	}
		}
	}
	#smartcaregiver{
		& .overlay-heading > div {
        font-size: 2em;
    }
		& .overlay-heading {
        margin-bottom: 4.5rem;
        margin-inline: -1rem;
    }
		& .lead {
			margin-bottom: 30px;
			text-align: left;
		}
		.white_box {
    	& h3 {
        font-size: 1.3rem;
    	}
			& .fl {
					gap: 0px;
					flex-direction: column;
			}
			& img {
            max-width: 100%;
            height: fit-content;
      }
			& .txt {
					& h4 {
							font-size: 1rem;
					}
			}
			& ul {
          margin-bottom: 20px;
      }
		}
	}

	#voice{
		& .overlay-heading {
        margin-bottom: 4.5rem;
    }
		.white_box {
    	& h3 {
        font-size: 1.3rem;
    	}
			& .txt {
					& h4 {
							font-size: 1rem;
					}
			}
			& .fl {
				gap: 0px;
				flex-direction: column;
			}
			& img {
          max-width: 100%;
      }
		}
	}
	#faq {
    & dl {
			margin-bottom: 30px;
      &  dt {
          padding: 2rem 2.5rem 2rem 3rem;
          font-size: 1rem;
					&:before {
						left: 0.875rem;
						width: 1.5625rem;
						height: 1.4375rem;
					}
					&:after {
						right: 0.375rem;
						width: 1.8125rem;
						height: 1.8125rem;
					}
					&.on:after {
						right: 0.5rem;
					}
			}
			& dd{
				padding: 2rem 2.5rem 2rem 3rem;
				font-size: 1rem;
					&:before{
						top: 2rem;
						left: 0.875rem;
						width: 1.5625rem;
						height: 1.4375rem;
					}
				}
			}
		}
	}
}