@charset "UTF-8";

/* ===============================
	サイト共通
=============================== */
/* カラー・スタイル設定 */
sup {
	color: #00a0e9;
}

em {
	font-style: normal;
	font-weight: bold;
}

/* 注釈コメマーク */
ul.ast li:BEFORE,
ul.star li span,
ul.star-double li span,
.color-star {
	color: #00a0e9;
}

/* 共通フッター */
aside.aside-container {
	background: #ebebeb;
}

/* ユーティリティ */
ul.horizon {
	display: flex;
	flex-wrap: wrap;
}

.caption {
	font-size: 1.24rem;
	line-height: 1.4;
}

.tc {
	text-align: center !important;
}

.tl {
	text-align: left !important;
}

.tr {
	text-align: right !important;
}

.red {
	color: red !important;
}

.blue {
	color: #00a0e9 !important;
}

.fs {
	font-size: 0.82em;
	line-height: 1.2;
}

.fxs {
	font-size: 0.77em;
	line-height: 1.2;
}

.fitImg img {
	width: 100%;
	height: auto;
}

.mt0 {
	margin-top: 0 !important;
}

.mt05em {
	margin-top: 0.5em;
}

.mt1em {
	margin-top: 1em;
}

.mt15em {
	margin-top: 1.5em;
}

.mt2em {
	margin-top: 2em;
}

.mt25em {
	margin-top: 2.5em;
}

.mt3em {
	margin-top: 3em;
}

/* Youtube 動画 */
.youtube {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

.youtube iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}

