@charset "utf-8";
/*---------------------------------------
 Wordpress調整用
-----------------------------------------*/
#content {
	color: #333333;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 1.6;
	margin: 0;
	padding: 0;
}
.breadcrumb,
header h1,
h3.entry-card-productid,
.date-tags,
.entry-categories-tags,
.under-entry-content {
	display: none !important;
}
.content,
#main,
.entry-content,
.entry-content > *,
.no-sidebar .base .main,
.article h1,
.article h2,
.article h3,
.article h4,
.article h5,
.article h6,
.article dl,
.article dt,
.article dd,
.article ul,
.article ul li,
.article ol,
.article ol li {
	background-color: unset !important;
	border: none;
	border-radius: unset;
	font-size: inherit;
	line-height: unset;
	margin: 0;
	padding: 0;
}
@media screen and (max-width: 1024px) {
	#content {
		font-size: 14px;
	}
}
@media screen and (max-width: 768px) {
	#content {
		font-size: 12px;
	}
	#header-container {
		display: none !important;
	}
}
@media screen and (max-width: 480px) {
	#content {
		font-size: 11px;
	}
}
/*---------------------------------------
 基本設定
-----------------------------------------*/
:root {
	--color-orange: #FF6B00;
	--color-green: #3C7673;
	--color-mikan: #F2A534;
	--box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
body {
	background-color: #FFFFFF !important;
}
h2 small {
	font-size: 0.75em;
}
a {
	color: unset;
	text-decoration: none;
}
img {
	max-width: 100%;
	vertical-align: top;
}
/*-----------------------------------------
Common
-----------------------------------------*/
.base {
	margin: 0 auto;
	padding: 1rem;
	position: relative;
	width: 100%;
}
.section-title {
	background-position: top left;
	background-repeat: no-repeat;
	background-size: contain;
	display: flex;
	flex-direction: column;
	line-height: 1.25;
	padding: 0 0 0 10.5rem;
	width: fit-content;
}
.section-title + small {
	display: block;
	margin: 0 0 0 11rem;
}
.section-title h2 {
	font-size: 3em;
	font-weight: 900;
}
.section-title h2 strong {
	display: block;
	font-size: 0.5em;
	font-weight: 700;
}
.section-title h2 span {
	font-size: 0.6em;
}
h3.item-title {
	color: var(--color-orange);
	font-size: 2em;
	font-weight: 900;
	margin: 2rem auto 0;
	width: fit-content;
}
h3.item-title span {
	font-size: 0.75em;
	padding: 0 0 0 0.5rem;
}
.pc {display: block !important;}
.sp {display: none !important;}
@media screen and (max-width: 768px) {
	.section-title {
		padding: 0 0 0 7.5rem;
	}
}
@media screen and (max-width: 480px) {
	section {
		padding: 0 1rem !important;
	}
	.base {
		padding: 1rem 0 !important;
	}
	.section-title h2 {
		font-size: 2em;
	}
	.section-title {
		padding: 0 0 0 4rem;
	}
	.section-title + small {
		margin: 0;
		text-align: center;
	}
	.pc {display: none !important;}
	.sp {display: block !important;}
}
/*-----------------------------------------
Key Visual
-----------------------------------------*/
#kv .base  {
	background-image: url(img/01.png);
	background-position: right bottom;
	background-repeat: no-repeat;
	background-size: 55%;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: repeat(9, 3rem);
	max-width: 1000px;
	padding: 0;
	width: 100%;
}
#kv h2 {
	align-content: center;
	grid-row: 3 / 5;
	color: var(--color-orange);
	font-size: 2em;
	font-weight: 400;
	line-height: 1.3;
	text-align: left;
	text-shadow: 1px 1px 1px rgba(255, 255, 255, 1);
}
#kv h2 span {
	display: block;
}
#kv h2 strong {
	font-size: 1.25em;
}
#kv h1 {
	background-image: url(img/02.png);
	background-position: top 10% left;
	background-repeat: no-repeat;
	background-size: 70%;
	grid-row: 5 / 10;
	font-size: 3.25em;
	font-weight: 900;
	text-align: right;
}
#kv h1 span{
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
@media screen and (max-width: 1024px) {
	#kv .base {
		background-position: top right;
		grid-template-rows: repeat(10, 3rem);
		margin: 0;
		padding: 0 2%;
	}
	#kv h2 {
		grid-row: 3 / 6;
	}
	#kv h1 {
		grid-row: 6 / 9;
		font-size: 3em;
	}
}
@media screen and (max-width: 768px) {
	#kv .base {
		grid-template-rows: repeat(8, 3rem);
	}
	#kv h2 {
		grid-row: 3 / 5;
	}
	#kv h1 {
		grid-row: 5 / 8;
	}
}
@media screen and (max-width: 667px) {
	#kv .base {
		background-position: right bottom;
		grid-template-rows: repeat(6, 3rem);
	}
	#kv h2 {
		font-size: 1.75em;
		grid-row: 2 / 4;
	}
	#kv h1 {
		font-size: 2.5em;
		grid-row: 4 / 6;
	}
}
@media screen and (max-width: 480px) {
	section#kv {
		padding: 0 0 0 1rem !important;
	}
	#kv .base {
		background-position: top right;
		background-size: 65%;
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(5, 2.5rem);
	}
	#kv h2 {
		grid-column: 1 / 3;
		grid-row: 3 / 4;
		font-size: 1.25em;
	}
	#kv h1 {
		background-size: 65%;
		grid-column: 1 / 3;
		grid-row: 4 / 6;
		font-size: 2em;
	}
}
/*-----------------------------------------
Lead Text
-----------------------------------------*/
#lead-text {
	padding: 0;
	text-align: center;
}
#lead-text p {
	border-bottom: var(--color-orange) 2px solid;
	font-size: 1.25em;
	font-weight: 700;
	margin: 0 0 1rem;
}
#lead-text p span {
	font-size: 1.35em;
	font-weight: 900;
	padding: 0 0.25rem;
}
#lead-text p strong {
	color: var(--color-green);
	font-size: 1.65em;
	font-weight: 900;
	padding: 0 0.25rem;
}
@media screen and (max-width: 1024px) {
	#lead-text p {
		font-size: 1.05em;
	}
}
/*-----------------------------------------
Feature
-----------------------------------------*/
#feature .base {
	border-top: var(--color-orange) 2px solid;
	margin: 8rem auto 0;
	padding: 2rem 0;
}
#feature h2 {
	background-color: #FFFFFF !important;
	background-image: url(img/03.png);
	background-position: left 2% center;
	background-repeat: no-repeat;
	background-size: contain;
	font-size: 2.5em;
	font-weight: 900;
	height: 4rem;
	line-height: 1.2;
	padding: 0 2%;
	position: absolute;
	top: -2rem;
	left: 25%;
	text-align: right;
	width: 50%;
}
#feature h2 span {
	display: inline-block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
