@charset "utf-8";
/*============================================================
layout 2015/8/7
	1.Reset
	2.Base
	3.Layout
	4.Module
	5.Print
============================================================*/
/*========== 1.Reset ==========*/
li.last{ margin-right:0 !important;}
h1,h2,h3,h4,h5,h6{ font-weight:normal;}
/*========== 2.Base ==========*/
#headerIn,
#footerIn,
#contents,
#pageTitle h1{
	width:960px;
	margin:0 auto;
	}
img{vertical-align:bottom;}

/*----- ico base -----*/
.btnBasic01:before{
	display: inline-block;
	vertical-align: middle;
	content: "";
	overflow: hidden;
	background: url(/lp/product/shared/images/ico_common.png) no-repeat 0 0;
}
*:before{margin-right: 7px;}
*:after{ margin-left:7px;}

/*----- baseFont -----*/
html{
	font-size:62.5%;
	max-height: 100%;
}
body {
	font-family: Verdana, "游ゴシック", YuGothic, /*"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", */"メイリオ", Meiryo, sans-serif;
	font-size:14px;/*for IE*/ font-size:1.4em;
	line-height: 1.5;
	color: #333;
}
.fontCol{	color: #333;}
/*----- Anchor -----*/
a,
.linkCol {
	color:#000ebb;
	text-decoration:none;
}
a img {border:0;}
a:visited {}
a:hover {
	text-decoration:underline;
}
a:hover img{
	-ms-filter:"alpha(opacity=70)";
	opacity:0.7;
}

a:active {}
a:focus {}

/*========== 3.Layout ==========*/
#header,
#footer{ background:#111987; }

/*----- header -----*/
#headerIn{padding:5px 0;	}
#header .logo{ margin-bottom:20px;}


/*----- pageTitle -----*/
#pageTitle{
	margin:80px 0 50px;
	text-align:center;
	}

/*----- contents -----*/
#contents{ margin-bottom:150px; }
/*----- main -----*/
#main{padding-bottom:30px;}


/*----- pageTop -----*/
.pageTop {
	position: fixed;
	width:50px; height:50px;
	right: 0; bottom: 0;
	display:none;
	margin:0;
}
.pageTop a{ display:block;}

/*----- footer -----*/
#footer{
	width:100%;
	 /* position:fixed; */
	 left:0; bottom:0;}
#footerIn{ padding:20px 0;}

/*----- heading -----*/
.unit .heading01,
.unit .heading02{	margin-top:0;}
.heading01{
	color:#FFF;
	font-size:20px;/*for IE*/ font-size:2rem;
	border-radius: 5px;
	padding:10px 10px;
	margin:50px 0 20px;
	background: #111987;
	}
	table + .heading01{	margin-top:70px;}
.heading02{
	font-size:20px;/*for IE*/ font-size:2rem;
	line-height:1.5;
	border-bottom:solid 2px #41479f;
	padding-bottom:5px;
	margin:40px 0 10px;
	display:inline-block;
	}
	.heading01 +.heading02{ margin-top:0;}
	.text .heading02{	margin-top:1em;}
.heading03{
	font-size:16px;/*for IE*/ font-size:1.6rem;
	color:#000;
	background:#f2f4f3;
	margin-bottom:10px;
	padding:3px 5px;
	border-radius:2px;
	}
.heading04{
	font-size:14px;/*for IE*/ font-size:1.4rem;
	font-weight:bold;
	margin-bottom:5px;
	}
	.heading04 + p{	margin-top:0;}
	p + .heading04{	margin-top:1.5em;}
/*========== 4.Module ==========*/
/*----- Listing -----*/
.ul_basic01,
.ol_basic01,
ul.annotation,
ol.parenthesis-decimal{
	margin:1.25em 0;
	padding-left:30px;
	}
.ul_basic01 li,
.ol_basic01 li,
ul.annotation li,
ol.parenthesis-decimal li{
	margin-bottom:0.5em;
	}
.ul_basic01 li.last,
.ol_basic01 li.last,
ul.annotation li.last,
ol.parenthesis-decimal li.last {
	margin-bottom:0;
	}
/* Annotation */
ul.annotation{
	margin-left:0;
	padding-left:0;
	}
