@charset "utf-8";
/* CSS Document */

body{
	margin: 0;
}

.wrapper{
	max-width: 1000px;
	width: 100%;
	margin: 0 auto 3%;
}

.wrapper img{
	display: block;
	line-height: 0;
}

.mv{
	margin: 0 auto 10%;
}

.mv-logo{
	width: 40%;
	margin: 10% auto 5%;
}

.mv p{
	text-align: center;
	font-size: 1.0rem;
	line-height: 1.8;
	font-weight: 600;
}

.mv span{
	font-size: 0.85rem;
	font-weight: normal;
}

.lead{
	text-align: center;
	font-size: 0.8rem;
	line-height: 2;
	margin: 10% auto;
}


.movie_y{
	position: relative;
	width:90%; /* 横幅は100%で固定 */
	height:0; /* 高さは0にしておく(padding-topで高さを指定するため) */
	padding-top: 56.25%; /* 高さを指定(16:9) */
	margin: 10% auto 20%;
}

/* YouTube埋め込み用のiframe */
.movie_y iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.main-contents{
	margin: 10% auto 5%;
}

.main-contents h1{
	text-align: center;
	font-size: 1.25rem;
	margin: 5% auto;
}

.contents-inner{
	margin: 0 auto;
	/*display: flex;*/
}

.inner-box{
	margin-bottom: 20%;
}

.box-scene__time{
	text-align: center;
	margin: 3% auto 5%;
}

/* リンク全体のデザイン */
.video-link {
	display: inline-flex; /* 要素を横並びにする */
	align-items: center;  /* 上下中央に揃える */
	text-decoration: none; /* 下線を消す */
	color: #333;           /* 文字の色 */
	font-family: sans-serif;
	font-weight: bold;
	font-size: 1.2rem;
	gap: 8px;              /* 要素間の隙間 */
	cursor: pointer;
	z-index: 10;
}

/* 再生ボタンの外側の円 */
.play-icon {
	width: 22px;
	height: 22px;
	border: 2px solid #333; /* 円の線 */
	border-radius: 50%;     /* 丸くする */
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}

/* 再生ボタンの中の三角形 */
.play-icon::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 5px 7px; /* 三角形の形を作る */
	border-color: transparent transparent transparent #333; /* 右向きの三角形 */
	margin-left: 2px; /* 中心を少し右にずらして調整 */
}

.main-img{
	width: 90%;
	margin: 5% auto;
}

.item {
    display: flex;
    justify-content: space-between; /* テキストを左、BUYを右に配置 */
    align-items: center;            /* 上下中央揃え */
    color: #000;
    font-size: 0.75rem;
    margin: 3% auto;
    width: 80%;
    text-decoration: none;
    padding-bottom: 2%;
    border-bottom: solid 1px #ccc;
}

.item::after{
	content: 'BUY';
}

.copy{
	margin: 10% auto;
}

.copy p{
	margin: 2% 0;
	font-size: .7rem;
	line-height: 1.8;
	text-align: center;
}

.copy .copy-title{
	font-weight: 600;
	font-size: .8rem;
}

.br_p{
	display: none;
}

@media(min-width:750px){
	.mv{
		margin: 0 auto 5%;
	}

	.mv-logo{
		width: 20%;
		margin: 5% auto 5%;
	}

	.mv p{
		font-size: 1.6rem;
	}

	.mv span{
		font-size: 1.1rem;
	}

	.lead{
		font-size: 1.0rem;
		margin: 5% auto;
	}


	.movie_y{
		width:100%; /* 横幅は100%で固定 */
		margin-bottom: 7%;
	}
	
	.contents-inner{
		display: flex;
		flex-wrap: wrap;
		column-gap: 10px;
		grid-row-gap: 50px;
		justify-content: center;
	}
	
	.inner-box{
		width: calc(33.3% - 10px);
		margin-bottom: 0;
	}
	
	.main-img{
		width: 100%;
		margin: 5% auto;
	}
	
	.br_s{
		display: none;
	}
	
	.br_p{
		display: inline;
	}
	
	.item {
		width: 90%;
		font-size: .7rem;
	}

	.copy{
		margin: 6% auto 10%;
	}

	.copy p{
		margin: 2% 0;
		font-size: .65rem;
		line-height: 1.8;
		text-align: center;
	}

	.copy .copy-title{
		font-size: .77rem;
	}
}

/*---------- 261016　追加 ----------*/

.women-channel{
	width: 100%;
	margin: 5% auto;
	background-color: #E5E5E7;
	box-sizing: border-box;
	padding: 3%;
}

.channel-img{
	background-color: #fff;
}

.channel-img img{
	width: 30%;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 5% 0;
}

.channel-lead{
	margin: 5% auto 0;
}

.channel-lead p{
	margin: 2% 0;
	text-align: center;
	font-size: .75rem;
	line-height: 2;
}

.channel-lead .lead-01{
	font-size: 1.3rem;
	font-weight: 600;
	line-height: 1.3;
}

.channel-lead .lead-02{
	font-size: 1.0rem;
}

.mgb5{
	margin-bottom: 5%;
}

@media(min-width:750px){
	.women-channel{
		padding: 1%;
		display: flex;
		align-items: center;
		column-gap: 30px;
	}

	.channel-img{
		background-color: #fff;
		width: 30%;
	}

	.channel-img img{
		width: 50%;
	}

	.channel-lead{
		margin: 0;
	}

	.channel-lead p{
		margin: 1% 0;
		text-align: left;
		font-size: .8rem;
	}

	.channel-lead .lead-01{
		line-height: 1.1;
	}
	
	.br_s{
		display: none;
	}

}




