#feature dl {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 2rem;
	justify-content: space-between;
	margin: 2rem auto 0;
	width: 98%;
}
#feature dl dt {
	width: 30%
}
#feature dl dd {
	flex: 1;
	font-size: 1.1em;
	font-weight: 400;
}
#feature dl dd h4 {
	color: var(--color-orange);
	font-size: 1.5em;
	font-weight: 600;
}
#feature dl dd a {
	border-bottom: var(--color-green) 2px solid;
	color: var(--color-green);
	display: block;
	font-weight: 700;
	line-height: 1;
	margin: 1rem 0 0;
	width: fit-content;
}
#feature dl dd a::before {
	content: "\f101";
	font-family: "Font Awesome 5 Free";
	font-size: 1.25em;
	margin-right: 0.25rem;
}
@media screen and (max-width: 768px) {
	#feature h2 {
		height: 3.5rem;
		line-height: 1.3;
		left: 17%;
		width: 66%;
	}
	#feature dl {
		gap: 1.5rem;
	}
}
@media screen and (max-width: 667px) {
	#feature .base {
		margin: 4rem auto 0;
	}
	#feature h2 {
		font-size: 2.25em;
		line-height: 1.3;
		height: 3rem;
		top: -1.5rem;
	}
	#feature dl {
		gap: 1rem;
	}
}
@media screen and (max-width: 480px) {
	#feature h2 {
		background-size: 55%;
		font-size: 1.55em;
		height: 2rem;
		top: -1rem;
		left: 10%;
		width: 80%;
	}
	#feature dl {
		justify-content: center;
	}
	#feature dl dt {
		width: 60%;
	}
	#feature dl dd {
		flex: none;
		width: 100%;
	}
	#feature dl dd h4 {
		font-size: 1.25em;
	}
}
/*-----------------------------------------
Type Solor
-----------------------------------------*/
#type-solor {
	margin: 8rem 0 0;
}
#type-solor .base {
	border-top: var(--color-orange) 2px solid;
}
#type-solor .section-title {
	background-image: url(img/07.png);
}
#type-solor #type-solor-card {
	box-shadow: var(--box-shadow);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 2rem auto 0;
	padding: 2rem;
	width: 100%;
}
#type-solor #type-solor-card h3 {
	font-size: 2em;
	font-weight: 900;
}
#type-solor #type-solor-card p {
	margin: 0 1rem 2rem;
}
#type-solor #type-solor-card ul {
	display: flex;
	gap: 2rem;
	justify-content: space-between;
	list-style: none;
	margin: 0 0 0.5rem;
}
#type-solor #type-solor-card dl {
	display: flex;
	gap: 2rem;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 2rem 0 0;
}
#type-solor #type-solor-card dl dt {
	width: 32.5%;
}
#type-solor #type-solor-card dl dd {
	flex: 1;
	font-size: 0.9em;
	line-height: 1.4;
}
#type-solor #type-solor-card dl dd h4 {
	font-size: 1.5em;
	font-weight: bold;
	padding: 0 0 0.75rem;
}
#type-solor #type-solor-card dl dd h4 i {
	color: #74AD19;
	font-size: 1.5em;
	margin: 0 0.5rem 0 0;
	vertical-align: middle;
}
#type-solor #type-solor-card dl dd h5 {
	font-size: 1.15em;
	line-height: 1;
	margin: 1.25rem 0 0;
}
#type-solor #type-solor-card dl dd h5::before {
	content: "\f111";
	font-family: "Font Awesome 5 Free";
	font-size: 0.35em;
	font-weight: bold;
	margin-right: 0.5rem;
	vertical-align: middle;
}
#type-solor #type-solor-card dl dd span {
	display: block;
	padding-left: 1em;
}
#type-solor dl.item-card {
	box-shadow: var(--box-shadow);
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	margin: 2rem auto 0;
	padding: 2rem;
	width: 100%;
}
#type-solor dl.item-card dt {
	width: 25%;
}
#type-solor dl.item-card dd {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 2rem;
	flex: 1;
}
#type-solor dl.item-card dd .item-base {
	background-color: #EEEEEE;
	padding: 1rem;
	width: 100%;
}
#type-solor dl.item-card dd .item-base ul.item-info {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	list-style: none;
	margin: 0 auto;
	width: 97%;
}
#type-solor dl.item-card dd .item-base ul.item-info li.model {
	background: linear-gradient(45deg, var(--color-orange) 0%, var(--color-mikan) 50%, var(--color-orange) 100%);
	display: inline-block;
	font-size: 1.25em;
	font-weight: 900;
	line-height: 1;
	width: 22.5%;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