/* ===============================
	PC / Tab Style
=============================== */
@media print , screen and (min-width: 481px) {
	/* ユーティリティ */
	ul.star { /* リスト（青字・※n） */
		padding-left: 2em;
	}
	ul.star li {
		text-indent: -2em;
	}
	ul.star li span {
		margin-right: 0.5em;
	}
	ul.star-double { /* リスト（青字・※nn） */
		padding-left: 2.5em;
	}
	ul.star-double li {
		text-indent: -2.5em;
	}
	ul.star-double li span {
		margin-right: 0.5em;
	}
	ul.ast { /* リスト（青字・＊） */
		padding-left: 1.5em;
	}
	ul.ast li {
		text-indent: -1.5em;
	}
	ul.ast li:BEFORE {
		content: "\ff0a";
		margin-right: 0.5em;
	}
	ul.kome { /* リスト（黒字・※） */
		padding-left: 1.5em;
	}
	ul.kome li {
		text-indent: -1.5em;
	}
	ul.kome li:BEFORE {
		content: "\203b";
		margin-right: 0.5em;
	}
	ul.normal { /* リスト（・） */
		padding-left: 1.5em;
		list-style: none;
	}
	ul.normal li {
		text-indent: -1.5em;
	}
	ul.normal li:BEFORE {
		content: "\30fb";
		margin-right: 0.5em;
	}
	ul.disc { /* リスト（●） */
		padding-left: 1.5em;
	}
	ul.disc li {
		text-indent: -1.5em;
	}
	ul.disc li:BEFORE {
		content: "\25cf";
		margin-right: 0.5em;
	}
	ul.single { /* リスト（黒字・1文字） */
		padding-left: 1.5em;
	}
	ul.single li {
		text-indent: -1.5em;
	}
	ul.single li span {
		margin-right: 0.5em;
	}
	/* 共通フッターコンテナ */
	aside.aside-container {
		border-top: solid 1px #a3a4a3;
	}
	main aside.aside-container:first-of-type {
		border-top: none;
		-moz-box-shadow: 0 8px 8px -5px rgba(0, 0, 0, 0.35) inset;
		-webkit-box-shadow: 0 8px -5px 8px rgba(0, 0, 0, 0.35) inset;
		-o-box-shadow: 0 8px 8px -5px rgba(0, 0, 0, 0.35) inset;
		-ms-box-shadow: 0 8px 8px -5px rgba(0, 0, 0, 0.35) inset;
		box-shadow: 0 8px 8px -5px rgba(0, 0, 0, 0.35) inset;
	}
	aside .aside-title {
		font-size: 2.2rem;
		margin-bottom: 1em;
	}
	/* サポート */
	#footSupport {
		min-width: 980px;
		padding: 50px 0;
	}
	#footSupport ul.list-support {
		display: flex;
		flex-wrap: wrap;
		width: 100%;
	}
	#footSupport ul.list-support li {
		width: calc(100% / 4 - 3% );
		padding: 0.8em 1em;
		margin-top: 3rem;
		margin-left: 3%;
		background: #fff;
	}
	#footSupport ul.list-support li:nth-child(-n+4) {
		margin-top: 0;
	}
	#footSupport ul.list-support li:nth-child(4n-3) {
		margin-left: 0;
	}
	#footSupport ul.list-support li a {
		display: flex;
		align-items: center;
		width: 100%;
		height: 100%;
		font-size: 1.6rem;
		line-height: 1;
		text-decoration: none;
	}
	#footSupport ul.list-support li a i {
		font-size: 2.6em;
		color: #BFBFBF;
	}
	#footSupport ul.list-support li.catalog a i {
		font-size: 2.2em;
	}
	#footSupport ul.list-support li a i + span {
		margin-left: 0.8em;
		font-size: 1.6rem;
		font-weight: 500;
	}
	#footSupport ul.list-support li.normal a {
		padding-top: 20px;
		font-size: 1.6rem;
		line-height: 1.6;
	}
	/* 共通 - Footer ラインアップ */
	#footLineup {
		padding-top: 50px;
		padding-bottom: 60px;
	}
	#footLineup ul {
		display: flex;
		flex-wrap: wrap;
		color: #000;
	}
	#footLineup ul li a {
		display: block;
		margin: 1rem;
		text-decoration: none;
	}
	#footLineup .product-image {
		padding: 4%;
	}
	#footLineup .product-image img {
		width: 100%;
	}
	#footLineup .product-container {
		padding-left: 18%;
	}
	#footLineup .product-about {
		padding: 0.25em 0;
	}
	#footLineup .product-about .new {
		display: inline-block;
		padding: 0.25em 0.5em;
		margin-left: 0.5em;
	    font-size: 1.2rem;
		line-height: 1;
		background: #e50014;
		color: #fff;
		text-align: left;
	    font-weight: normal;
	}
	#footLineup .product-name {
		padding: 0.2em 0;
		font-size: 1.8rem;
		font-weight: bold;
		line-height: 1;
		color: #0c4c89;
	}
	#footLineup .product-name span {
		padding: 0 0.5em ;
		margin-left: 0.5em;
		font-size: 1.2rem;
		font-weight: normal;
		color: #fff;
		background: #e50014;
	}
	#footLineup .link-lineup-all {
		width: 400px;
		margin: 4rem auto 0;
	}
	#footLineup .link-lineup-all a {
		display: block;
		width: 100%;
		padding: 0.8em 0;
		font-size: 1.6rem;
		line-height: 1;
		font-weight: bold;
		background: #fff;
		color: #000;
		text-decoration: none;
		text-align: center;
		position: relative;
	}
	#footLineup .link-lineup-all a i.fa-angle-right {
	    position: absolute;
	    right: 1em;
	    top: 50%;
	    margin-top: -0.5em;
	}
	#footLineup .link-lineup-all a:hover {
		background: #000;
		color: #fff;
	}
	/* カルーセル設定 */
	#footLineup .footer-slick-lineup {
		padding: 0 14px;
	}
	#footLineup .slick-slide {
		width: calc(932px / 5);
	}
	#footLineup .slick-prev, #footLineup .slick-next {
		font-size: 0;
		line-height: 0;
		position: absolute;
		top: 50%;
		display: block;
		width: 12px;
		height: 42px;
		padding: 0;
		-webkit-transform: translate(0, -50%);
		-ms-transform: translate(0, -50%);
		transform: translate(0, -50%);
		cursor: pointer;
		color: transparent;
		border: none;
		outline: none;
		background: transparent;
	}
	#footLineup .slick-prev {
		left: 0;
		background: url(../images-old/slick-controls.png) no-repeat left top;
	}
	#footLineup .slick-next {
		right: 0;
		background: url(../images-old/slick-controls.png) no-repeat right top;
	}
	#footLineup .slick-prev:hover, #footLineup .slick-next:hover
		{
		opacity: 0.6
	}
	/* 共通 - Footer 関連コンテンツ */
	#footSpecialLinks {
		min-width: 980px;
		padding: 50px 0;
	}
	#footSpecialLinks .commingsoon,
	#footSpecialLinks a {
		display: block;
		margin: 1rem;
		color: #0c4c89;
		text-decoration: none;
	}
	#footSpecialLinks .special-name {
		margin-top: 0.5em;
	}
	#footSpecialLinks .text {
		margin-top: 0.5em;
		font-size: 1.2rem;
		color: #000;
	}
	/* カルーセル設定 */
	#footSpecialLinks .footer-slick-special {
		padding: 0 14px;
	}
	#footSpecialLinks .slick-slide {
		width: calc(932px / 4);
	}
	#footSpecialLinks .slick-prev, #footSpecialLinks .slick-next {
		font-size: 0;
		line-height: 0;
		position: absolute;
		top: 50%;
		display: block;
		width: 12px;
		height: 42px;
		padding: 0;
		-webkit-transform: translate(0, -50%);
		-ms-transform: translate(0, -50%);
		transform: translate(0, -50%);
		cursor: pointer;
		color: transparent;
		border: none;
		outline: none;
		background: transparent;
	}
	#footSpecialLinks .slick-prev {
		left: 0;
		background: url(../images-old/slick-controls.png) no-repeat left top;
	}
	#footSpecialLinks .slick-next {
		right: 0;
		background: url(../images-old/slick-controls.png) no-repeat right top;
	}
	#footSpecialLinks .slick-prev:hover, #footSpecialLinks .slick-next:hover
		{
		opacity: 0.6
	}
}

