@charset "UTF-8";
/* =================================================================== file name  : xxx.css
=================================================================== */
.con-products { max-width: 1120px; margin: auto; }
@media only screen and (min-width: 1025px) and (max-width: 1120px) { .con-products { width: 95%; } }
@media print { .con-products { width: 95%; } }
.ie8 .con-products { width: 95%; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-products { width: 92%; } }
@media only screen and (max-width: 767px) { .con-products { width: 83%; } }

/*Animate */
/* -----------------------------------------------------------
	.con-products
----------------------------------------------------------- */
.con-products { padding-bottom: 160px; }
@media only screen and (max-width: 767px) { .con-products { padding-bottom: 20%; } }
.con-products h2 { border-bottom: 1px solid #000; padding-top: 90px; font-size: 2.6rem; letter-spacing: 0.04em; text-align: center; line-height: 1; padding-bottom: 16px; margin-bottom: 64px; }
@media only screen and (max-width: 767px) { .con-products h2 { padding-top: 15%; font-size: 2rem; padding-bottom: 8px; margin-bottom: 24px; }
  .con-products h2.tl-solution { margin-top: 20%; } }
.con-products .box-products { max-width: 980px; margin: 0 auto; }
@media only screen and (min-width: 768px) { .con-products .box-products { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; } }
@media print { .con-products .box-products { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; } }
.ie8 .con-products .box-products { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; }
@media only screen and (min-width: 768px) { .con-products .box-products .box { width: 47%; } }
@media print { .con-products .box-products .box { width: 47%; } }
.ie8 .con-products .box-products .box { width: 47%; }
@media only screen and (max-width: 767px) { .con-products .box-products .box:first-child { margin-bottom: 25%; } }
.con-products .box-products .box h3 { background: #bf1443; color: #fff; font-size: 2.6rem; text-align: center; padding: 0.15em; }
@media only screen and (max-width: 767px) { .con-products .box-products .box h3 { font-size: 2rem; padding: 0.5em; } }
.con-products .box-products .box .img { text-align: center; margin: 50px auto; max-width: 390px; }
@media only screen and (max-width: 767px) { .con-products .box-products .box .img { margin: 10% auto; } }
.con-products .box-products .box .box-txt { line-height: 1.647; }
.con-products .box-products .box .box-txt h4 { margin-bottom: 1em; }
.con-products .box-products .box .box-txt > ul { margin-bottom: 50px; }
@media only screen and (max-width: 767px) { .con-products .box-products .box .box-txt > ul { margin-bottom: 10%; } }
.con-products .box-products .box .box-txt > ul > li p { position: relative; padding-left: 0.8em; }
.con-products .box-products .box .box-txt > ul > li p:before { content: "●"; position: absolute; top: 0; left: 0; }
.con-products .box-products .box .box-txt > ul > li ul { padding-left: 4rem; }
.con-products .box-products .box .box-txt > ul > li ul li { position: relative; padding-left: 0.8em; }
.con-products .box-products .box .box-txt > ul > li ul li:before { content: "●"; position: absolute; top: 0; left: 0; }
.con-products .box-products .box .box-txt .btn a { display: block; width: 100%; background: #bf1443; color: #fff; text-align: center; font-size: 2.6rem; padding: 2rem; position: relative; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
@media only screen and (min-width: 1025px) { .con-products .box-products .box .box-txt .btn a:hover { background: #000; } }
@media print { .con-products .box-products .box .box-txt .btn a:hover { background: #000; } }
.ie8 .con-products .box-products .box .box-txt .btn a:hover { background: #000; }
.con-products .box-products .box .box-txt .btn a:after { content: ""; width: 0; height: 0; border-style: solid; border-width: 5px 0 5px 8px; border-color: transparent transparent transparent #fff; position: absolute; top: 50%; right: 20px; margin-top: -4px; }
.con-products .box-products .box .box-txt .txt-lnk { margin-top: 24px; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-products .box-products .box .box-txt .txt-lnk { width: 90%; line-height: 1.3; } }
@media only screen and (max-width: 1024px) { .con-products .box-products .box .box-txt .txt-lnk { margin-top: 8px; } }
.con-products .box-products .box .box-txt .txt-lnk a { display: inline-block; position: relative; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
@media only screen and (min-width: 1025px) { .con-products .box-products .box .box-txt .txt-lnk a:hover:before { width: 100%; } }
@media print { .con-products .box-products .box .box-txt .txt-lnk a:hover:before { width: 100%; } }
.ie8 .con-products .box-products .box .box-txt .txt-lnk a:hover:before { width: 100%; }
.con-products .box-products .box .box-txt .txt-lnk a:before { content: ""; background: #bf1443; width: 0; height: 2px; position: absolute; bottom: 0; left: 0; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
.con-products .box-products .box .box-txt .txt-lnk a:after { content: ""; background: url(../images/products/ic_lnk.svg) 0 0 no-repeat; background-size: contain; width: 8px; height: 8px; position: absolute; right: -1em; top: 50%; margin-top: -4px; }
@media only screen and (min-width: 1025px) { .con-products .cta-products .btn { width: 50%; margin: 2rem auto; } }
@media print { .con-products .cta-products .btn { width: 50%; margin: 2rem auto; } }
.ie8 .con-products .cta-products .btn { width: 50%; margin: 2rem auto; }
.con-products .cta-products .btn a { display: block; width: 100%; background: #bf1443; color: #fff; text-align: center; font-size: 2.6rem; padding: 2rem; position: relative; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
@media only screen and (min-width: 1025px) { .con-products .cta-products .btn a:hover { background: #000; } }
@media print { .con-products .cta-products .btn a:hover { background: #000; } }
.ie8 .con-products .cta-products .btn a:hover { background: #000; }
.con-products .cta-products .btn a:after { content: ""; width: 0; height: 0; border-style: solid; border-width: 5px 0 5px 8px; border-color: transparent transparent transparent #fff; position: absolute; top: 50%; right: 20px; margin-top: -4px; }
@media only screen and (min-width: 768px) { .con-products .box-solution { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; } }
@media print { .con-products .box-solution { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; } }
.ie8 .con-products .box-solution { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; }
@media only screen and (min-width: 768px) { .con-products .box-solution li { width: 48%; } }
@media print { .con-products .box-solution li { width: 48%; } }
.ie8 .con-products .box-solution li { width: 48%; }
@media only screen and (max-width: 767px) { .con-products .box-solution li:first-child { margin-bottom: 10%; } }
.con-products .box-solution li a { -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
@media only screen and (min-width: 1025px) { .con-products .box-solution li a:hover .img { opacity: 0.6; }
  .con-products .box-solution li a:hover .txt:before { width: 100%; } }
@media print { .con-products .box-solution li a:hover .img { opacity: 0.6; }
  .con-products .box-solution li a:hover .txt:before { width: 100%; } }
.ie8 .con-products .box-solution li a:hover .img { opacity: 0.6; }
.ie8 .con-products .box-solution li a:hover .txt:before { width: 100%; }
.con-products .box-solution li a .img { border: 1px solid #bfc0c0; padding: 10px; width: 100%; text-align: center; margin-bottom: 16px; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
@media only screen and (max-width: 767px) { .con-products .box-solution li a .img { margin-bottom: 6px; } }
.con-products .box-solution li a .img img { max-height: 96px; }
.con-products .box-solution li a .txt { text-align: left; display: inline-block; position: relative; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
.con-products .box-solution li a .txt:before { content: ""; background: #bf1443; width: 0; height: 2px; position: absolute; bottom: 0; left: 0; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
.con-products .box-solution li a .txt:after { content: ""; background: url(../images/products/ic_lnk.svg) 0 0 no-repeat; background-size: contain; width: 8px; height: 8px; position: absolute; right: -1em; top: 50%; margin-top: -4px; }