ul.annotation li {
	font-size:12px;/*for IE*/ font-size:1.2rem;
	list-style:none;
	padding-left:1em;
	text-indent:-1em;
}
/* ul.annotation.decimal */
ul.annotation.decimal li {
	padding-left:2.5em;
	text-indent:-2.5em;
	margin-bottom:0;
}
/*ol*/
ol.parenthesis-decimal ul li,
ol.parenthesis-decimal ol li,
ol.symbol ul li,
ol.symbol ol li {
	padding-left:0;
	text-indent:0;
	margin:0 0 0.75em 0;
}
ol.parenthesis-decimal ul li,
ol.symbol ul li{ list-style:disc;}
ol.parenthesis-decimal ol li,
ol.symbol ol li { list-style:decimal;}
ol.parenthesis-decimal ul.disc li,
ol.symbol ul.disc li {
	padding-left:15px;
}
/* parenthesis*/
ol.parenthesis-decimal { padding-left:0.5em;}
ol.parenthesis-decimal li {
	list-style-type:none;
	margin-left:-1em;
	padding-left:2.5em;
	text-indent:-2.5em;
}
/* symbol*/
ol.symbol { padding-left:0;}
ol.symbol li {
	list-style-type:none;
	margin-left:0;
	padding-left:1.5em;
	text-indent:-1.5em;
}
ol.symbol li span:first-child{ margin-right:0.5em;}

/*dl_basic01*/
dl.dl_basic01{ line-height:1.3em;}
dl.dl_basic01 dt{}
dl.dl_basic01 dd:before{ content:"：";}
dl.dl_basic01 dd{
		margin:-1.3em 0 0.5em 10em;
		text-indent:-1.5em;
}
/*dl_table01*/
.dl_table01 {
	margin:0;	padding: 0;
	overflow:hidden;
	background:#f2f4f3;
	}

.dl_table01 dt,
.dl_table01 dd {	padding: 8px;}

.dl_table01 dt {
	clear: left;
	float: left;
	width: 6em;
}
.dl_table01 dd {
	background:#FFF;
	margin:0 0 0 6em;}


/* fileList*/
dl.fileList01,
dl.fileList02{ padding:1em 0.5em;}
dl.fileList01 dt{}
dl.fileList01 dd,
dl.fileList02 dd{
	margin:-1.8em 0 1.7em 0;
	padding:0 0 0.8em 10em;
	text-indent:-23px;
	border-bottom:solid 1px #CCC;
	}
dl.fileList02 dd{
	padding:0 0 0.8em 12em;
}
/*qaList*/
dl.qaList{ margin-left:1em;}
dl.qaList dt{
	color:#000ebb;
	cursor:pointer;
	margin-bottom:0.3em;
	padding:5px 0;
	}
	dl.qaList dt.fwB,
	dl.qaList dt:hover{
		color:#333;
		}
	dl.qaList dt:before{
	font-size:16px;/*for IE*/ font-size:1.6rem;
	color:#FFF;
	background:#999;
	padding:0px 6px 4px;
	margin-right:10px;
	border-radius: 16px;
		content:"Q";
		}
dl.qaList dd{
	margin-bottom:1.5em;
	}

/* Link
--------------------*/
ul.links,
ul.linksSide{
	margin:1.25em 0;
	padding-left:0.5em;
}
ul.links li{
	margin-bottom:0.75em;
	list-style-type:none;
	}
ul.linksSide li{
	margin:0 2em 0.75em 0;
	list-style-type:none;
	display:inline-block;
	}
.pageLinks{
	margin-bottom:60px;
	padding:10px;
	border:solid 1px #CCC;
	border-radius: 5px;
}
/*----- Table -----*/
table,th,td{
	border-collapse:collapse;
	border:1px solid #e0e0e0;
	}
table{
	width:100%;
	border-collapse:collapse;
}
th,td{ line-height:1.6;}
th{
	font-weight:normal;
	padding:8px;
	text-align:left;
	background:#F4F5FE;
}
td{
	padding:8px 8px 8px 12px;
	background:#FFF;
}
	table.sp01 th,
	table.sp01 td{
		padding:5px;
	line-height:1.4;
	}
		table.sp01 td ul{
			margin-right:1em;
		}
caption{
	font-size:16px;/*for IE*/ font-size:1.6rem;
	margin:1em 0 0.5em;
	 }
caption:before{ content:"＜";}
caption:after{ content:"＞";}