/* ===============================
	Mobile Style
=============================== */
@media screen and (max-width: 480px) {
	/* ユーティリティ */
	ul.star li span { /* リスト（青字・※n） */
		margin-right: 0.5em;
	}
	ul.star-double li span { /* リスト（青字・※nn） */
		margin-right: 0.5em;
	}
	ul.ast li:BEFORE { /* リスト（青字・＊） */
		content: "\ff0a";
		margin-right: 0.5em;
	}
	ul.kome li:BEFORE { /* リスト（黒字・※） */
		content: "\203b";
		margin-right: 0.5em;
	}
	ul.normal { /* リスト（・） */
		list-style: none;
	}
	ul.normal li:BEFORE {
		content: "\30fb";
		margin-right: 0.5em;
	}
	ul.disc li:BEFORE { /* リスト（●） */
		content: "\25cf";
		margin-right: 0.5em;
	}
	ul.single li span { /* リスト（黒字・1文字） */
		margin-right: 0.5em;
	}
	/* 共通フッターコンテナ */
	aside.aside-container {
		border-top: solid 1px #a3a4a3;
	}
	main aside.aside-container:first-of-type {
		border-top: none;
		-moz-box-shadow: 0 8px 8px -5px rgba(0, 0, 0, 0.35) inset;
		-webkit-box-shadow: 0 8px -5px 8px rgba(0, 0, 0, 0.35) inset;
		-o-box-shadow: 0 8px 8px -5px rgba(0, 0, 0, 0.35) inset;
		-ms-box-shadow: 0 8px 8px -5px rgba(0, 0, 0, 0.35) inset;
		box-shadow: 0 8px 8px -5px rgba(0, 0, 0, 0.35) inset;
	}
	aside .aside-title {
		font-size: 2.2rem;
		margin-bottom: 1.5em;
		text-align: center;
	}
	/* サポート */
	#footSupport {
		padding: 50px 0;
	}
	#footSupport ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#footSupport ul.list-support li {
		width: 47%;
		height: 5rem;
		margin-top: 1rem;
		padding: 1rem;
		background: #fff;
	}
	#footSupport ul.list-support li:nth-child(-n+2) {
		margin-top: 0;
	}
	#footSupport ul.list-support li a {
		display: flex;
		align-items: center;
		width: 100%;
		height: 100%;
		font-size: 1.4rem;
		line-height: 1;
		text-decoration: none;
	}
	#footSupport ul.list-support li a i {
		font-size: 2em;
		color: #BFBFBF;
	}
	#footSupport ul.list-support li.catalog a i {
		font-size: 1.8em;
	}
	#footSupport ul.list-support li a i + span {
		margin-left: 0.8em;
		font-weight: 500;
	}
	#footSupport ul.list-support li.normal a {
		padding-top: 20px;
		font-size: 1.6rem;
		line-height: 1.6;
	}
	/* 共通 - Footer ラインアップ */
	#footLineup {
		padding-top: 2em;
		padding-bottom: 3em;
	}
	#footLineup ul {
		display: flex;
		flex-wrap: wrap;
		color: #000;
	}
	#footLineup ul li a {
		display: block;
		margin: 1rem;
		text-decoration: none;
	}
	#footLineup .product-image {
		padding: 4%;
	}
	#footLineup .product-image img {
		width: 100%;
	}
	#footLineup .product-about {
		padding: 0.25em 0;
		font-size: 1.2rem;
	}
	#footLineup .product-about .new {
		display: inline-block;
		padding: 0.25em 0.5em;
		margin-left: 0.5em;
	    font-size: 1.2rem;
		line-height: 1;
		background: #e50014;
		color: #fff;
		text-align: left;
	    font-weight: normal;
	}
	#footLineup .product-name {
		padding: 0.2em 0;
		font-size: 1.4rem;
		font-weight: bold;
		line-height: 1;
		color: #0c4c89;
	}
	#footLineup .product-name span {
		padding: 0 0.5em ;
		margin-left: 0.5em;
		font-size: 1rem;
		font-weight: normal;
		color: #fff;
		background: #e50014;
	}
	#footLineup .link-lineup-all {
		margin-top: 2rem;
	}
	#footLineup .link-lineup-all a {
		display: block;
		width: 100%;
		padding: 0.8em 0;
		font-size: 1.6rem;
		line-height: 1;
		font-weight: bold;
		background: #fff;
		color: #000;
		text-decoration: none;
		text-align: center;
		position: relative;
	}
	#footLineup .link-lineup-all a i.fa-angle-right {
		position: absolute;
		right: 1em;
		top: 50%;
		margin-top: -0.5em;
	}
	/* カルーセル設定 */
	#footLineup .slick-prev, #footLineup .slick-next {
		font-size: 0;
		line-height: 0;
		position: absolute;
		top: 50%;
		display: block;
		width: 12px;
		height: 42px;
		padding: 0;
		-webkit-transform: translate(0, -50%);
		-ms-transform: translate(0, -50%);
		transform: translate(0, -50%);
		cursor: pointer;
		color: transparent;
		border: none;
		outline: none;
		background: transparent;
	}
	#footLineup .slick-prev {
		left: -1rem;
		background: url(../images-old/slick-controls.png) no-repeat left top;
	}
	#footLineup .slick-next {
		right: -1rem;
		background: url(../images-old/slick-controls.png) no-repeat right top;
	}
	#footLineup .slick-prev:hover, #footLineup .slick-next:hover
		{
		opacity: 0.6
	}
	/* 共通 - Footer 関連コンテンツ */
	#footSpecialLinks {
		padding: 50px 0;
	}
	#footSpecialLinks .commingsoon,
	#footSpecialLinks a {
		display: block;
		margin: 1rem;
		color: #0c4c89;
		text-decoration: none;
	}
	#footSpecialLinks .special-name {
		margin-top: 0.5em;
	}
	#footSpecialLinks .text {
		margin-top: 0.5em;
		font-size: 1.2rem;
		color: #000;
	}
	/* カルーセル設定 */
	#footSpecialLinks .slick-prev, #footSpecialLinks .slick-next {
		font-size: 0;
		line-height: 0;
		position: absolute;
		top: 50%;
		display: block;
		width: 12px;
		height: 42px;
		padding: 0;
		-webkit-transform: translate(0, -50%);
		-ms-transform: translate(0, -50%);
		transform: translate(0, -50%);
		cursor: pointer;
		color: transparent;
		border: none;
		outline: none;
		background: transparent;
	}
	#footSpecialLinks .slick-prev {
		left: -1rem;
		background: url(../images-old/slick-controls.png) no-repeat left top;
	}
	#footSpecialLinks .slick-next {
		right: -1rem;
		background: url(../images-old/slick-controls.png) no-repeat right top;
	}
	#footSpecialLinks .slick-prev:hover, #footSpecialLinks .slick-next:hover
		{
		opacity: 0.6
	}
}

/* ===============================
	screen setting
=============================== */
@media screen {
	/* Loading */
	#pageLoad {
		width: 100vw;
		height: 100vh;
		background-color: #fff;
		position: fixed;
		z-index: 999;
	}
	#pageLoad.loading {
		background-image: url(../images-old/pageloading.gif);
		background-position: center center;
		background-repeat: no-repeat;
	}
	/* pageTop */
	a#pageTop {
		width: 50px;
		height: 50px;
		background-image: url(../images-old/pagetop.png);
		background-repeat: no-repeat;
		overflow: hidden;
		text-indent: 100%;
		white-space: nowrap;
		text-decoration: none;
		position: fixed;
		bottom: 20px;
		right: 0;
		display: none;
	}
	a#pageTop:hover {
		background-position: 0 bottom;
	}
	.fix {
		position: fixed !important;
	}
}

/* ===============================
	print setting
=============================== */
@media print {
	a#pageTop {
		display: none !important;
	}
	.printNewPage {
		page-break-before: always;
	}
}