@charset "UTF-8";
/*日本語*/
@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;700&display=swap");
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("fonts/NotoSansCJKjp-DemiLight-sub-j1.woff") format("woff");
}
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/NotoSansCJKjp-Regular-sub-j1.woff") format("woff");
}
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/NotoSansCJKjp-Medium-sub-j1.woff") format("woff");
}
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/NotoSansCJKjp-Bold-sub-j1.woff") format("woff");
}
/*日本語*/
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("fonts/NotoSansCJKjp-DemiLight-sub-j1.woff") format("woff");
}
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/NotoSansCJKjp-Regular-sub-j1.woff") format("woff");
}
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/NotoSansCJKjp-Medium-sub-j1.woff") format("woff");
}
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/NotoSansCJKjp-Bold-sub-j1.woff") format("woff");
}
html {
  overflow-y: scroll;
}

/*
body{
	-webkit-text-size-adjust:none;
//	color:$black;
//	margin:0;padding:0;
	background:$bg_color;
//	font-size:16px;
//	font-weight:400;
//	font-family:"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HiraMinProN-W3","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","Noto Serif JP",YuMincho,"Yu Mincho","游明朝",serif;
//	font-family:"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","HiraKakuProN-W3","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Noto Sans JP","YuGothic,"Yu Gothic","游ゴシック","メイリオ","ＭＳ Ｐゴシック",sans-serif;
//	font-family:"Noto Sans JP","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","HiraKakuProN-W3","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","YuGothic","Yu Gothic","游ゴシック","メイリオ","ＭＳ Ｐゴシック",sans-serif;
//	font-family:"メイリオ","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","HiraKakuProN-W3","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Noto Sans JP","YuGothic","Yu Gothic","游ゴシック","ＭＳ Ｐゴシック",sans-serif;

	word-break: normal;
	word-wrap: break-word;
    letter-spacing:0.05em;
//	overflow:hidden;
	@include breakpoint{
//		font-size:3.3vw;
	}

}

//*{margin:0;padding:0;line-height:1.1;box-sizing:border-box;}
//ul,li,dl,dt{list-style-type:none;}
//img{vertical-align:middle;border:none;}
p,dt,dd,li{text-align:justify;text-justify:initial;}
.alignCenter{text-align:center;}
.backToTop{text-align:right;margin:25px 20px 15px 0;}
img.fitImg{max-width:100%;height:auto;}
br{line-height:1;}
a,
a:link,
a:visited,
a:hover,
a:active{
    text-decoration:none;
    outline:none;
//    color:inherit;
}
*/
.inner1440 {
  width: 1440px;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 1440px) {
  .inner1440 {
    /*		overflow:hidden;*/
    width: 100%;
  }
}

.inner1200 {
  width: 1200px;
  margin: 0 auto;
  position: relative;
  /*	overflow:hidden;*/
}
@media screen and (max-width: 1200px) {
  .inner1200 {
    width: 100%;
  }
}

