@charset "utf-8";


/*カードレイアウトの高さ揃えるここから;*/
.l-container {
max-width: 1330px;
margin: auto;
padding: 0 60px 0 60px;
}

.card__list {
margin:50px 0 50px 0 ;
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: auto;
gap: 50px 30px;
}

.card__item {
position: relative;
display: grid;
grid-template-rows: subgrid;
grid-row: span 4;
gap: 0px;
box-shadow: 2px 2px 5px 1px lightgray;
}
.card__item h2 {
font-size: 20px;
font-weight: bold;
}

/*↓これないとラインナップ画像ホバー時LEARN MOREでない*/
.card__item a {
position: relative;
}

.con-lyte a {
position: relative;
}

.card__image {
text-align: center;
}
.card__image img {
width: 100px;
height: auto;
}

.card__button {
text-align: center;
background-color: lightgray;
padding: 0 10px 10px 10px;
}

.card__button--blue {
font-size: 16px;
color: #fff;
width: 100%;
display: block;
background-color: skyblue;
padding: 0.6rem 1.2rem;
border-radius: 100vw;
font-weight: bold;
}
.card__item .graybox{
background-color: lightgray;
margin-top: 14px;
text-align: center;	
}
/*カードレイアウトの高さ揃えるここまで;*/


/*カードレイアウトのクリック可能な範囲を広げる*/
.red_view::after{
position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:auto;content:"";background-color:rgba(0,0,0,0)
}

.use-lytespeed111_black {
background-color: black;
}

.use-lytespeed111_black .night-v{
font-size: 14px;
color: #fff;
margin-bottom: 5px;
}


/*ナイトビジョン交互レイアウトここから*/

.nightvision_type_inner{

margin-right: auto;
margin-left: auto;
}
.nightvision_type_box{
display: flex;
flex-direction: row;
}
.nightvision_type_box + .nightvision_type_box{
margin-top: 80px;
}
.nightvision_type_box_body{
width: 50%;
padding: 0 30px 0 0;
}

.nightvision_type_box_image{
margin-top: 7px;
width: 60%;
}
.nightvision_type_box_image img{
object-fit: cover;
}

.nightvision_type_box.reverse{
flex-direction: row-reverse;
}

.nightvision_type_box.reverse .nightvision_type_box_body{
flex-direction: row-reverse;
padding: 0 0 0 30px;
}


@media screen and (max-width:950px){
.nightvision_type_box {
display: block;
}
.nightvision_type_box + .nightvision_type_box{
margin-top: 60px;
}
.nightvision_type_box_body{
width: 100%;
padding: 0;
}
.nightvision_type_box_image{
margin-top: 20px;
width: 100%;
}

.nightvision_type_box.reverse .nightvision_type_box_body{
width: 100%;
padding: 0;
}
}
/*ナイトビジョン交互レイアウトここまで*/


/*ナイトビジョンの種類画像のマージン等レイアウト*/
.use-lyte-p3_3 p{
font-size: 14px;
color: #404142;
font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'Meiryo', 'メイリオ', 'Osaka', 'MS PGothic', 'arial', 'helvetica', 'sans-serif';
letter-spacing: 1px;
font-feature-settings: "palt";
margin-bottom: 5px;
}
.use-lyte-p3_3 .point{
line-height: 1.5;
margin-bottom: 10px;
}

.use-lyte-p3_3 .info{
line-height: 1.5;
}

.use-lyte-p3_3 .speed-star{
font-size: 22px;  /*18px;*/
font-weight: bold;
color: #ff6c27;
}

.use-lyte-p3_3 .speed-star_2{
font-size: 20px;
font-weight: bold;
color: #404142;
margin-bottom: 5px;
}


.use-lyte-p3_3 p{
font-size: 14px;
color: #fff;
margin-bottom: 5px;
}

.use-lyte-p2_3{
width: auto;
border-bottom: solid 2px #fff;
margin-bottom: 20px;
}

