/*서브-상단비주얼 */
#svisual{ width:100%; height:400px;
	background-color: #000;
	background-size: cover; background-position: center; background-repeat: no-repeat;
	margin:0px auto; text-align:left; position:relative; transition:all 0.3s ease;
	padding-top: 140px;}
/*#svisual.s1{background-image: url("../img/sub/svisual_bg01.jpg")}
#svisual.s2{background-image: url("../img/sub/svisual_bg02.jpg")}
#svisual.s3{background-image: url("../img/sub/svisual_bg03.jpg")}
#svisual.s4{background-image: url("../img/sub/svisual_bg04.jpg")}
#svisual.s5{background-image: url("../img/sub/svisual_bg05.jpg")}*/

#svisual .s_text{position:relative; top:10%; max-width:1200px; margin:0 auto; padding:0; box-sizing:border-box; color:#fff; text-align:center}
#svisual .s_text h2{font-size:3.20em; font-weight:400; margin:0 0 20px 0;}
#svisual .s_text p{display:block; font-size:1.3em;}

#container{z-index:0;}
@media screen and (max-width: 1600px) {
	#svisual {
		max-width: 1600px;
	}
}
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 900px) {
	#svisual {
		height: 300px;
	}

	#svisual .s_text h2 {
		font-size: 2.5em;
		margin-bottom: 20px;
	}

	#svisual .s_text p {
		font-size: 1.2em;
	}

}
@media screen and (max-width: 500px) {
	#svisual {
		height: 250px;
		padding-top: 90px;
	}

	#svisual .s_text h2 {
		font-size: 2em;
	}

	#svisual .s_text p {
		display: none;
	}
}

/*내용작업 */
#ctt_con{font-size: 1.1em; line-height: 1.6em;}
#ctt_con h4{font-size: 2.2em; font-weight: 600; margin:20px 0 10px 0;}
#ctt_con h5{font-size: 2em; font-weight:400; margin:10px 0 20px 0;}
#ctt_con .inr{padding:60px 0;}

