@charset "UTF-8";

.page-journal .journalContainer.-jewelry .articles {
	display: grid;
	align-items: flex-start;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 20px;
}
.page-journal .journalContainer.-jewelry .articles .article{
	width:100%;
	display: block;
}

.page-journal .journalContainer.-jewelry .articles .article figure{
	width:100%;
	margin:0;
}

@media screen and (max-width: 768px) {
	
	.page-journal .journalContainer.-jewelry .articles {
		grid-template-columns: 1fr 1fr;
	}

}


/* netherlands */

.page-journal .journalContainer.-netherlands{
	background-color: var(--c-base);
	padding: min(10vw, 120px) 0px;
}

.page-journal .journalContainer.-netherlands .articles{
	flex-wrap: initial;
	max-width: none;
}

.page-journal .journalContainer.-netherlands .articles .article{
	display:block;
	width:auto;
	max-width: 300px;
	background:#fff;
	padding: 10px;
}

.page-journal .journalContainer.-netherlands .articles .article ul{
	min-height: 5em;
}

.page-journal .journalContainer.-netherlands .articles .article figure{
	margin:0 0 10px 0;
	width:100%;
	aspect-ratio: 1/1.25;
}

.page-journal .journalContainer.-netherlands .articles .article figure img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.page-journal .journalContainer.-netherlands .swiper-horizontal>.swiper-scrollbar,
.page-journal .journalContainer.-netherlands .swiper-scrollbar.swiper-scrollbar-horizontal{
	left: 30%;
	bottom: 10%;
	width: 60%;
	background: #fff;
}

.page-journal .journalContainer.-netherlands .swiper-scrollbar-drag{
	background: var(--c-main);
}

.page-journal .journalContainer.-netherlands .fraction{
	position: absolute;
	bottom:calc(10% - 20px);
	left:15%;
	display: flex;
	align-items: center;
	gap:30px;
}

.page-journal .journalContainer.-netherlands .fraction .swiper-pagination-fraction{
	position: relative;
	bottom:initial;
}

/* initialize */
.page-journal .journalContainer.-netherlands .fraction .swiper-button-prev,
.page-journal .journalContainer.-netherlands .fraction .swiper-button-next{
	position: relative;
	bottom:initial;
	top:initial;
	right: initial;
	left:initial;
	display: inline-block;
	margin:0;
}

.page-journal .journalContainer.-netherlands .fraction .swiper-button-prev,
.page-journal .journalContainer.-netherlands .fraction .swiper-button-next{
	width:40px;
	height: 40px;
	display: block;
	border:1px solid #293855;
	border-radius: 50%;
}
.page-journal .journalContainer.-netherlands .fraction .swiper-button-prev:after{
	display: block;
	width: 40px;
	height: 11.3px;
	background: #293855;
	clip-path: polygon(0 50%, 14.1% 0, 14.1% 45.6%, 100% 45.6%, 100% 54.4%, 14.1% 54.4%, 14.1% 100%);
	position: relative;
	top:calc(50% - 5.4px);
	right:-19px;
}
.page-journal .journalContainer.-netherlands .fraction .swiper-button-next:after{
	display: block;
	width: 40px;
	height: 11.3px;
	background: #293855;
	clip-path: polygon(0 45.6%, 85.9% 45.6%, 85.9% 0, 100% 50%, 85.9% 100%, 85.9% 54.4%, 0 54.4%);
	position: relative;
	top:calc(50% - 5.4px);
	left:-19px;
}


@media screen and (max-width: 768px) {
	.page-journal .journalContainer.-netherlands{
		padding: 16vw 0px;
		margin-top: min(16.6666666667%, 200px);
	}
	.page-journal .journalContainer.-netherlands .articles .article{
		max-width: 200px;
	}	
	.page-journal .journalContainer.-netherlands .swiper-horizontal>.swiper-scrollbar,
	.page-journal .journalContainer.-netherlands .swiper-scrollbar.swiper-scrollbar-horizontal{
		margin-top:1em;
		left:10%;
		bottom:0;
		position: relative;
		width: 80%;
	}

	.page-journal .journalContainer.-netherlands .fraction{
		margin-top:1.5em;
		position: relative;
		bottom:0;
		width:50%;
		left:10%;
	}
	
}