.inner {
  width: 1200px;
  margin: 0 auto;
  position: relative;
  /*	overflow:hidden;*/
}
@media screen and (max-width: 1200px) {
  .inner {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .inner {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .pc-br,
.is-pc {
    display: none;
  }
}

.sp-br,
.is-sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .sp-br,
.is-sp {
    display: block;
  }
}

.nowrap {
  white-space: nowrap;
}

.lt-robo_con400 {
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
}

.lt-robo_con700 {
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
}


/*-------------------------------------------------------------------------------------


ここから、このLPのスタイル


--------------------------------------------------------------------------------------*/
body {
  margin: 0;
  padding: 0;
/*  font-family: "メイリオ", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "HiraKakuProN-W3", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Noto Sans JP", "YuGothic", "Yu Gothic", "游ゴシック", "ＭＳ Ｐゴシック", sans-serif; */
}

.lp-mv *,
.lp-contents * {
  line-height: 1.1;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.lp-mv ul, .lp-mv li, .lp-mv dl, .lp-mv dt,
.lp-contents ul,
.lp-contents li,
.lp-contents dl,
.lp-contents dt {
  list-style-type: none;
}
.lp-mv img,
.lp-contents img {
  vertical-align: middle;
  border: none;
}
.lp-mv br,
.lp-contents br {
  line-height: 1;
}
.lp-mv p, .lp-mv dt, .lp-mv dd, .lp-mv li,
.lp-contents p,
.lp-contents dt,
.lp-contents dd,
.lp-contents li {
  text-align: justify;
  text-justify: initial;
}
.lp-mv a,
.lp-mv a:link,
.lp-mv a:visited,
.lp-mv a:hover,
.lp-mv a:active,
.lp-contents a,
.lp-contents a:link,
.lp-contents a:visited,
.lp-contents a:hover,
.lp-contents a:active {
  text-decoration: none;
  outline: none;
}

/*-----------------------------------------------

MV

-------------------------------------------------*/
.lp-mv {
  width: 100%;
  position: relative;
  overflow: hidden;
  font-size: 16px;
  color: #252525;
  font-weight: 400;
  letter-spacing: 0.05em;
}

.lp-mv-pc {
  position: relative;
  left: calc(50% - 960px);
}

.lp-mv-inner {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}

/* 追加 */
.lp-mv-img {
	max-width: initial !important;
	height: auto !important;
}
@media screen and (max-width: 615px) {
	.lp-mv-img {
	 height: 410px !important;
	}
}

.lp-mv-info {
  width: 965px;
  margin: 0 auto;
  padding-top: 104px;
}
@media screen and (max-width: 994px) {
  .lp-mv-info {
    width: calc(100% - 30px);
  }
}

.lp-mv-catch {
  font-size: 16px;
  color: #fff;
}
.lp-mv-catch span {
  display: inline-block;
  position: relative;
}
.lp-mv-catch span:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 100%;
  height: 0;
  border-top: 1px solid #fff;
}

.lp-mv-headline {
  padding-top: 50px;
  font-size: 54px;
  font-weight: 700;
  letter-spacing: 0.025em;
  color: #fff;
}
.lp-mv-headline span {
  display: block;
  padding-bottom: 28px;
  font-size: 24px;
  font-weight: 400;
}
.lp-mv-label {
  width: 100%;
  padding-top: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
}
.lp-mv-label span {
  display: inline-block;
  padding: 8px 28px 8px 30px;
}
.lp-mv-label span.is-precision {
  background: url(../images/icon_check.png) no-repeat left center;
  background-size: 20px 20px;
}
.lp-mv-label span.is-speed {
  background: url(../images/icon_speed.png) no-repeat left center;
  background-size: 25px 20px;
}
.lp-mv-label span.is-tatch {
  background: url(../images/icon_tatch.png) no-repeat left center;
  background-size: 18px 28px;
}
@media screen and (max-width: 615px) {
	.lp-mv-headline {
	  padding-top: 18px;
	  font-size: 29px;
	}
	.lp-mv-headline span {
	  padding-bottom: 10px;
	  font-size: 19px;
	}
	.lp-mv-label {
	padding-top: 24px;
	font-size: 13px;
	}
}

.lp-mv-btn {
  padding-top: 55px;
  width: 320px;
  margin-left: 0;
  font-size: 16px;
}
.lp-mv-btn a {
  display: block;
  position: relative;
  width: 100%;
  background: #db0032;
  border-radius: 4px;
  padding: 20px 2em;
  color: #fff;
  -webkit-transition: background ease 0.2s;
  transition: background ease 0.2s;
}
.lp-mv-btn a:before {
  content: "";
  display: block;
  position: absolute;
  right: 22px;
  top: calc(50% - 9px);
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  -webkit-transition: right ease 0.2s;
  transition: right ease 0.2s;
}
.lp-mv-btn a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 32px;
  width: 5px;
  height: 5px;
  border-right: 1px solid #db0032;
  border-top: 1px solid #db0032;
  -webkit-transform: rotate(45deg) translateY(-2px);
          transform: rotate(45deg) translateY(-2px);
  -webkit-transform-origin: right 50% 0;
          transform-origin: right 50% 0;
  -webkit-transition: right ease 0.2s;
  transition: right ease 0.2s;
}
.lp-mv-btn a:hover {
  background: #b1000e;
}
.lp-mv-btn a:hover:before {
  right: 16px;
}
.lp-mv-btn a:hover:after {
  right: 26px;
}