#type-solor dl.item-card dd .item-base ul.item-info li.model strong {
	font-size: 1.25em;
}
#type-solor dl.item-card dd .item-base ul.item-info li.pid {
	background-color: var(--color-orange) !important;
	border-radius: 5rem;
	color: #FFFFFF;
	font-size: 0.9em;
	font-weight: 700;
	padding: 0 1rem;
	width: fit-content;
}
#type-solor dl.item-card dd .item-base ul.item-info li.detail {
	margin: 0 0 0 auto;
}
#type-solor dl.item-card dd .item-base ul.item-info li.detail a {
	border-bottom: var(--color-green) 2px solid;
	color: var(--color-green);
	font-size: 0.9em;
	font-weight: 700;
	line-height: 1;
}
#type-solor dl.item-card dd .item-base ul.item-info li.detail a::before {
	content: "\f101";
	font-family: "Font Awesome 5 Free";
	font-size: 1.25em;
	margin-right: 0.25rem;
}
#type-solor dl.item-card dd .item-base p {
	border-bottom: var(--color-orange) 2px solid;
	font-size: 1.05em;
	font-weight: 900;
	margin: 0.75rem 0 1rem;
}
#type-solor dl.item-card dd .item-base ul.item-link {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;
	justify-content: space-evenly;
	list-style: none;
	margin: 0 auto;
	width: 100%;
}
#type-solor dl.item-card dd .item-base ul.item-link li {
	min-width: calc(35% - 2rem);
	width: fit-content;
}
#type-solor dl.item-card dd .item-base ul.item-link li a {
	background-color: var(--color-mikan);
	border-radius: 0.5rem;
	color: #FFFFFF;
	display: block;
	font-size: 1.15em;
	padding: 0.25rem 1rem;
	text-align: center;
	width: 100%;
}
#type-solor dl.item-card dd .item-base ul.item-link li.green100 {
	width: 100%;
}
#type-solor dl.item-card dd .item-base ul.item-link li.green100 a {
	background-color: var(--color-green);
}
#type-solor dl.item-card dd .item-base ul.item-link li a i {
	margin-right: 0.25rem;
}
@media screen and (max-width: 1024px) {
	#type-solor #type-solor-card {
		padding: 1.5rem;
		width: 98%;
	}
	#type-solor #type-solor-card h3 {
		font-size: 1.75em;
	}
	#type-solor #type-solor-card ul,
	#type-solor #type-solor-card dl {
		gap: 1.5rem;
	}
	#type-solor dl.item-card {
		gap: 1rem;
		padding: 1.5rem;
		width: 98%;
	}
	#type-solor dl.item-card dt {
		width: 20%;
	}
	#type-solor dl.item-card dd {
		gap: 1rem;
	}
}
@media screen and (max-width: 667px) {
	#type-solor {
		margin: 4rem 0 0;
	}
	#type-solor #type-solor-card {
		padding: 1rem;
		width: 100%;
	}
	#type-solor #type-solor-card ul,
	#type-solor #type-solor-card dl {
		gap: 1rem;
	}
	#type-solor dl.item-card {
		gap: 1rem;
		padding: 1rem;
		width: 100%;
	}
	#type-solor dl.item-card dd .item-base ul.item-link li a {
		font-size: 1em;
	}
}
@media screen and (max-width: 480px) {
	#type-solor #type-solor-card {
		margin: 1rem auto 0;
		padding: 1rem;
	}
	#type-solor #type-solor-card p {
		margin: 0 0 0.5rem;
	}
	#type-solor #type-solor-card dl {
		justify-content: center;
	}
	#type-solor #type-solor-card dl dt {
		width: 60%;
	}
	#type-solor #type-solor-card dl dd {
		font-size: 1em;
		flex: unset;
	}
	#type-solor dl.item-card {
		margin: 0.5rem auto 0;
		justify-content: center;
	}
	#type-solor dl.item-card dt {
		width: 60%;
	}
	#type-solor dl.item-card dd {
		flex: none;
		width: 100%;
	}
	#type-solor dl.item-card dd .item-base ul.item-info {
		gap: 0;
		justify-content: space-between;
	}
	#type-solor dl.item-card dd .item-base ul.item-info li.model {
		width: auto;
	}
	#type-solor dl.item-card dd .item-base ul.item-info li.detail {
		margin: 0;
		text-align: right;
		width: 100%;
	}
	#type-solor dl.item-card dd .item-base p {
		margin: 0.25rem 0 0.75rem;
	}
	#type-solor dl.item-card dd .item-base ul.item-link li,
	#type-solor dl.item-card dd .item-base ul.item-link li a {
		width: 100%;
	}
}
/*-----------------------------------------
Type Compact
-----------------------------------------*/
#type-compact {
	margin: 8rem 0 0;
}
#type-compact .base {
	border-top: var(--color-orange) 2px solid;
}
#type-compact .section-title {
	background-image: url(img/13.png);
}
#type-compact #type-compact-card {
	box-shadow: var(--box-shadow);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 2rem auto 0;
	padding: 2rem 2rem 5rem;
	width: 100%;
}
#type-compact #type-compact-card h3 {
	font-size: 2em;
	font-weight: 900;
}
#type-compact #type-compact-card p {
	margin: 0 1rem 2rem;
}
#type-compact #type-compact-card ul {
	display: flex;
	gap: 2rem;
	justify-content: space-between;
	list-style: none;
	margin: 0 auto;
	width: 90%
}
#type-compact dl.item-card {
	box-shadow: var(--box-shadow);
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	margin: 2rem auto 0;
	padding: 2rem;
	width: 100%;
}
#type-compact dl.item-card dt {
	width: 25%;
}
#type-compact dl.item-card dd {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 2rem;
	flex: 1;
}
#type-compact dl.item-card dd .item-base {
	background-color: #EEEEEE;
	padding: 1rem;
	width: 100%;
}
#type-compact dl.item-card dd .item-base ul.item-info {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: space-between;
	list-style: none;
	margin: 0 auto;
	width: 97%;
}
#type-compact dl.item-card dd .item-base ul.item-info li.model {
	background: linear-gradient(45deg, var(--color-orange) 0%, var(--color-mikan) 50%, var(--color-orange) 100%);
	display: inline-block;
	font-size: 1.25em;
	font-weight: 900;
	line-height: 1;
	width: 22.5%;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
