
.movie {
	& iframe {
		width 					: 100%;
		height 					: auto;
		aspect-ratio 			: 16/9;
	}
}

.movie-thumb { 
	width 						: 100%;
	aspect-ratio 				: 16/9;
	position 					: relative;
	
	& figure { 
		width 					: 100%;
		height 					: 100%;
		position 				: relative;
	}
	
	& .movie-overlay button {
		background-color 		: rgb(0,0,0,0.7);
		width 					: 100%;
		height 					: 100%;
		font-size 				: var(--bread-txt);
		color 					: white; 
		display 				: flex;
		flex-direction 			: column;
		justify-content 		: center;
		align-items 			: center;
		position 				: absolute;
		top 					: 0;
		left 					: 0;
		
		& small {
			display 			: block;
		}
		 
	}
	
	& img {
		width 					: 100%;
		height 						: auto;
	}

}

/*-----------------------------*/

.cookie_banner {
    display 					: none;
    position 					: fixed;
    left 						: 0;
    right 						: 0;
    bottom 						: 0;
    background 					: #222;
    color 						: #fff;
    z-index 					: 9999;
    box-shadow 					: 0 -3px 12px rgba(0,0,0,.25);
}

.cookie_inner {
    max-width 					: 1200px;
    margin 						: auto;
    padding 					: 24px;
}

.cookie_text {
	& h2{
		margin-bottom 			: 10px;
		font-size 				: 24px;
	}
 	& p.txt {
    	line-height 			: 1.6;
		font-size 				: 16px;
	}
	& a {
		color 					: #7fc7ff;
	}
}

.cookie_buttons {
    margin-top 					: 20px;
    display 					: flex;
    gap 						: 10px;
    flex-wrap 					: wrap;
	
	& button{
		cursor 					: pointer;
		border 					: none;
		padding 				: 12px 24px;
		font-size 				: 15px;
		border-radius 			: 4px;
	}
}
.btn_accept {
    background 					: #0078d4;
    color 						: #fff;
}
.btn_reject {
    background 					: #999;
    color 						: #fff;
}
.btn_setting {
    background 					: #444;
    color 						: #fff;
}


/* ------------------------- */

.cookie_modal {
    display 					: none;
    position 					: fixed;
    left 						: 0;
    top 						: 0;
    width 						: 100%;
    height 						: 100%;
    background 					: rgba(0,0,0,.55);
    z-index 					: 100000;
	
	& > .cookie_modal_content > h2 {
		text-align 				: left;
		font-size 				: 24px!important;
		font-weight 			: 600!important;
		margin-bottom 			: 25px!important;
	}
	
	& p.comment {
		margin-top 				: 10px;
		color 					: #666;
		line-height 			: 1.8;
		font-size 				: 16px; 
	}
	
	& p.cookie_point {
		background 				: #eee;
		font-size 				: 14px;
		color 					: #666;
		line-height 			: 1.4;
		margin-top 				: 20px;
		padding 				: 10px;
		border-radius 			: 6px;
	}
	
}
.cookie_modal_content {
	height 						: 70%;
    position 					: absolute;
    left 						: 50%;
    top 						: 50%;
    transform 					: translate(-50%,-50%);
    width 						: 90%;
    max-width 					: 600px;
    background 					: #fff;
    padding 					: 40px;
    border-radius 				: 8px;
	overflow-y 					: auto;
}
.modal_close {
    position 					: absolute;
    right 						: 15px;
    top 						: 15px;
    font-size 					: 26px;
    border 						: none;
    background 					: none;
    cursor 						: pointer;

}
.cookie_item {
    margin-top 					: 30px;
    padding-bottom 				: 20px;
    border-bottom 				: 1px solid #ddd;
		
	& label{
		background 			: 
			url("../images/icon_unchecked.svg") 
			no-repeat left 0.5em center / 7%;
		width 				: 100%;
		height 				: 60px;
		font-size 			: 18px; 
		font-weight 		: bold;
		color 				: #333;
		padding-left 		: 3em;
		margin-top 			: 10px; 
		display 			: flex;
		align-items 		: center;
		border 				: 0.1cqw solid #ccc;
		border-radius 		: 9px;
		cursor 				: pointer;
		transition 			: background 0.2s ease-in-out,font-size 0.3s ease-in-out;

		& input {
			display 		: none;
		}

		&:has(input:checked){
			background 		: 
				#eee 
				url("../images/icon_checked.svg") 
				no-repeat left 1cqw center / 7%;
		}
	}
	
	& h3 {
		font-size 			: 16px;
		font-weight 		: 600;
		color 				: var(--d-black);
		padding-left 		: 1.2em;
		text-indent 		: -1.2em;
		&::before {
			content 		: "● ";
			color 			: var(--cl-pink);
		}
	}
	
	& dl {
		margin-left 	: 1em;
		& div {
			border-top 		: dotted 2px #ccc;
			padding 		: 5px;
		}
		& div:nth-child(1) {
			border-top 		: none;
		}
		& dt {
			font-size 		: 14px;
			font-weight 	: 500;
			color 			: var(--d-black);
		}
		& dd {
			font-size 		: 12px;
			font-weight 	: 400;
			color 			: var(--l-black);
			margin-left 	: 1em;
		}
	}
	
}

.modal_buttons{
    margin-top 					: 30px;
    text-align 					: right;
	
	& button{
		cursor 					: pointer;
		border 					: none;
		padding 				: 12px 24px;
		font-size 				: 15px;
		border-radius 			: 4px;
	}
}

@media (max-width:768px){
	.cookie_inner {
		padding 				: 20px;
	}
	.cookie_buttons {
		flex-direction 			: column;
	}
	.cookie_buttons button {
		width 					: 100%;
	}

	.cookie_modal_content {
		width 					: 94%;
		padding 				: 25px;
	}
}