.lp-anchor-list {
  width: 100%;
  border-bottom: 1px solid #ddd;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 39px 0;
  position: relative;
  z-index: 2;
}

.lp-anchor-item {
  font-size: 16px;
}
.lp-anchor-item + .lp-anchor-item {
  padding-left: 45px;
}
.lp-anchor-item a {
  display: inline-block;
  padding-right: 28px;
  position: relative;
  color: #252525;
}
.lp-anchor-item a:before {
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: calc(50% - 9px);
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #db0032;
  -webkit-transition: top ease 0.4s;
  transition: top ease 0.4s;
}
.lp-anchor-item a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 8px;
  width: 5px;
  height: 5px;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: rotate(45deg) translateY(-2px);
          transform: rotate(45deg) translateY(-2px);
  -webkit-transform-origin: right 50% 0;
          transform-origin: right 50% 0;
  -webkit-transition: top ease 0.4s;
  transition: top ease 0.4s;
}
.lp-anchor-item a span:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 0%;
  height: 0;
  border-bottom: 1px solid #252525;
  -webkit-transition: width ease 0.4s;
  transition: width ease 0.4s;
}
.lp-anchor-item a:hover:before {
  top: calc(50% - 7px);
}
.lp-anchor-item a:hover:after {
  top: calc(50% + 2px);
}
.lp-anchor-item a:hover span:after {
  width: calc(100% - 28px);
}

@media screen and (max-width: 615px) {
	.lp-anchor-item {
	  font-size: 14px;
	}
	.lp-anchor-list {
	  padding: 15px 0;
}

}
/*-----------------------------------------------

コンテンツ

-------------------------------------------------*/
.lp-contents {
  width: 100%;
  padding-top: 100px;
  font-size: 16px;
  color: #252525;
  font-weight: 400;
  letter-spacing: 0.05em;
}

.lp-contents-inner {
  width: 965px;
  margin: 0 auto;
}
@media screen and (max-width: 994px) {
  .lp-contents-inner {
    width: auto;
    max-width: 980px;
    padding: 0 15px;
  }
}

.lp-section-headline {
  width: 100%;
  font-size: 38px;
  text-align: center;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.035em;
  color: #333333;
}
.lp-section-headline small {
  display: block;
  padding-top: 17px;
  font-size: 16px;
  text-align: center;
  font-weight: 400;
}

.lp-section-lead {
  width: 83%;
  margin: 0 auto;
  padding-top: 40px;
}
.lp-section-lead p {
  font-size: 16px;
  line-height: 1.8;
}
.lp-section-lead + .lp-section-subhead {
  padding-top: 40px;
}

.lp-section-subhead {
  font-size: 24px;
  text-align: center;
}

@media screen and (max-width: 615px) {
	.lp-section-headline {
	  font-size: 25px;
	}
	.lp-section-lead p {
	    line-height: 1.4;
	}

}

/*-----------------------------------------------

コンバージョンエリア

-------------------------------------------------*/
.lp-nav-conversion {
  width: 100%;
  background: linear-gradient(68deg, rgb(6, 19, 165) 0%, rgb(16, 23, 104) 100%);
  padding: 120px 0;
}

.lp-nav-inner {
  width: 965px;
  margin: 0 auto;
  background: #fff;
  border-radius: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-height: 330px;
}
@media screen and (max-width: 994px) {
  .lp-nav-inner {
    width: 96%;
    margin: 0 auto;
  }
}

.lp-nav-image {
  width: 34%;
  text-align: center !important;
}

.lp-nav-info {
  width: 66%;
  padding-right: 2em;
}

.lp-nav-headline {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
  color: #333333;
}
.lp-nav-headline b {
  font-weight: 700;
  color: #db0032;
}

.lp-nav-catch {
  padding-top: 15px;
  font-size: 16px;
}