#type-compact dl.item-card dd .item-base ul.item-info li.model strong {
	font-size: 1.25em;
}
#type-compact dl.item-card dd .item-base ul.item-info li.pid {
	background-color: var(--color-orange) !important;
	border-radius: 5rem;
	color: #FFFFFF;
	font-size: 0.9em;
	font-weight: 700;
	padding: 0 1rem;
	width: fit-content;
}
#type-compact dl.item-card dd .item-base ul.item-info li.detail {
	margin: 0 0 0 auto;
}
#type-compact dl.item-card dd .item-base ul.item-info li.detail a {
	border-bottom: var(--color-green) 2px solid;
	color: var(--color-green);
	font-size: 0.9em;
	font-weight: 700;
	line-height: 1;
}
#type-compact dl.item-card dd .item-base ul.item-info li.detail a::before {
	content: "\f101";
	font-family: "Font Awesome 5 Free";
	font-size: 1.25em;
	margin-right: 0.25rem;
}
#type-compact dl.item-card dd .item-base p {
	border-bottom: var(--color-orange) 2px solid;
	font-size: 1.05em;
	font-weight: 900;
	margin: 0.75rem 0 1rem;
}
#type-compact dl.item-card dd .item-base ul.item-link {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;
	justify-content: space-evenly;
	list-style: none;
	margin: 0 auto;
	width: 100%;
}
#type-compact dl.item-card dd .item-base ul.item-link li {
	min-width: calc(35% - 2rem);
	width: fit-content;
}
#type-compact dl.item-card dd .item-base ul.item-link li a {
	background-color: var(--color-mikan);
	border-radius: 0.5rem;
	color: #FFFFFF;
	display: block;
	font-size: 1.15em;
	padding: 0.25rem 1rem;
	text-align: center;
	width: 100%;
}
#type-compact dl.item-card dd .item-base ul.item-link li a i {
	margin-right: 0.25rem;
}
@media screen and (max-width: 1024px) {
	#type-compact #type-compact-card {
		padding: 1.5rem 1.5rem 4.5rem;
		width: 98%;
	}
	#type-compact #type-compact-card h3 {
		font-size: 1.75em;
	}
	#type-compact dl.item-card {
		gap: 1rem;
		padding: 1.5rem;
		width: 98%;
	}
	#type-compact dl.item-card dt {
		width: 20%;
	}
	#type-compact dl.item-card dd {
		gap: 1rem;
	}
}
@media screen and (max-width: 667px) {
	#type-compact {
		margin: 4rem 0 0;
	}
	#type-compact #type-compact-card {
		padding: 1rem 1rem 3rem;
		width: 100%;
	}
	#type-compact dl.item-card {
		gap: 1rem;
		padding: 1rem;
		width: 100%;
	}
	#type-compact dl.item-card dd .item-base ul.item-link li a {
		font-size: 1em;
	}
}
@media screen and (max-width: 480px) {
	#type-compact #type-compact-card {
		margin: 1rem auto 0;
		padding: 1rem;
	}
	#type-compact #type-compact-card p {
		margin: 0 0 0.5rem;
	}
	#type-compact #type-compact-card ul {
		width: 100%;
	}
	#type-compact dl.item-card {
		margin: 0.5rem auto 0;
		justify-content: center;
	}
	#type-compact dl.item-card dt {
		width: 60%;
	}
	#type-compact dl.item-card dd {
		flex: none;
		width: 100%;
	}
	#type-compact dl.item-card dd .item-base ul.item-info {
		gap: 0;
		justify-content: space-between;
	}
	#type-compact dl.item-card dd .item-base ul.item-info li.model {
		width: auto;
	}
	#type-compact dl.item-card dd .item-base ul.item-info li.detail {
		margin: 0;
		text-align: right;
		width: 100%;
	}
	#type-compact dl.item-card dd .item-base p {
		margin: 0.25rem 0 0.75rem;
	}
	#type-compact dl.item-card dd .item-base ul.item-link li,
	#type-compact dl.item-card dd .item-base ul.item-link li a {
		width: 100%;
	}
}
/*-----------------------------------------
Link
-----------------------------------------*/
#link {
	margin: 8rem 0 4rem;
}
#link .base {
	border-top: var(--color-orange) 2px solid;
}
#link ul {
	display: flex;
	gap: 2rem;
	justify-content: space-evenly;
	list-style: none;
	margin: 0 auto;
	width: 98%;
}
#link p {
	padding: 2rem 0 0;
	text-align: center;
}
@media screen and (max-width: 667px) {
	#link {
		margin: 4rem 0 2rem;
	}
	#link ul {
		gap: 1rem;
	}
}
@media screen and (max-width: 480px) {
	#link ul {
		flex-direction: column;
		gap: 0.5rem;
	}
}