@import url(../../css/base_product_page_setup/base_product_page_setup_v1.0.0.css);
@import url(https://fonts.googleapis.com/earlyaccess/cwtexyen.css);

.cwTeXYen {
	font-family: 'cwTeXYen';
}

:root {
	--swiper-theme-color: darkgray;	
}



section * {
	letter-spacing: 1px;
}

.eng section * {
	letter-spacing: 0;
}

.eng section.block h3, .eng section.block h1 {
	font-size: 2rem;
}

section a {color: black;}

.noLetterSpacing {
	letter-spacing: 0;
}

.cateHead {
	margin-top: 3rem;
	margin-bottom: 3rem;
	text-align: center;
}

.cateTitle {
	margin-bottom: 1rem;
}

#product_list {background-color: #F3F3F3;}

.productContainer {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

.productItem {
	width: 25%;
	text-align: center;
	margin-bottom: 2rem;
	
	transition: all 0.3s ease;
}

.productItem:hover {
	background-color: #DEDEDE;
}

.productItem img{
	width: 100%;
	max-width: 100%;
}

.productItem .sub_dsec p{
	margin-top: 0;
	margin-bottom: 0;
}

.productItem .sub_dsec img {
	width: 1.25rem;
    max-width: 100%;
    vertical-align: middle;
}

.productItem h1{
	font-size: 1.5rem;
	margin-top: 0;
	margin-bottom:0;
}

.productItem h2{
	font-size: 1.25rem;
	margin-top: 0;
	margin-bottom:0;
	color: gray;
}
#product_list .product_img {width: 100%;}
#product_list .product_img img{max-width: 170px;}



#swiperSection .swiper-slide {
	background-size: cover;
	background-position: center;
	height: 494px;
	transition: height 0.3s ease;
}

.slide_textContainer {
	position: relative;
	margin: 0 auto;
	max-width: 1024px;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}

.slide_textContainer h1{font-size: 2.75rem;}
.slide_textContainer h2{font-size: 1.25rem;}

.eng .slide_textContainer h1{font-size: 2rem;}
.eng .slide_textContainer h2{font-size: 1.25rem;}

.slide_textContainer h1,
.slide_textContainer h2{
	margin-top: 0.25rem;
	margin-bottom: 0.25rem;
	letter-spacing: 0.3rem;
}

.eng .slide_textContainer h1,
.eng .slide_textContainer h2{
	letter-spacing: 0;
}

.slide_textContainer h2{font-weight: bold;}




.flexRow {display: flex;}


@media only screen and (min-width: 1920px){
	#swiperSection .swiper-slide {
		background-size: contain;
		background-repeat: no-repeat;
	}
}

@media only screen and (max-width: 1100px){
	#swiperSection .swiper-slide{
		height: auto;
	}
	
	#swiperSection .swiper-slide::before {
		content: " ";
		padding-top: calc(100% * 494 / 1920);
		
		display: block;
		height: 100%;
	}

	.slide_textContainer {
		transform: translateY(-100%);
	}

	
	.slide_1 .slide_text {
		padding-right: 4rem;
	}
	
	#knowMoreBar {
		padding-top: 1rem;
		padding-bottom: 1rem;
	}
}

@media only screen and (max-width: 800px){

	.slide_textContainer h1{font-size: 2.5rem;}
	.slide_textContainer h2{font-size: 1.5rem;}
	
	.eng .slide_textContainer h1{font-size: 2rem;}
	.eng .slide_textContainer h2{font-size: 1.2rem;}
	
	#swiperSection .swiper-slide::before {
		min-height: auto;
		padding-top: calc(100% * 6 / 8);
	}
}

@media only screen and (max-width: 768px){
	.productItem {
		width: 50%;
		text-align: center;
		margin-bottom: 2rem;
	}
}

@media only screen and (max-width: 640px){
	.slide_textContainer h1{font-size: 2rem;}
	.slide_textContainer h2{font-size: 1.25rem;}
	
	.eng .slide_textContainer h1{font-size: 1.5rem;}
	.eng .slide_textContainer h2{font-size: 1rem;}
	
	.productContainer {
		flex-direction: column;
	}
}

@media only screen and (max-width: 400px){
	.eng .slide_textContainer h1{font-size: 1.25rem;}
	.eng .slide_textContainer h2{font-size: 1rem;}
}