.lp-nav-btn {
  width: 340px;
  padding-top: 25px;
  margin-left: 0;
  font-size: 16px;
}
.lp-nav-btn a {
  display: block;
  position: relative;
  width: 100%;
  background: #db0032;
  border-radius: 4px;
  padding: 20px 2em;
  color: #fff;
  -webkit-transition: background ease 0.2s;
  transition: background ease 0.2s;
}
.lp-nav-btn a:before {
  content: "";
  display: block;
  position: absolute;
  right: 20px;
  top: calc(50% - 9px);
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  -webkit-transition: right ease 0.2s;
  transition: right ease 0.2s;
}
.lp-nav-btn a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 30px;
  width: 5px;
  height: 5px;
  border-right: 1px solid #db0032;
  border-top: 1px solid #db0032;
  -webkit-transform: rotate(45deg) translateY(-2px);
          transform: rotate(45deg) translateY(-2px);
  -webkit-transform-origin: right 50% 0;
          transform-origin: right 50% 0;
  -webkit-transition: right ease 0.2s;
  transition: right ease 0.2s;
}
.lp-nav-btn a:hover {
  background: #b1000e;
}
.lp-nav-btn a:hover:before {
  right: 16px;
}
.lp-nav-btn a:hover:after {
  right: 26px;
}

@media screen and (max-width: 615px) {
	.lp-nav-headline {
	  font-size: 18px;
	}
	.lp-nav-catch {
	    font-size: 13px;
	}
	.lp-nav-btn {
	  width: 210px;
	  font-size: 12px;
	}
}

/*-----------------------------------------------

冒頭アバウト

-------------------------------------------------*/
.lp-section-about {
  width: 100%;
  padding-bottom: 120px;
}

.lp-about-list {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding-top: 56px;
}

.lp-about-item {
  width: 47.15%;
  min-width: 455px;
  background: #f5f5f5;
  border-radius: 20px;
  padding-bottom: 40px;
}
@media screen and (max-width: 1220px) {
  .lp-about-item {
    min-width: 0;
  }
}

.lp-about-image img {
  border-radius: 20px 20px 0 0;
  max-width: 100%;
}

.lp-about-headline {
  padding-top: 15px;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
}
.lp-about-headline span {
  display: block;
  padding-bottom: 15px;
  font-size: 16px;
  font-weight: 400;
}

/*-----------------------------------------------

非接触認証について

-------------------------------------------------*/
.lp-section-info {
  width: 100%;
  background: #f5f5f5;
  padding-top: 100px;
  padding-bottom: 60px;
}

.lp-point-list {
  width: 100%;
  padding-top: 40px;
}

.lp-point-item {
  width: 100%;
  border-radius: 20px;
  background: #fff;
  margin-bottom: 60px;
  padding: 0 8.5% 58px;
}

.lp-point-headline {
  padding-top: 52px;
  font-size: 24px;
  font-weight: 700;
  text-align: center;
  line-height: 1.4;
}
.lp-point-headline span {
  display: block;
  padding-bottom: 17px;
  color: #db0032;
  font-size: 12px;
}

.lp-point-text {
  padding-top: 30px;
  line-height: 1.8;
}

.lp-point-image {
  width: 100%;
  padding-top: 38px;
  text-align: center !important;
}
.lp-point-image img {
  max-width: 100%;
}


@media screen and (max-width: 615px) {
	.lp-point-text {
	    line-height: 1.4;
	}
}
/*-----------------------------------------------

「認証」のこんな悩みや課題に

-------------------------------------------------*/
.lp-section-kadai {
  width: 100%;
  background: #fff;
  padding-top: 96px;
}