.ctt_aboutus_jpn p{font-size: 1.1em; line-height: 1.8em; opacity: 0.8;}
.ctt_aboutus_jpn .imgArea{height: 500px; background-position: center; background-size: cover;}
.ctt_aboutus_jpn div.imgArea:nth-child(4n-2){background-attachment: fixed;}
.ctt_aboutus_jpn .mean{text-align: center;}
.ctt_aboutus_jpn .mean img{margin-bottom: 100px;height: 200px;}
.ctt_aboutus_jpn .mean h6{margin-bottom: 20px; font-size: 1.5em; line-height: 1.6em;}
.ctt_aboutus_jpn .mean .dl_wrap{margin: 20px auto; border-top:1px solid #ddd; padding: 20px 0; width: max-content;}
.ctt_aboutus_jpn .mean dl{display: grid; grid-template-columns: 150px auto; margin-bottom: 10px; text-align: left;}

.ctt_history_jpn h5{font-size: 2em; font-weight:400; margin:10px 0 20px 0;}
.ctt_aboutus_jpn .mean h6{margin-bottom: 20px; font-size: 1.5em; line-height: 1.6em;}
.ctt_history_jpn .year_wrap h4{text-align: center; padding: 100px 0; background-color: #000; color: #fff; font-size: 2.5em; display: flex; align-items: flex-start; justify-content: center;}
.ctt_history_jpn .year_wrap h4:before{content: ""; display: inline-block; width: 10px; height: 10px; background-color: #fff; border-radius: 50%; margin: 0 6px;}
.ctt_history_jpn .year_wrap .dl_wrap{position: relative;}
.ctt_history_jpn .year_wrap .dl_wrap:before{content: ""; display: block; position: absolute; width: 1px; height: 100%; background: #eee;
	left: calc(50% - 1px); z-index: 0;}
.ctt_history_jpn .year_wrap .dl_wrap:after{content: ""; display: block; clear: both;}
.ctt_history_jpn .year_wrap .dl_wrap dl{width: calc(50% + 1px); padding: 0 21px;}
.ctt_history_jpn .year_wrap .dl_wrap dl:nth-child(odd){float:left; text-align: right;}
.ctt_history_jpn .year_wrap .dl_wrap dl:nth-child(even){float:right; margin: 40px 0;}

.ctt_history_jpn .year_wrap .dl_wrap dt{font-size: 1.5em; font-weight: 600; margin-bottom: 10px; display: flex; align-items: center;}
.ctt_history_jpn .year_wrap .dl_wrap dt span{width: 20px; height: 20px; border-radius: 50%; background: #00000025;
	display: flex; align-items: center; justify-content: center; margin:0 10px; z-index: 1;}
.ctt_history_jpn .year_wrap .dl_wrap dt span:before{content: ""; display: block; width: 10px; height: 10px; background: #000; border-radius: 50%;}

.ctt_history_jpn .year_wrap .dl_wrap dl:nth-child(odd) dt{flex-direction: row-reverse; margin-right: -40px;}
.ctt_history_jpn .year_wrap .dl_wrap dl:nth-child(even) dt{ margin-left: -40px;}

.ctt_media_jpn ul{display: grid; grid-template-columns: repeat(4, 1fr); align-items: flex-start; gap: 20px;}
#youtube ul{grid-template-columns: repeat(5, 1fr);}
.ctt_media_jpn ul li{background-color: #000;}
.ctt_media_jpn ul li a:hover img{opacity: 0.5;}
.ctt_media_jpn img{width: 100%;}
#influence li{border: 1px solid #eee;}
#youtube li{border-radius: 10px;}
#sns ul{display: block;}
#sns li{background: none; display: flex; align-items: center;}
#sns img{display:inline-block; width: 20px; height: 20px; margin-right: 10px;}

/*라인업*/
.lineupSwiper,
.lineupSwiper .swiper-wrapper{height: 60vh;}
.lineupSwiper .swiper-slide{background-color:#2a2627; background-position: center; background-attachment: fixed; background-size: cover;}
.lineupSwiper .swiper-slide:nth-child(1){background-image: url("../img/sub/lineup_slide01.jpg");}
.lineupSwiper .swiper-slide:nth-child(2){background-image: url("../img/sub/lineup_slide02.jpg");}
.lineupSwiper .swiper-slide:nth-child(3){background-image: url("../img/sub/lineup_slide03.jpg");}
.lineupSwiper .swiper-slide:nth-child(4){background-image: url("../img/sub/lineup_slide04.jpg");}
.lineupSwiper .swiper-slide:nth-child(5){background-image: url("../img/sub/lineup_slide05.jpg");}

.grid{display: grid}
.grid2{grid-template-columns: repeat(2, 1fr);}
.grid3{grid-template-columns: repeat(3, 1fr);}
.grid4{grid-template-columns: repeat(4, 1fr);}
.grid5{grid-template-columns: repeat(5, 1fr);}

.ctt_line_up .banner_wrap{gap: 20px;}
.ctt_line_up .banner{background-color: #eee; padding: 40px 50px;}
.ctt_line_up .banner h4{margin-top: 0!important; margin-bottom: 20px!important;}
.ctt_line_up .banner img{height: 40px;}
.ctt_line_up .banner p{font-size: 1.2em; line-height: 1.6em;}
.ctt_line_up .banner{border-left: 6px solid transparent;}
.ctt_line_up .banner:first-of-type{border-color: #DA5585;}
.ctt_line_up .banner:first-of-type h5{color: #DA5585;}
.ctt_line_up .banner:last-of-type{border-color: #208686;}
.ctt_line_up .banner:last-of-type h5{color: #208686}

.product_list li{position: relative;}
.product_list li img{width: 100%; height: 100%; object-fit: cover;}
.product_list li .name{position: absolute; top: 0;	left: 0; width: 100%; height: 100%;
	z-index: 1; background: #00000065; color:#ffffff; display: flex; align-items: center; justify-content: center;}
.product_list li .name p{opacity: 0.8;}
.product_list li .name span{font-size: 2em;}
.product_list li:hover .name{opacity: 0; transition: all 0.5s;}

#cureher{border-top: 1px solid #eee; padding-top: 40px;}
#cureher h4 img,
#curemed h4 img{height: 25px; filter:saturate(0%); vertical-align: middle; margin-bottom: 4px;}
#curemed{margin-bottom: 40px;}
#curemed .contArea{display: grid; grid-template-columns: repeat(3, max-content); gap: 20px;}
#curemed .contArea dl{background-color: #eeeeee56; padding: 30px 40px;}
#curemed .contArea dt{font-size: 1.3em; margin-bottom: 15px;}
#curemed .contArea dt i{}
#curemed .contArea dd{border-bottom: 1px dotted #ddd; padding-bottom: 4px; margin-bottom: 4px;}
#curemed .contArea dd:before{content: ""; display: inline-block; width: 4px; height: 4px; border-radius: 4px; background-color: #ddd; margin-right: 6px; vertical-align: middle;}


.ctt_technology_jpn .grid{gap: 40px;}
.ctt_technology_jpn .dl_wrap{margin: 20px 0 40px 0; padding:40px 0;}
.ctt_technology_jpn .dl_wrap dl{display: flex; align-items:center;}
.ctt_technology_jpn .dl_wrap dl span{display: inline-block; width: 25px; height: 25px; line-height: 25px; border-radius: 50%; font-size: 12px; background:#000000; color: #fff; text-align: center; margin-right: 6px;}
.ctt_technology_jpn .dl_wrap dt{font-size: 1.1em; margin-bottom: 6px; display: flex; align-items:center; margin-right: 6px;}
.ctt_technology_jpn .dl_wrap dd{font-size: 0.9em;}
.ctt_technology_jpn .textArea{padding:40px 100px;}
.ctt_technology_jpn #beazu .imgArea{height: 500px; background-position: center; background-size: cover; background-image: url("../img/sub/oriental_medical01.jpg")}
.ctt_technology_jpn #beazu .grid:nth-child(2) .imgArea{background-image: url("../img/sub/oriental_medical02.jpg")}
.ctt_technology_jpn #magnetic .grid:last-child .imgArea{background-image: url("../img/sub/oriental_medical03.jpg"); background-position: center; background-size: cover;}


.certi{gap: 20px; margin: 40px 0;}
.certi li{border: 1px solid #eee; position: relative;}
.certi li p{text-align: center; position:absolute; bottom: 0px; padding: 10px; width: 100%; line-height: 1.3em; font-size: 1em; background: #000000; color: #fff;}
.certi img{width: 100%;}

#handmade h5:after{content: ""; display: block; width: 10%; height: 4px; background:#000000; margin: 20px 0;}
#handmade .dl_wrap{margin-top: 50px;}
#handmade .dl_wrap dl{margin-bottom: 30px; display: block;}
#handmade .dl_wrap dt{font-size: 1.4em; margin-bottom: 10px;}
#handmade .dl_wrap dd{padding-left: 0}

#handmade .imgArea{height: 500px; background-position: center; background-size: cover; background-attachment: fixed; background-image: url("../img/sub/handmade.jpg")}


#newspaper{margin-bottom: 100px;}
#newspaper h5{font-size: 2em; font-weight:400; margin:10px 0 20px 0;}
#newspaper ul{display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; padding: 20px 0;}
#newspaper ul li{background: #000;}
#newspaper ul li img{width: 100%;}
#newspaper ul li:hover img{opacity: 0.8;}

#question dl{margin-bottom: 20px;}
#question img{height: 20px;}

@media screen and (max-width: 1400px) {}
@media screen and (max-width: 1200px) {
	#ctt_con .inr{padding-left: 40px; padding-right: 40px;}
}
@media screen and (max-width: 992px) {
	#ctt_con .inr{padding-left: 20px; padding-right: 20px;}
	.certi.grid5{grid-template-columns: 1fr 1fr 1fr;}
	.ctt_technology_jpn .textArea{padding-left: 20px; padding-right: 20px;}
	.ctt_technology_jpn .grid{gap: 20px;}

}
@media screen and (max-width: 768px) {
	#ctt_con .inr{padding-left: 10px; padding-right: 10px;}

	#ctt_con h4{font-size: 1.8em;}
	#ctt_con h5{font-size: 1.5em;}

	.ctt_aboutus_jpn .mean{text-align: left;}
	.ctt_aboutus_jpn .mean img{height: auto; width: 80%; margin: 0 auto 40px;}


	.ctt_history_jpn .year_wrap h4{display: block;}
	.ctt_history_jpn .year_wrap h4 strong{display: block; margin-bottom: 10px;}

	.ctt_media_jpn ul{grid-template-columns: 1fr 1fr; gap: 10px;}
	#youtube ul{grid-template-columns: 1fr 1fr; gap: 10px;}

	#newspaper ul{grid-template-columns: 1fr 1fr;}

	.product_list.grid4{grid-template-columns: 1fr 1fr;}
	.certi.grid5{grid-template-columns: 1fr 1fr; gap: 10px;}

	#beazu .grid,
	#magnetic .grid{display: block;}
	.ctt_technology_jpn .textArea{padding-left: 10px; padding-right: 10px;}
	.ctt_technology_jpn .dl_wrap dl{display: block;}
	.ctt_technology_jpn .dl_wrap dl dt{margin-bottom: 0;}
	.ctt_technology_jpn .dl_wrap dl dd{padding-left: 32px; margin-bottom: 10px;}
	.ctt_technology_jpn .imgArea{height: 200px;}
	.ctt_technology_jpn .dl_wrap{padding: 0; margin: 0;}


}
@media screen and (max-width: 500px) {
	#ctt_con {font-size: 1em;}
	.ctt_history_jpn .year_wrap .dl_wrap{padding-left: 20px;}
	.ctt_history_jpn .year_wrap .dl_wrap:before{left: 20px;}
	.ctt_history_jpn .year_wrap .dl_wrap dl{width: 100%;}
	.ctt_history_jpn .year_wrap .dl_wrap dl:nth-child(odd){text-align: left;}
	.ctt_history_jpn .year_wrap .dl_wrap dl:nth-child(even){float: left;}
	.ctt_history_jpn .year_wrap .dl_wrap dl:nth-child(odd) dt{flex-direction: unset;}
	.ctt_history_jpn .year_wrap .dl_wrap dl:nth-child(odd) dt{margin-left: -40px;}

	/*.ctt_media_jpn ul{grid-template-columns: 1fr;}*/
	.product_list.grid4{grid-template-columns: 1fr;}

}