.table_basic01 thead th,
.table_basic03 thead th {
	line-height:1.4;
	text-align:center;
	color:#fff;
	background-color:#8c90cc;
}
/* .table_basic02 */
.table_basic02 {
	border-right-style: none;
	border-left-style: none;
}
.table_basic02 th {
	padding-left:10px;
	border-right-style: none;
	border-left-style: none;
	background-color:#F4F5FE;
}
.table_basic02 td {	border-right-style: none;}
/* .table_basic03 */
.table_basic03 tr.even td{	background:#f2f4f3;}

.tableCol01{color:#FFF; background:#8c90cc;}
.tableCol02{	background:#F4F5FE;}
.tableCol03{	background:#f2f4f3;}
.tableC{
	margin-left: auto;
	 margin-right: auto;
	 width:auto;
 }
/*----- Images -----*/
/* Caption */
.images .figHeading{font-size:16px;/*for IE*/ font-size:1.6rem;}
.images .figHeading:before{ content:"＜";}
.images .figHeading:after{ content:"＞";}
.images .caption {
	margin:8px 0 0;
	font-size:12px;/*for IE*/ font-size:1.2rem;
	line-height:1.4;
}
/*imgUnit*/
.imgUnitL,
.imgUnitR{ overflow:hidden;}
.imgUnitL div.text {float:right;}
.imgUnitL div.images {float:left;}
.imgUnitR div.text {float:left;}
.imgUnitR div.images {float:right;}
.imgSizeReader{ border-bottom:solid 1px #CCC;}

/*imagesSize*/
.imgSizeS div.images{width:240px;}
.imgSizeM div.images{width:350px;}
.imgSizeL div.images{width:450px;}

/*textSize*/
.imgSizeS div.text{width:650px;}
.imgSizeM div.text{width:540px;}
.imgSizeL div.text{width:440px;}

/* ImgBorder */
img.border {border:1px solid #CCC;}

/*----- Section -----*/
.unit{ overflow:hidden; padding:0 20px;}
.column2,
.column3,
.column4{
	float:left;
	}
	.column2.last,
	.column3.last,
	.column4.last	{
		margin-right:0;
		}
.column2{
	width:440px;
	margin-right:40px;
	}
.column3{
	width:285px;
	margin-right:30px;
	}
.column4{
	width:205px;
	margin-right:30px;
	}

/*----- button -----*/
.btnBasic01,
.btnBasic02{
	display:inline-block;
	padding:0.7em 1.5em;
	border-radius: 5px;
	border-right:solid 3px #d4d4d4;
	border-bottom:solid 3px #d4d4d4;
	}
.btnBasic01:hover,
.btnBasic02:hover{
		margin:2px 0 0 2px;
		text-decoration:none;
		border-right:solid 1px #d4d4d4;
		border-bottom:solid 1px #d4d4d4;
}
.btnBasic01{
	color:#FFF;
	background:#111987;
	}
	.btnBasic01:before{
		width:14px; height:14px;
		background-position:-15px -19px;
	}
.btnBasic02{
	background:#FFF;
		border-top:solid 1px #d4d4d4;
		border-left:solid 1px #d4d4d4;
	}
	.btnBasic02:hover{
		background:#f4f5fe;
		 }
/*----- icon -----*/
.icoPDF:before,
.icoDOC:before,
.icoXLS:before,
.icoLink01:before,
.icoLink02:before,
.icoLink03:before,
.icoLink04:before,
.icoBlank01:before,
.icoDl01:before{
	display: inline-block;
	vertical-align: middle;
	content: "";
	overflow: hidden;
	background: url(/lp/product/shared/images/ico_common.png) no-repeat 0 0;
}

.icoPDF,
.icoDOC,
.icoXLS,
.icoLink01,
.icoBlank01,
.icoDl01{
	list-style:none;
}
.icoPDF span,
.icoDOC span,
.icoXLS span{
	font-size:12px;/*for IE*/ font-size:1.2rem;
	}
.icoPDF:before,
.icoDOC:before,
.icoXLS:before{
	background-position:0 -35px !important;
	width:16px; height:16px;
}
.icoDOC:before{	background-position:-16px -35px !important;	}
.icoXLS:before{	background-position:-32px -35px !important;	}

.icoLink01,
.icoLink02,
.icoBlank01,
.icoDl01{
	display:block;
	text-indent:-21px;
	padding-left:21px;
	}
.icoLink04{ margin-right:5px;}
.icoLink01:before{
	width:14px; height:14px;
	background-position:0 -19px;
	}
.icoLink02:before{
	width:14px; height:14px;
	background-position:-30px -19px;
	}
.icoLink03:before{
	width:11px; height:6px;
	}
.icoLink04:before{
	width:3px; height:5px;
	margin-left:5px;
	background-position:-47px -24px;
	}

.icoBlank01:before{
	width:16px; height:12px;
	background-position:0 -53px;
	}
.icoDl01{ margin-bottom:0.5em;}
	.icoDl01:before{
		width:13px; height:12px;
		background-position:0 -65px;
		}
/*----- Border -----*/
.borderT{ border-top:solid 1px #CCC;}
.borderB{ border-bottom:solid 1px #CCC;}

.anki img{ margin-right:20px;}
/*========== 5.Print ==========*/
@media print {
	.pageTop,.pageTop a{
		display: none;
	}
}

/*========== overwrite ==========*/
body{
	font-family:Arial, sans-serif;
	}


/* ==================================================================

カタログ

================================================================== */
:root {
--color-main: #111987;
  --color-line: #D9D9D9;

}
.catalogList {
  display: flex;
  justify-content: center;
  align-items: start;
  gap: 20px;
  padding: 0;
  list-style: none;
}
.catalogItem {
}
.catalogItem .-imgAndBtn {
  position: relative;
}
.catalogItem .-imgAndBtn figure {
  border: 1px solid var(--color-line);
  background: #F5F5F5;
  aspect-ratio: 1/1.4;
  max-width: 286px;
  margin: 0;
}
.catalogItem .-imgAndBtn figure img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 960px) {
  .catalogItem .-imgAndBtn figure::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    opacity: 0;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
  }
}
.catalogItem .-imgAndBtn .-btnBox {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
}
@media screen and (min-width: 960px) {
  .catalogItem .-imgAndBtn .-btnBox {
    grid-template-columns: repeat(2, 70px);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    opacity: 0;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
  }
}
.catalogItem .-imgAndBtn .-btnBox a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  background: var(--color-main);
  padding: 10px;
  box-sizing: border-box;
}
@media screen and (min-width: 960px) {
  .catalogItem .-imgAndBtn .-btnBox a {
    width: 70px;
    height: 70px;
    border-radius: 9999px;
    background: #fff;
  }
}
.catalogItem .-imgAndBtn .-btnBox a .c-icon-svg {
  color: #fff;
  width: 25px;
  height: 25px;
}
@media screen and (min-width: 960px) {
  .catalogItem .-imgAndBtn .-btnBox a .c-icon-svg {
    width: 35px;
    height: 35px;
    color: var(--color-main);
  }
}
@media screen and (min-width: 960px) {
  .catalogItem .-imgAndBtn .-btnBox a:hover {
    background: var(--color-main);
  }
  .catalogItem .-imgAndBtn .-btnBox a:hover .c-icon-svg {
    color: #fff;
  }
}
@media screen and (min-width: 960px) {
  .catalogItem .-imgAndBtn:hover figure::after {
    opacity: 1;
  }
  .catalogItem .-imgAndBtn:hover .-btnBox {
    opacity: 1;
  }
}
.catalogItem .-name {
  text-align: center;
  margin-top: 5px;
}

/* ==================================================================

cookieバナー

================================================================== */
.l-cookie-bnr {
--color-main: #111987;
--color-font: #272727;
--font-b: 700;

  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 99999;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
@media screen and (min-width: 768px) {
  .l-cookie-bnr {
    max-width: 400px;
  }
}
.l-cookie-bnr__inner {
  background: #F6F6F6;
  padding: 30px 10px 20px;
  position: relative;
}
@media screen and (min-width: 768px) {
  .l-cookie-bnr__inner {
    padding: 30px 20px;
  }
}
.l-cookie-bnr__txt {
  font-size: 12px;
}
.l-cookie-bnr__txt a {
  text-decoration: underline;
}
@media screen and (min-width: 768px) {
  .l-cookie-bnr__txt {
    font-size: 14px;
  }
}
.l-cookie-bnr__btn.-close {
  display: block;
  width: 10px;
  aspect-ratio: 1/1;
  position: absolute;
  top: 10px;
  right: 10px;
  border: none;
  cursor: pointer;
}
@media screen and (min-width: 960px) {
  .l-cookie-bnr__btn.-close {
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
    -webkit-transition: none;
    transition: none;
  }
  .l-cookie-bnr__btn.-close:hover {
    opacity: 0.7;
  }
}
.l-cookie-bnr__btn.-close::before, .l-cookie-bnr__btn.-close::after {
  content: "";
  display: block;
  height: 1px;
  width: 10px;
  background: var(--color-font);
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
          transform: translate(-50%, -50%) rotate(45deg);
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0;
}
.l-cookie-bnr__btn.-close::after {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
          transform: translate(-50%, -50%) rotate(-45deg);
}
.l-cookie-bnr__btn.-primary {
  display: block;
  min-width: 160px;
  margin: 10px auto 0;
  padding: 10px 20px;
  background: var(--color-main);
  color: #fff;
  font-weight: var(--font-b);
  text-align: center;
  border-radius: 5px;
border: none;
cursor: pointer;
}
@media screen and (min-width: 960px) {
  .l-cookie-bnr__btn.-primary {
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
    -webkit-transition: none;
    transition: none;
  }
  .l-cookie-bnr__btn.-primary:hover {
    opacity: 0.7;
  }
}
@media screen and (min-width: 768px) {
  .l-cookie-bnr__btn.-primary {
    margin-top: 20px;
  }
}