.lp-kadai-box {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 50px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.lp-kadai-list {
  width: 45%;
}

.lp-kadai-item + .lp-kadai-item {
  padding-top: 30px;
}
.lp-kadai-item p {
  padding-left: 35px;
  font-size: 16px;
  line-height: 1.8;
  background: url(../images/icon_check_red.png) no-repeat left 4px;
  background-size: 20px 20px;
}
.lp-kadai-item p b {
  font-weight: 700;
  color: #db0032;
}

.lp-kadai-image {
  width: 50%;
  padding-right: 15px;
}
.lp-kadai-image img {
  max-width: 100%;
}

@media screen and (max-width: 615px) {
	.lp-kadai-item p {
	    padding-left: 35px;
	    font-size: 14px;
	    line-height: 1.4;
	}
}
/*-----------------------------------------------

特長

-------------------------------------------------*/
.lp-section-feature {
  width: 100%;
  background: #fff;
  padding-top: 100px;
  padding-bottom: 50px;
}

.lp-feature-ballon {
  width: 100%;
  margin-bottom: 75px;
  font-size: 24px;
  font-weight: 700;
  text-align: center !important;
  color: #fff;
}
.lp-feature-ballon span {
  display: inline-block;
  padding: 33px 3.8em;
  background: #101768;
  border-radius: 20px;
  position: relative;
}
.lp-feature-ballon span:after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 100%;
  margin-left: -12px;
  border: 12px solid transparent;
  border-top: 18px solid #101768;
  width: 0;
  height: 0;
}

.lp-feature-list {
  width: 100%;
  padding-top: 60px;
}

.lp-feature-item {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 60px;
}

.lp-feature-image {
  width: 42%;
  min-width: 400px;
}
@media screen and (max-width: 1220px) {
  .lp-feature-image {
    min-width: 0;
  }
}
.lp-feature-image img {
  max-width: 100%;
  border-radius: 20px;
}

.lp-feature-info {
  width: 53%;
}

.lp-feature-headline {
  font-size: 24px;
  font-weight: 700;
}
.lp-feature-headline span {
  display: block;
  padding-bottom: 16px;
  font-size: 12px;
  color: #db0032;
}
.lp-feature-headline sub {
  font-size: 50%;
  vertical-align: baseline;
}

.lp-feature-text {
  padding-top: 25px;
  font-size: 16px;
  line-height: 1.8;
}

.lp-feature-annotation {
  padding-left: 1em;
  margin-top: 1em;
  font-size: 12px;
  color: #999;
  line-height: 1.8;
  text-indent: -1em;
}

@media screen and (max-width: 615px) {
	.lp-feature-ballon span {
	    padding: 33px 0.5em;
	}
	.lp-feature-text {
    line-height: 1.4;
	}
	.lp-feature-annotation {
	  line-height: 1.4;
	}

}

/*-----------------------------------------------

こんな場面

-------------------------------------------------*/
.lp-section-situation {
  width: 100%;
  padding-top: 100px;
  padding-bottom: 70px;
}