.use-lyte-p2_3{
width: auto;
border-bottom: solid 2px #fff;
margin-bottom: 15px;
}
.use-lyte-p2_3 p{
color: #fff;
font-size: 17px;
font-weight: bold;
font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'Meiryo', 'メイリオ', 'Osaka', 'MS PGothic', 'arial', 'helvetica', 'sans-serif';
margin-bottom: 10px;
}

.use-lyte-p2_3 p span{
font-size: 14px;
font-weight: normal;
}

@media screen and (max-width: 400px){
.use-lyte-p2_3 p{
font-size: 15px;
}
}
/*ナイトビジョンの種類画像のマージン等レイアウトここまで*/

/*背景の濃いグレーと白文字*/
.use-lytespeed11_v{
background-color: gray;
}

.use-lytespeed11_v .use-lyte-p2 p {
color: #fff;
font-size: 17px;
font-weight: bold;
font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'Meiryo', 'メイリオ', 'Osaka', 'MS PGothic', 'arial', 'helvetica', 'sans-serif';
margin-bottom: 10px;
}

.use-lytespeed11_v .use-lyte-p2 {
width: auto;
border-bottom: solid 2px #fff;
margin-bottom: 15px;
}

.use-lytespeed11_v .use-lyte-p4 p {
font-size: 15px;
color: #fff;
font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'Meiryo', 'メイリオ', 'Osaka', 'MS PGothic', 'arial', 'helvetica', 'sans-serif';
letter-spacing: 1px;
font-feature-settings: "palt";
line-height: 2;
}

.use-lytespeed11_v .use-lyte-p00 .use-lyte-p3 p{
color: #fff;
}

@media screen and (max-width: 400px){
.use-lyte-p3_2 p{
font-size: 14px;
}
.use-lyte-p3_2 .speed-star{
font-size: 15px;
}
}

.use-lyte-p3_2 img{
margin-top: 20px;
margin-bottom: 5px;
}

.use-lyte-p3_2 .night-v2{
font-size: 16px;
font-weight: bold;
color: crimson;
margin-top: 10px;
}
.use-lyte-p3_2 .night-v{
font-size: 14px;
color: #404142;
font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'Meiryo', 'メイリオ', 'Osaka', 'MS PGothic', 'arial', 'helvetica', 'sans-serif';
letter-spacing: 1px;
font-feature-settings: "palt";
margin-bottom: 20px;
}


/*イベント場情報の画像のマージン;*/
.item figure img {
margin: 5px 0 0 0}


@media screen and (max-width: 1400px){
.card__list {
padding: 0 10px 0 10px;
}
}


@media screen and (max-width: 1050px){
.card__list {
grid-template-columns: repeat(3, 1fr);
padding: 0 15px 0 15px;
}
}

@media screen and (max-width: 716px){
.card__list {
grid-template-columns: repeat(2, 1fr);	
	padding: 0 20px 0 20px;
}
}

@media screen and (max-width: 480px){
.card__list {
 grid-template-columns: repeat(1, 1fr);	
}
}

.l-container{
max-width: 1300px;
margin: auto;
padding: 0 40px 30px 40px;
}


/*.gridレウアウトの商品リンクのホバーエフェクト*/
.card__item:hover {
opacity: 0.75;
position: relative;top: 1.5px;left: 1.5px;
transition: all 0.5s ease 0s;
}
.card__item:hover .c-lyte_grid{
text-decoration: underline black 3px;
}


.card__item:hover .c-lyte_grid span{
text-decoration: underline black 3px;
}

.con-lyte_grid img{
margin-bottom: -7px;
}
.con-lyte_grid .co-lyte_grid{
text-align: center;
font-size: 14px;
font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'Meiryo', 'メイリオ', 'Osaka', 'MS PGothic', 'arial', 'helvetica', 'sans-serif';
color: black;
text-decoration-line: none;
}


.co-lyte_grid,.c-lyte_grid,.coo-lyte_grid,.cooo-lyte_grid,.red_view{
text-decoration-line: none;
padding: 8px 25px 7px 25px;
}

.c-lyte_grid span{
display: inline-block;
font-size: 23px;
text-decoration: none;}


.c-lyte_grid .product_name_long{
font-size: 28px;
}

