@charset "utf-8";
#interior_menu a {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}
#interior_menu a:hover {
}
@media screen and (max-width: 750px) {
	#interior_menu {
		margin-top: calc(64 / 600 * 100vw);
		padding: calc(10 / 600 * 100vw) 0;
	}
	#interior_menu ul {
		display: block;
	}
	#interior_menu a {
		padding: calc(22 / 600 * 100vw) 0;
	}
	#interior_menu a img {
		height: calc(22 / 600 * 100vw);
		width: auto;
	}
}
@media screen and (min-width: 751px) {
	#interior_menu {
		margin-top: min(120 / 1256 * 100vw, 120px);
		padding: min(33 / 1256 * 100vw, 33px) 0;
	}
	#interior_menu ul {
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0;
		padding: 0;
	}
	#interior_menu ul li {
		width: 33.33%;
		position: relative;
	}
	#interior_menu ul li:not(:first-child)::before {
		content: '';
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
		width: 0;
		height: 100%;
		border-left: 1px solid #333;
	}
	#interior_menu a {
		padding: 0 20px;
		transition: 0.3s;
	}
	#interior_menu a img {
		height: min(22 / 1256 * 100vw, 22px);
		width: auto;
	}
}

/*

*/
.wrap-solio .titleH2 h2 {
	line-height: 1;
}
@media screen and (max-width: 750px) {
	.wrap-solio .whiteBox {
		padding: calc(64 / 600 * 100vw) calc(18 / 600 * 100vw);
	}
	.wrap-solio .titleH2 {
		margin-top: calc(128 / 600 * 100vw);
		padding: calc(34 / 600 * 100vw) calc(18 / 600 * 100vw);
	}
	.wrap-solio .titleH2 h2 img {
		height: calc(33 / 600 * 100vw);
		width: auto;
	}
	.wrap-solio h3 {
		letter-spacing: -0.01em;
	}
	.wrap-solio .titleArea .box1_1_pc {
		margin-top: calc(72 / 600 * 100vw);
	}
	.wrap-solio .titleLead {
		font-size: calc(28 / 600 * 100vw);
		font-weight: 700;
		line-height: calc(42 / 28);
		padding-top: calc(27 / 600 * 100vw);
	}
}
@media screen and (min-width: 751px) {
	.wrap-solio .titleH2 {
		margin-top: min(128 / 1256 * 100vw, 128px);
		padding: min(27 / 1256 * 100vw, 27px) min(32 / 1256 * 100vw, 32px);
	}
	.wrap-solio .titleH2 h2 img {
		height: min(37 / 1256 * 100vw, 37px);
		width: auto;
	}
	.titleArea .box1_1_pc {
		margin-top: min(72 / 1256 * 100vw, 72px);
	}
	.wrap-solio .titleLead {
		font-size: min(32 / 1256 * 100vw, 32px);
		font-weight: 700;
		line-height: calc(48 / 32);
		padding-top: min(27 / 1256 * 100vw, 27px);
	}
}
/*

*/
.wrap-solio .notice {
	border: 1px solid #FF0000;
}
.wrap-solio .notice p {
	color: #ff0000;
}
@media screen and (max-width: 750px) {
	.wrapYoutube {
		margin: calc(50 / 600 * 100vw) auto 0;
	}
	.wrap-solio .wrapYoutube .notes {
		padding-top: calc(10 / 600 * 100vw);
	}
	.wrap-solio .notice {
		margin-top: calc(32 / 600 * 100vw);
		padding: calc(12 / 600 * 100vw);
	}
	.wrap-solio .notice p {
		font-size: calc(16 / 600 * 100vw);
		padding: 0;
	}
}
@media screen and (min-width: 751px) {
	.wrap-solio .w600 {
		width: min(600 / 1256 * 100vw, 600px);
		margin: 0 auto;
	}
	.wrap-solio .w800 {
		width: min(800 / 1256 * 100vw, 800px);
		margin: 0 auto;
	}
	.wrapYoutube {
		width: min(592 / 1256 * 100vw, 592px);
		margin: min(20 / 1256 * 100vw, 20px) auto 0;
	}
	.wrap-solio .wrapYoutube .notes {
		padding-top: min(10 / 1256 * 100vw, 10px);
	}
	.wrap-solio .notice {
		margin-top: min(32 / 1256 * 100vw, 32px);
		padding: min(12 / 1256 * 100vw, 12px);
	}
	.wrap-solio .notice p {
		font-size: min(16 / 1256 * 100vw, 16px);
		padding: 0;
	}
}
.wrap-solio #img41 p.noPadding,.wrap-solio #img42 p.noPadding {
	position: relative;
	z-index: 2;
}
@media screen and (max-width: 750px) {
	.wrap-solio p + h4,.wrap-solio div + h4 {
		padding-top: calc(64 / 600 * 100vw);
	}	
	.wrap-solio .paddingT48 {
		padding-top: calc(48 / 600 * 100vw);
	}
	.wrap-solio .paddingT72 {
		padding-top: calc(72 / 600 * 100vw);
	}
	.wrap-solio #img41 p.noPadding,.wrap-solio #img42 p.noPadding {
		margin-top: calc(-20 / 600 * 100vw);
	}
	.wrap-solio #img51_64 p + p {
		padding-top: calc(5 / 600 * 100vw);
	}
}
@media screen and (min-width: 751px) {
	.wrap-solio p + h4,.wrap-solio div + h4 {
		padding-top: min(27 / 1256 * 100vw, 27px);
	}
	.wrap-solio .paddingT48 {
		padding-top: min(48 / 1256 * 100vw, 48px);
	}
	.wrap-solio .paddingT72 {
		padding-top: min(72 / 1256 * 100vw, 72px);
	}
	#img22,#img24,#img30,#img36,#img41,#img42{
		width: min(592 / 1256 * 100vw, 592px);
	}
	#img25,#img29{
		width: min(800 / 1256 * 100vw, 800px);
	}
	#img3839 > div {
		width: min(386 / 1256 * 100vw, 386px);
	}
	.wrap-solio #img41 p.noPadding,.wrap-solio #img42 p.noPadding {
		position: relative;
		margin-top: max(-20 / 1256 * 100vw, -20px);
		z-index: 2;
	}
	#img51_64 {
		justify-content: flex-start;
		row-gap: min(64 / 1256 * 100vw, 64px);
	}
	.wrap-solio #img51_64 p + p {
		padding-top: min(5 / 1256 * 100vw, 5px);
	}
}
#naviAccessory {
	border: 1px solid #707070;
	background-color: #F4EFEF;
}
@media screen and (max-width: 750px) {
	#navi h3 {
		font-size: calc(28 / 600 * 100vw);
	}
	#navi h3 span {
		font-size: calc(22 / 600 * 100vw);
	}
	#navi h5 {
		padding-top: calc(43 / 600 * 100vw);
	}
	#navi .box:first-of-type,#navi .box:nth-of-type(2) {
		row-gap: calc(22 / 600 * 100vw);
		justify-content: flex-start;
	}
	#navi #naviAccessory {
		column-gap: calc(11 / 600 * 100vw);
		row-gap: calc(24 / 600 * 100vw);
		padding: calc(21 / 600 * 100vw) calc(13 / 600 * 100vw);
	}
	#navi #naviAccessory .box2_1_sp {
		width: calc(238 / 600 * 100vw);
	}
	#navi #naviAccessory p {
		font-size: calc(16 / 600 * 100vw);
	}
	#notesAll {
		margin-top: calc(52 / 600 * 100vw);
	}
}
@media screen and (min-width: 751px) {
	#usability {
		padding-bottom: min(120 / 1256 * 100vw, 120px);
	}
	#navi h3 {
		font-size: min(32 / 1256 * 100vw, 32px);
	}
	#navi h3 span {
		font-size: min(24 / 1256 * 100vw, 24px);
	}
	#navi h3 span.notes {
		font-size: min(14 / 1256 * 100vw, 14px);
    display: block;
    padding: min(10 / 1256 * 100vw, 10px) 0 0 0;
	}
	#navi h4 {
		font-size: min(26 / 1256 * 100vw, 26px);
		padding-top: 0;
	}
	#navi h5 {
		padding-top: min(43 / 1256 * 100vw, 43px);
	}
	#navi .box h5 {
		padding-top: 0;
	}
	#navi .box:first-of-type,#navi .box:nth-of-type(2),#navi #naviAccessory {
		column-gap: min(8 / 1256 * 100vw, 8px);
		justify-content: flex-start;
	}
	#navi .box:nth-of-type(2) {
		margin-top: min(8 / 1256 * 100vw, 8px);
	}
	#navi .box > div.box5_1_pc {
		width: min(195 / 1256 * 100vw, 195px);
	}
	#navi #naviAccessory {
		align-items: center;
		margin-top: min(20 / 1256 * 100vw, 20px);
		padding: min(18 / 1256 * 100vw, 18px) min(34 / 1256 * 100vw, 34px);
	}
	#navi #naviAccessory > div.box2_1_pc {
		width: min(450 / 1256 * 100vw, 450px);
		margin-left: min(18 / 1256 * 100vw, 18px);
	}
	#navi #img76 {
		margin-top: min(48 / 1256 * 100vw, 48px);
	}
	#navi #img80 {
		margin-top: min(43 / 1256 * 100vw, 43px);
	}
	.notesAll {
		margin-top: min(54 / 1256 * 100vw, 54px);
	}
}
/*










*/
.hidden_box {
	display: none;
}
.accordion_btn {
	width: min(80%, 350px);
	margin: 70px auto 0;
}
@media screen and (max-width: 750px) {
	.accordion_btn {
	width: calc(384 / 600 * 100vw);
	margin: calc(60 / 600 * 100vw) auto 0;
}
}
@media screen and (min-width: 751px) {
	.accordion_btn {
	width: min(384 / 1256 * 100vw, 384px);
	margin: min(60 / 1256 * 100vw, 60px) auto 0;
}
}
.accordion_btn a {
	position: relative;
	display: block;
	color: #fff;
	background-color: #000;
	border: 1px solid #707070;
	text-align: center;
	padding: 0;
	transition: 0.3s;
}
.accordion_btn a:hover {
	text-decoration: none;
	color: #000;
	background-color: #fff;
	border: 1px solid #707070;
}
@media screen and (max-width: 750px) {
.accordion_btn a {
	font-size: calc(18 / 600 * 100vw);
	line-height: calc(48 / 600 * 100vw);
}
}
@media screen and (min-width: 751px) {
.accordion_btn a {
	font-size: min(24 / 1256 * 100vw,24px);
	line-height: min(48 / 1256 * 100vw, 48px);
}
}
.accordion_btn a:before, .accordion_btn a:after {
	content: "";
	position: absolute;
	top: 50%;
	width: 28px;
	height: 4px;
	background: #fff;
	transform: translateY(-50%) scale(50%);
}
@media screen and (max-width: 750px) {
	.accordion_btn a:before, .accordion_btn a:after {
		right: calc(22 / 600 * 100vw);
	}
}
@media screen and (min-width: 751px) {
	.accordion_btn a:before, .accordion_btn a:after {
		right: min(17 / 1256 * 100vw, 17px);
	}
}
.accordion_btn a:hover:before, .accordion_btn a:hover:after {
	background: #000;
}
.accordion_btn a.active:after {
	transform: translateY(-50%) scale(50%) rotate(0deg);
}
.accordion_btn a:after {
	transform: translateY(-50%) scale(50%) rotate(90deg);
}