.lp-situation-list {
  width: 100%;
  padding-top: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.lp-situation-item {
  width: 31.1%;
  min-width: 300px;
  margin-right: 3.35%;
  margin-bottom: 60px;
}
@media screen and (max-width: 1220px) {
  .lp-situation-item {
    min-width: 0;
  }
}
.lp-situation-item:nth-of-type(3n) {
  margin-right: 0;
}

.lp-situation-image {
  text-align: center !important;
}
.lp-situation-image img {
  max-width: 100%;
  border-radius: 20px;
}

.lp-situation-headline {
  padding-top: 18px;
  font-size: 20px;
  font-weight: 700;
}

.lp-situation-text {
  padding-top: 15px;
  font-size: 16px;
}

/*-----------------------------------------------

ラインナップ

-------------------------------------------------*/
.lp-section-lineup {
  width: 100%;
  background: #f5f5f5;
  padding-top: 90px;
  padding-bottom: 120px;
}

.lp-lineup-list {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding-top: 50px;
}

.lp-lineup-item {
  width: 31.1%;
  margin-right: 3.35%;
  background: #fff;
  border-radius: 20px;
  padding: 0 20px;
  position: relative;
  z-index: 1;
}
.lp-lineup-item:nth-of-type(3n) {
  margin-right: 0;
}

.lp-lineup-badge {
  position: absolute;
  z-index: 2;
  width: 100%;
  left: 0;
  top: -12px;
  text-align: center !important;
}
.lp-lineup-badge span {
  display: inline-block;
  border-radius: 12px/50%;
  background: #db0032;
  padding: 5px 1.3em;
  font-size: 13px;
  font-weight: 700;
  color: #fff;
}

.lp-lineup-image {
  padding-top: 28px;
  text-align: center !important;
}

.lp-lineup-product {
  width: 100%;
  min-height: 94px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: justify;
      align-content: space-between;
  margin: 10px 0;
}

.lp-lineup-headline {
  width: 100%;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  line-height: 1.2;
}

.lp-lineup-product-annotation {
  width: 100%;
  padding-top: 10px;
  font-size: 12px;
  color: #666;
  text-align: center !important;
}

.lp-lineup-btn {
  width: 100%;
  padding: 8px 0;
  font-size: 14px;
  text-align: center !important;
}
.lp-lineup-btn a {
  display: inline-block;
  padding-right: 28px;
  position: relative;
  color: #db0032;
}
.lp-lineup-btn a:before {
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: calc(50% - 8px);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #db0032;
  -webkit-transition: right ease 0.4s;
  transition: right ease 0.4s;
}
.lp-lineup-btn a:after {
  content: "";
  position: absolute;
  top: 52%;
  right: 9px;
  width: 4px;
  height: 4px;
  border-right: 1px solid #fff;
  border-top: 1px solid #fff;
  -webkit-transform: rotate(45deg) translateY(-2px);
          transform: rotate(45deg) translateY(-2px);
  -webkit-transform-origin: right 50% 0;
          transform-origin: right 50% 0;
  -webkit-transition: right ease 0.4s;
  transition: right ease 0.4s;
}
.lp-lineup-btn a span:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 0%;
  height: 0;
  border-bottom: 1px solid #db0032;
  -webkit-transition: width ease 0.4s;
  transition: width ease 0.4s;
}
.lp-lineup-btn a:hover:before {
  right: -4px;
}
.lp-lineup-btn a:hover:after {
  right: 4px;
}
.lp-lineup-btn a:hover span:after {
  width: calc(100% - 28px);
}

.lp-lineup-detail dl {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  border-top: 1px solid #e9e9e9;
  padding: 9px 0;
  font-size: 14px;
}
.lp-lineup-detail dt {
  line-height: 1.9;
}
.lp-lineup-detail dt sub {
  font-size: 78%;
  vertical-align: baseline;
}
.lp-lineup-detail dd {
  line-height: 1.9;
}
.lp-lineup-detail dd p {
  line-height: 1.9;
}
.lp-lineup-detail.is-scene {
  min-height: 5.9em;
}
.lp-lineup-detail.is-scene dl {
  padding: 7px 0;
}
.lp-lineup-detail.is-main-spec dt {
  width: 90%;
}
.lp-lineup-detail.is-main-spec dd {
  width: 10%;
}
.lp-lineup-detail.is-main-spec dd b {
  width: 100%;
  position: relative;
  display: inline-block;
  overflow: hidden;
  font-weight: 700;
  color: #db0032;
  text-indent: -9999px;
  vertical-align: middle;
}
.lp-lineup-detail.is-main-spec dd b:after {
  content: "";
  display: block;
  position: absolute;
  width: 10px;
  height: 10px;
  border: 2px solid #db0032;
  border-radius: 50%;
  right: 0;
  top: calc(50% - 7px);
}
.lp-lineup-detail.is-main-spec dd span {
  width: 100%;
  position: relative;
  display: inline-block;
  text-indent: -9999px;
  vertical-align: middle;
}
.lp-lineup-detail.is-main-spec dd span:after {
  content: "";
  display: block;
  position: absolute;
  width: 12px;
  height: 0;
  border-top: 1px solid #252525;
  right: 2px;
  top: calc(50% - 1px);
}

.lp-lineup-annotation {
  padding-top: 2em;
  font-size: 12px;
  color: #666;
}
.lp-lineup-annotation + .lp-lineup-annotation {
  padding-top: 1em;
}


@media screen and (max-width: 615px) {
	.lp-lineup-list {
	    display: block;
	}
	.lp-lineup-item {
	    width: 100%;
	    margin-bottom: 50px;
	}
}