.coo-lyte_grid{
text-align: center;
font-size: 20px;
font-family: rajdhani, sans-serif;
font-style: normal;
font-weight: 700;
margin-top: 5px;
color: gray;
text-decoration: none;
line-height: 1;
}

.con-lyte_grid a img .cooo-lyte span .red_view{
text-decoration: none;
}

.cooo-lyte_grid{
color: black;
font-size: 14px;
font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'Meiryo', 'メイリオ', 'Osaka', 'MS PGothic', 'arial', 'helvetica', 'sans-serif';
background-color: lightgray;
padding: 15px 20px 0 20px;	
line-height: 1.5;
letter-spacing: 1px;
font-feature-settings: "palt";
text-decoration:none;
}
.cooo-lyte_grid span{
margin-bottom: 10px;
padding-bottom: 10px;
text-decoration: hidden;

}
.con-lyte a img .cooo-lyte_grid span .red_view{
text-decoration: none;
}

.con-lyte_grid a img .cooo-lyte_grid span .red_view{
text-decoration: none;
}

.graybox .cooo-lyte_grid span {
display: inline-block;
line-height: 1.5;
margin-bottom: 0px; 
padding-bottom: 0px;
}

.second-copy2 span {
display: inline-block;
}
.second-copy3 span {
display: inline-block;
}

.third-copy1 span{
display: inline-block;
}

.third-copy2 span{
display: inline-block;
}

.third-copy3 span{
display: inline-block;
}

.card__titletext span{
display: inline-block;
font-feature-settings: "palt";
}

.c-lyte_grid{
font-size: 28px;
padding: 0 10px 0 10px;
text-align: center;
font-family: rajdhani, sans-serif;
font-style: normal;
font-weight: 700;
color: black;
text-decoration: none;
line-height: 1;
}

@media screen and (max-width: 1200px){
.con-lyte_grid .co-lyte_grid{
font-size: 13px;
}
}

@media screen and (max-width: 1100px){
.con-lyte_grid .co-lyte_grid{
font-size: 12px;
}
}

@media screen and (max-width: 1050px){
.con-lyte_grid .co-lyte_grid{
font-size: 14px;
}
}

@media screen and (max-width: 880px){
.con-lyte_grid .co-lyte_grid{
font-size: 13px;
}
}

@media screen and (max-width: 840px){
.con-lyte_grid .co-lyte_grid{
font-size: 12px;
}
}

@media screen and (max-width: 820px){
.co-lyte_grid{
font-size: 12px;
}
.c-lyte_grid{
font-size: 24px;
}
.c-lyte_grid span{
font-size: 20px;
}

.cooo-lyte_grid{
font-size: 12px;
}
}

@media screen and (max-width: 800px){
.con-lyte_grid .co-lyte_grid{
font-size: 11px;
}
}

@media screen and (max-width: 750px){
.con-lyte_grid .co-lyte_grid{
font-size: 10px;
}
}

@media screen and (max-width: 716px){
.c-lyte_grid .product_name_long{
font-size: 27px;
}
.con-lyte_grid .co-lyte_grid{
font-size: 14px;
}
}

@media screen and (max-width: 630px){
.con-lyte_grid .co-lyte_grid{
font-size: 13px;
}
}

@media screen and (max-width: 600px){
.con-lyte_grid .co-lyte_grid{
font-size: 12px;
}
}

@media screen and (max-width:  560px){
.con-lyte_grid .co-lyte_grid{
font-size: 11px;
}
}

@media screen and (max-width:  540px){
.con-lyte_grid .co-lyte_grid{
font-size: 10px;
}
}

@media screen and (max-width: 513px){
.l-container{
padding: 0 15px 0 15px;
}
}

@media screen and (max-width: 480px){

.co-lyte_grid{
font-size: 14px;
}
.c-lyte_grid{
font-size: 28px;
}
.c-lyte_grid span{
font-size: 23px;
}
.coo-lyte_grid{
font-size: 20px;
}
.cooo-lyte_grid{
font-size: 14px;
}

.con-lyte_grid .co-lyte_grid{
font-size: 14px;
}
}
