@charset "utf-8";


/*---------------------
ALL
---------------------*/
/*追加*/
body{
  width: 100%;
  margin: 0;
  padding:0;
}
.crumbs{
  display:none;
}
#footer{
  margin-top: 0;
  }
/*追加*/


/*---------------------
PC
---------------------*/
@media screen and (min-width: 768px) {
	/*all
---------------------*/
.spView {
	display: none;
}
.lp_contents{
	margin: 0;
	padding: 0;
	background: #191919;
}

	/*一覧
---------------------*/
.img_wrap{
	display: flex;
	flex-wrap: wrap;/*改行許可*/
	justify-content: space-between;/*両端配置・アイテムの間にスペースを均等に割り付け*/
	align-items: flex-start;/*上揃え*/
	line-height: 0;
	font-size: 0;
	margin: 0;
	padding: 0;
	background: #191919;
}

.lead_text {
	width: 65%;
    margin: 5% auto;
    text-align: center;
    font-size: 15px;
    line-height: 1.5em;
}
/* .lead_text {
	width: 65%;
    margin: 5% auto;
    text-align: center;
} */
.lead_text span {
	display: block;
	margin: 2% 0;
}

.img_one{
	width: 100%;
	line-height: 0;
	font-size: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

.different_heights {
display: grid;
  /* 横幅を50%ずつ、隙間（gap）なしで2カラムにする */
  grid-template-columns: 1fr 1fr;
  gap: 0; 
  width: 100%;
}
.different_heights .img_two {
  width: 100%;      /* 親要素の50%幅いっぱいに広げる */
  height: auto;     /* 高さは固定せず、画像の比率を維持する */
  display: block;   /* 画像の下にできる謎の隙間（行間）を消す */
}

.vertical_two {
	align-items: stretch; /* 中の要素の高さを揃える（重要） */
}
.vertical_two .img_two {
  display: flex;
  flex-direction: column; /* 縦に並べる */
  width: 100%;
}

/* aタグがある場合、aタグ自体もflexの子要素として高さいっぱいにする */
.vertical_two .img_two a {
  display: flex;
  flex: 1;
}

.vertical_two img {
  width: 100%;
  display: block;
  object-fit: cover; /* 比率を保ちつつ枠を埋める */
}

/* 左側の2枚の比率を維持 */
.vertical_two .img_two:first-child img {
  height: auto;
}

/* 【ここが重要】 */
/* 左側：2枚あるので、それぞれ高さを半分（50%）ずつ持つようにする */
.vertical_two .img_two:first-child img {
  height: 50%; 
  flex: 1;      /* 隙間がある場合、自動で伸びて埋める */
}

/* 右側：1枚で高さいっぱいにする */
.vertical_two .img_two:last-child img,
.vertical_two .img_two:last-child a img {
  height: 100%;
}


.img_two{
	width: 50%;
	line-height: 0;
	font-size: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
.img_one img, .img_two img{
	width: 100%;
	transition:0.5s all;
}
.img_width{
	max-width: 1000px;
	margin: 0 auto;
}
.img_one a img:hover, .img_two a img:hover{
	transform:scale(1.2,1.2);
	transition:0.5s all;
	cursor: pointer;
}

}/*! //pc & tb */



@media screen and (max-width: 992px) and ( min-width:768px) {

}/*! //pc2 & tb2 */



/*---------------------
SP
---------------------*/
@media only screen and (max-width: 767px){
	/*sp all
---------------------*/
.pcView {
	display: none;
}
.lp_contents{
	margin: 0;
	padding: 0;
	background: #191919;
}

	/*sp 一覧
---------------------*/
.lead_text {
	width: 90%;
    margin: 5% auto;
    text-align: left;
    font-size: 15px;
    line-height: 1.5em;
}
.lead_text span {
    display: block;
    margin: 4% 0;
}

.different_heights {
  display: grid !important; /* 他のスタイルに負けないよう強制 */
  grid-template-columns: 1fr 1fr; /* 50%ずつの2列を死守 */
  gap: 0;
  width: 100%;
  align-items: stretch;
}

/* 左右の枠（.img_two） */
.different_heights .img_two {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%; /* 親の高さに合わせる */
}

/* aタグの調整（これが重要：aタグが中のimgのサイズを邪魔しないようにする） */
.different_heights .img_two a {
  display: flex;
  flex: 1;
  width: 100%;
}

.different_heights img {
  width: 100%;
  display: block;
  object-fit: cover; /* 比率を維持して隙間を埋める */
}

/* 左側（2枚構成）：それぞれが50%の高さを持ち、合計で100%になるようにする */
.different_heights .img_two:first-child img {
  height: 50%;
  flex: 1;
}

/* 右側（1枚構成）：親（grid）の高さ100%に合わせる */
.different_heights .img_two:last-child img,
.different_heights .img_two:last-child a img {
  height: 100%;
  min-height: 100%; /* スマホで縮まないように念押し */
}


.img_wrap{
	display: flex;
	flex-wrap: wrap;/*改行許可*/
	justify-content: space-between;/*両端配置・アイテムの間にスペースを均等に割り付け*/
	align-items: flex-start;/*上揃え*/
	line-height: 0;
	font-size: 0;
	margin: 0;
	padding: 0;
	background: #191919;
}
.img_one{
	width: 100%;
	line-height: 0;
	font-size: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
.img_two{
	width: 50%;
	line-height: 0;
	font-size: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
.img_one img, .img_two img{
	width: 100%;
	cursor: pointer;
	transition:0.5s all;
}
.img_one img:hover, .img_two img:hover{
	transform:scale(1.2,1.2);
	transition:0.5s all;
}
/*追加*/
#footer{
  margin-right: 0;
  margin-left: 0;
  padding-top: 20px;
}
.navbar .nav.p-footer__main-static-list{
  padding-top:0;
}
/*追加*/

}/*! //sp */