/* FloatBtn */
#FloatBtnStopper {
  position: relative;
  height: 50px; }

#FloatBtnWrap {
  position: fixed;
  width: 100%;
  left: 0;
  bottom: 0;
  opacity: 0;
  z-index: 10;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
  -moz-transform: translateY(100%);
  -ms-transform: translateY(100%);
  -webkit-transform: translateY(100%);
  transform: translateY(100%); }
  #FloatBtnWrap.narrow {
    -webkit-transition: all 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: all 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; }
  #FloatBtnWrap.visible {
    opacity: 1;
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0); }
    #FloatBtnWrap.visible .PageTopBtn {
      top: -70px; }
      #FloatBtnWrap.visible .PageTopBtn img {
        width: 50px; }
  #FloatBtnWrap.static {
    position: absolute; }
    #FloatBtnWrap.static .ContactBlock {
      width: 100%;
      height: 50px;
      background: #3d3d3d;
      display: flex;
      justify-content: center; }
  #FloatBtnWrap .PageTopBtn {
    position: absolute;
    top: 0;
    opacity: 1.0;
    -webkit-transition: opacity 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: opacity 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; }
    #FloatBtnWrap .PageTopBtn:hover {
      opacity: 0.7; }
  #FloatBtnWrap .ContactBlock {
    display: flex;
    width: 100%;
    height: 50px;
    align-items: center;
    justify-content: center;
    background: rgba(60, 60, 60, 0.8);
    -webkit-transition: background 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: background 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; }
    #FloatBtnWrap .ContactBlock a {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 310px;
      height: 30px;
      font-size: 18px;
      font-size: 112.5%;
      color: #fff;
      text-align: center;
      font-weight: bold;
      text-decoration: none;
      padding: 2px 0 2px 20px;
      margin: 0 10px;
      -webkit-transition: 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
      transition: 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
      border: 1px solid #fff;
      background: #212121;
      position: relative; }
      #FloatBtnWrap .ContactBlock a:hover {
        opacity: 0.7; }
      #FloatBtnWrap .ContactBlock a:before {
        position: absolute;
        content: '';
        display: inline-block;
        width: 20px;
        height: 22px; }
      #FloatBtnWrap .ContactBlock a:nth-child(1):before {
        top: 10px;
        left: 90px;
        background: url("../../images/icon_mail.png");
        background-repeat: no-repeat;
        background-size: contain; }

@media screen and (min-width: 1305px) {
  #FloatBtnWrap .PageTopBtn {
    right: 50%;
    -moz-transform: translateX(630px);
    -ms-transform: translateX(630px);
    -webkit-transform: translateX(630px);
    transform: translateX(630px); } }
@media screen and (max-width: 1304px) {
  #FloatBtnWrap .PageTopBtn {
    right: 40px; } }
@media screen and (max-width: 767px) {
  #FloatBtnStopper {
    height: 40px; }

  #FloatBtnWrap .PageTopBtn {
    right: 20px; }
  #FloatBtnWrap.static .ContactBlock {
    display: block;
    height: 32px; }
  #FloatBtnWrap.visible .ContactBlock {
    height: 32px; }
  #FloatBtnWrap.visible .PageTopBtn {
    top: -65px; }
  #FloatBtnWrap .ContactBlock {
    display: block;
    height: 32px;
    padding: 10px 0; }
    #FloatBtnWrap .ContactBlock a {
      width: 290px;
      height: 26px;
      margin: 0 auto 11px; }
      #FloatBtnWrap .ContactBlock a:last-of-type {
        margin-bottom: 0; }
      #FloatBtnWrap .ContactBlock a span {
        padding-left: 0;
        background-size: 15px; }
      #FloatBtnWrap .ContactBlock a:before {
        width: 20px;
        height: 20px; }
      #FloatBtnWrap .ContactBlock a:nth-child(1):before {
        top: 7px;
        left: 84px; }
      #FloatBtnWrap .ContactBlock a:nth-child(2):before {
        top: 5px;
        left: 49px; } }
* {
  max-height: 99999px; }