/* special */

.page-journal .specialContainer{
	padding: min(10vw, 60px) 0px;
}

.page-journal .specialContainer .c-headers{
	position: relative;
	background: var(--c-main);
	width:60%;
	left:20%;
	margin:0;
	border-radius: 0 0 0 40px;
	text-align: left;
	padding: 4em;
}
.page-journal .specialContainer .c-headers .header,
.page-journal .specialContainer .c-headers .txt,
.page-journal .specialContainer .c-headers .caption{
	color:#fff;
}

.page-journal .specialContainer .c-headers .caption{
	margin-top:4em;
}

.page-journal .specialContainer .c-headers .caption dt{
	margin-bottom: 1em;
}

.page-journal .specialContainer .c-headers .caption dd{
    font-size: min(1.3333333333vw, 16px);
	line-height: 1.6;
}


.page-journal .specialContainer .c-headers .fraction{
	position: absolute;
	bottom:-70px;
	display: flex;
	align-items: center;
	gap: 30px;
}

.page-journal .specialContainer .fraction .swiper-pagination-fraction{
	position: relative;
	bottom:initial;
}

/* initialize */
.page-journal .specialContainer .fraction .swiper-button-prev,
.page-journal .specialContainer .fraction .swiper-button-next{
	position: relative;
	bottom:initial;
	top:initial;
	right: initial;
	left:initial;
	display: inline-block;
	margin:0;
}

.page-journal .specialContainer .fraction .swiper-button-prev,
.page-journal .specialContainer .fraction .swiper-button-next{
	width:40px;
	height: 40px;
	display: block;
	border:1px solid #293855;
	border-radius: 50%;
}
.page-journal .specialContainer .fraction .swiper-button-prev:after{
	display: block;
	width: 40px;
	height: 11.3px;
	background: #293855;
	clip-path: polygon(0 50%, 14.1% 0, 14.1% 45.6%, 100% 45.6%, 100% 54.4%, 14.1% 54.4%, 14.1% 100%);
	position: relative;
	top:calc(50% - 5.4px);
	right:-19px;
}
.page-journal .specialContainer .fraction .swiper-button-next:after{
	display: block;
	width: 40px;
	height: 11.3px;
	background: #293855;
	clip-path: polygon(0 45.6%, 85.9% 45.6%, 85.9% 0, 100% 50%, 85.9% 100%, 85.9% 54.4%, 0 54.4%);
	position: relative;
	top:calc(50% - 5.4px);
	left:-19px;
}


.page-journal .specialContainer .swiper{
	width:30%;
	position: absolute;
	top:50px;
	right:15%;
}
.page-journal .specialContainer .swiper .articles{
	flex-wrap: initial;
	max-width: none;
	width:100%;
	gap:0;
	padding: 0;
}

.page-journal .specialContainer .swiper .articles .article{
	width:100%;
	display: block;
	border-radius: 0 40px 0 0;
	overflow: hidden;
}

@media screen and (max-width: 768px) {
	.page-journal .specialContainer{
		padding: 8vw 0px;
		margin-top: 40px;
		margin-bottom: 300px;
	}
	
	.page-journal .specialContainer .c-headers{
		width:70%;
		left:5%;
		border-radius: 0 0 0 40px;
		padding: 1em 1em 6em 1em;
	}
	
	.page-journal .specialContainer .c-headers .caption{
		bottom:-210px;
		position: absolute;
		color:var(--c-main);
	}

	.page-journal .specialContainer .c-headers .caption dd{
        font-size: 3.2vw;
        line-height: 1.6666666667;
	}

	.page-journal .specialContainer .c-headers .fraction{
		bottom:-270px;
	}
	
	.page-journal .specialContainer .swiper{
		width:60%;
		position: absolute;
		top:7.5em;
		right:5%;
	}
	
}