@charset "utf-8";

/* CSS Document */

/*-------------------------
- base
- MV
- date_block
-------------------------*/
/*=======================================
　base
=======================================*/
.noto_serif {
	font-family: 'Noto Serif JP', serif;
}
#suntory_contents #intro {
	background-color: #fff;
}
#suntory_contents #intro .notes {
    font-size: 0.857rem;
    margin: 0 auto;
    width: calc(90% - 2.6rem);
    /* padding-left: 1em; */
    text-indent: -1em;
    color: #E4007F;
    font-size: 1rem;
    line-height: 1.3928;
	background-color: rgb(255,255,255,0);
    border: 2px solid #E4007F;
    padding: 0.2rem 0.8rem 0.2rem 1.8rem;
}

#suntory_contents #intro .notes02 {
	margin-bottom: 3.857rem;
}


#suntory_contents #intro .warning {
	background: url(../images/intro/main_bg.jpg) no-repeat center bottom;
	background-size: cover;
	width: 100%;
	margin-bottom: 3.864382142857143rem;
  padding: 2.389610714285714rem 0 2.341082142857143rem;
}



/*=======================================
　MV
=======================================*/
#suntory_contents .mv {
	background: url(../images/intro/main_bg.jpg) no-repeat;
	background-size: cover;
	width: 100%;
}
#suntory_contents .mv .img {
	padding: 2.5rem 2.071428571428571rem 2.857142857142857rem 1.964285714285714rem;
}


/*=======================================
　special_area
=======================================*/
#suntory_contents #special_area {
	background: url(../images/intro/main02_bg.jpg) no-repeat;
	background-size: cover;
	/* margin-bottom: 2.42857rem; */
	padding: 1.32rem 0;
}
#suntory_contents #special_area h3 {
	text-align: center;
	color: #f8b62d;
	font-weight: 500;
	letter-spacing: 0.150em;
	margin-bottom: 1rem;
	font-size: 1.67847rem;
	line-height: 1.2;
}


/*=======================================
　モーダル_動画
=======================================*/

/*動画表示のモーダルの余白を変更したい場合*/
.modaal-video .modaal-inner-wrapper{
	padding:0;
}

/*モーダルのボタンの色を変更したい場合*/
.modaal-close:after, 
.modaal-close:before{
	background:#ccc;	
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}

/*=======================================
　モーダル_動画
=======================================*/
#suntory_contents #movie_area {
	/* margin-bottom: 3.857rem; */
}
#suntory_contents #movie_area .movie {
	margin-top: 1.67857rem;
}
/*#suntory_contents #movie_area .movie img {
	object-fit: cover;
	width: 100%;
	height: auto;
}*/
	.movie .video_open {
		display: block;
		position: relative;
		width: 100%;
		padding-bottom: 56.25%; /* 16:9 のアスペクト比を表す値 */
	}

	.movie .video_open iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
.modaal-container {
	position:relative;
	width:100%;
	height:0;
	padding-top:52.5%;
}
.modaal-container iframe {
	position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}

.modaal-wrapper .modaal-close {
	right: -2.5%!important;
	top: -1rem!important;
}


@media only screen and (min-width: 1060px) {
	.modaal-container {
		padding-top: 525px;
	}
}



.fancybox-video, .fancybox-iframe {
    max-width: 768px;
    margin: 0 auto;
	height: auto;
}
.fancybox-slide--video .fancybox-content {
    background: none;
    max-width: 768px;
    margin: 0 auto;
    height: auto!important;
}
#suntory_contents #special_area video {
	width: 100%;
	height: auto;
}


/* 2024/5/29追加
--------------------------------------------------------- */
/*=======================================
　広告バナー注釈
=======================================*/
#suntory_contents #intro .bnr_area .inner a .notes {
	font-size: 0.643rem;
	padding: 0;
	color: initial;
	text-indent: 0;
    line-height: initial;
    border: none;
	width: fit-content;
}