@charset "utf-8";


#main_vis{position:relative; width:100%; height:880px; margin-top:80px; overflow:hidden;}
.main_vis_box.slick-slide,
.main_vis_wrap .slick-track,
.main_vis_wrap .slick-list{position:relative; height:100%; }

.main_vis_box.slick-slide{background:no-repeat center center; background-size:cover;}

.main_vis_box.bx1{background-image:url('/images/main/m_visual5.jpg');}
.main_vis_box.bx2{background-image:url('/images/main/m_visual4.jpg');}


.main_txt_wrap{display:table; width:100%; height:100%; text-align:center;}
.main_txt_wrap .mv-txt{padding:12% 0 0 10%;}
.main_txt_wrap dl {display:table-cell; vertical-align:middle; overflow:hidden; color:#FFF;}
.main_txt_wrap dl dt {display:inline-block;  font-size:2.33em; font-weight:500; line-height:1.2em;}
.main_txt_wrap dl dd {font-size:1.06em; margin-top:2.5em; line-height: 1.8em; }

.main_vis_wrap .slick-dots{bottom:30px; left:49%; display:none;}

@media all and (max-width:1599px) {
	.main_txt_wrap .mv-txt{padding:12% 0 0 1%;}
    .main_vis_box.bx1{background-image:url('/images/main/m_visual5_mo.jpg');}
}
@media all and (max-width:1399px) {
		.main_txt_wrap .mv-txt{display:inline-block; padding-top:38%}
/*		.main_vis_box.bx1{background-position:90% center; }*/
		.main_vis_box.bx2{ background-position: center center; }
	
	
}
@media all and (max-width:976px) {
	#main_vis { height: 50vh;   margin-top:70px;  }
/*	.main_vis_box.slick-slide{background-position:75% center; }*/
	.main_txt_wrap .mv-txt{display:inline-block; padding-top:7%; opacity:.5;}
	.main_txt_wrap dl dt {font-size:2em; }
}

@media all and (max-width:568px) {
#main_vis {  height: 40vh; margin-top:65px;  }
		.main_txt_wrap { padding: 0 7%; }
		.main_txt_wrap dl dt {font-size:1.7em; }
		.main_txt_wrap dl dd {font-size:0.95em; }
		.main_txt_wrap .mv-txt {width:50%; padding-top:10%;}

		.main_vis_wrap .slick-dots{bottom:10px; }
}
@media all and (max-width:450px) {
/*	.main_vis_box.bx1{background-position:70% center; }*/
		.main_txt_wrap .mv-txt {width:40%; padding-top:50%;}
}

.m-tit {  text-align: center; margin-bottom: 4em;  }
.m-tit h3 {font-size: 2.0em;  font-family: 'yg-jalnan'; letter-spacing:0em; color:#232323;  margin-bottom: 0.7em; line-height: 1.2em;  }
.m-tit p { font-size: 1.067em; line-height:1.5em;}
.m-tit br {display:none;}
@media all and (max-width:1024px) {
.m-tit {  text-align: center; margin-bottom: 2em;  }

.m-tit br {display:block;}
.m-tit .mo {display:none;}
}


#mIntro {width:100%; height:247px; margin-top:63px; position:relative; overflow:hidden; }
#mIntro:before {content:""; display:block; width:419px; height:310px; background:url(/images/main/m_brand1.png) no-repeat center bottom; position:absolute; left:0; bottom:0;}
#mIntro:after {content:""; display:block; width:444px; height:310px; background:url(/images/main/m_brand2.png) no-repeat center bottom; position:absolute; right:0; bottom:-30px; z-index:-1}
@media all and (max-width:1599px) {
	#mIntro:before {left:-7%;}
	#mIntro:after {right:-7%;}
}
@media all and (max-width:1280px) {
	#mIntro { height:19vw;}
	#mIntro:before {width:30%; background-size:contain}
	#mIntro:after {width:30%; background-size:contain}
}
@media all and (max-width:1024px) {
	#mIntro { height:25vw;}
	#mIntro:before {width:40%; left:-10%;}
	#mIntro:after {width:40%; right:-10%;  bottom:0}
}
@media all and (max-width:830px) {
	#mIntro { height:30vw;}
	#mIntro:before {display:none;}
	#mIntro:after {display:none;}
}
@media all and (max-width:700px) {
	#mIntro { height:35vw;}
}
@media all and (max-width:530px) {
	#mIntro {margin-top:40px;  height:40vw;}
}
@media all and (max-width:430px) {
	#mIntro { height:50vw;}
}






#mBest {width:100%;  background:url(/images/main/mbest-bg.png) repeat-Y center center; padding:9em 0;  position:relative; }
#mBest:before {content:""; display:block; width:137px; height:137px; background:url(/images/main/ttibu1.png) no-repeat center center; position:absolute; left:50%; top:0; margin:-68px;}
.mBest-in {background:#fff; padding:3em 6em}
@media all and (max-width:1680px) {
	.mBest-in {width:90%}
}
@media all and (max-width:1599px) {
	.mBest-in {width:86%}
}
@media all and (max-width:1024px) {
	#mBest { padding:7em 0 3em;  position:relative; }
	#mBest:before {content:""; display:block; width:100px; height:100px; background-size:cover;margin:-45px;}
}
@media (max-width:768px){
	.mBest-in {padding:1.5em 3em}
	#mBest:before {width:80px; height:80px;margin:-40px;}
}
@media (max-width:500px){
	.mBest-in {padding:2em 2em 0 2em}
	#mBest:before {width:80px; height:80px;margin:-40px;}
}



#mBanner ul {overflow:hidden; margin:100px 0;}
#mBanner ul li {float:left; width:33.3%; height:365px; padding:6% 1% 0 1%;  position:relative; overflow:hidden;}
#mBanner ul li:before {content:''; display:block; position:absolute; left:0; top:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; transition:transform 0.7s; z-index:-1}
#mBanner ul li a {display:block; width:100%; height:100%}

#mBanner ul li:nth-child(1):before {background-image:url(/images/main/mbanner1.png)}
#mBanner ul li:nth-child(2) { padding:1%;  }
#mBanner ul li:nth-child(2):before {background-image:url(/images/main/mbanner2.png)}
#mBanner ul li:nth-child(3):before {background-image:url(/images/main/mbanner3.png)}

#mBanner ul li:hover:before {transform:scale(1.05, 1.05)}

#mBanner .mbn1 {text-align:right}
#mBanner .mbn2 {text-align:right}
#mBanner .mbn3 .mbn-t {padding:10% 1% 0 0;}

#mBanner .mbn-t dt {font-size: 2.2em;  font-family: 'yg-jalnan'; letter-spacing:0em; padding:1em 0 0.8em;}
#mBanner .mbn-t dd {color:#767676}
#mBanner .mbn-t dd.st {font-size: 1em; font-family: 'roboto'; font-weight:bold; letter-spacing:0em; color:#4e4e4e }

#mBanner .fc-YL{color:#ffb400;}
#mBanner .fc-BL{color:#6195dc;}
#mBanner .fc-RD{color:#e37084;}
@media all and (max-width:1100px){
	#mBanner .mbn3 .mbn-t {padding:0;}
}

@media all and (max-width:1399px) {
	#mBanner ul li {height:23vw; padding:6% 2% 0 2%;}
	#mBanner .mbn-t dt {font-size: 1.8em;}
	#mBanner .mbn-t dd {font-size: 0.95em; }
	#mBanner .mbn-t dd.st {font-size: 0.8em; }
}
@media all and (max-width:1024px) {
	#mBanner ul li {width:100%; height:30vw; padding:6%;}
	#mBanner ul li:nth-child(2) { padding:6%;  }
	#mBanner .mbn-t dt {font-size: 2.2em;}
	#mBanner .mbn-t dd {font-size: 1em; }
	#mBanner .mbn-t dd.st {font-size: 1em; }
}
@media (max-width:500px){
	#mBanner ul li {height:37vw; }
	#mBanner .mbn-t dt {font-size: 1.8em;  padding:0.8em 0 0.5em;}
	#mBanner .mbn-t dd {font-size: 0.95em; }
	#mBanner .mbn-t dd.st {font-size: 0.8em; }
}
@media (max-width:550px){
	#mBanner ul li {height:40vw; }
}


#mBrand{position:relative; width:1600px; height:612px; margin:0 auto; overflow:hidden; }
.mBrand_box.slick-slide,
.mBrand_wrap .slick-track,
.mBrand_wrap .slick-list{position:relative;  }

.mBrand_box.slick-slide{background:no-repeat center center; background-size:cover;}

.mBrand_box {}
.mBrand_box ul {overflow:hidden;}
.mBrand_box ul li {float:left; width:50%;}

.mBrand_box ul li.txt {padding:9em 5em 5em 5em;}

.mbn-txt dt {font-size:2.188em; color:#696969;  font-family: 'yg-jalnan'; line-height:1.3em; position:relative; margin-bottom:3em;}
.mbn-txt dt:before {content:''; width:121px; height:9px; background:url(/images/main/xoxoxo.png) no-repeat center bottom; position:absolute;  bottom:-40px;}
.mbn-txt dd {font-size:1.068em; color:#232323; line-height:1.5em;}

.more a {display:block; width:100%; height:100%}

.mBrand_wrap .slick-dots{top:30px; right:0;  }

@media all and (max-width:1599px) {
	#mBrand{width:100%; height:38vw;}
	.mBrand_box img {width:100%; }
	.mBrand_wrap .slick-dots{ right:3%;  }
}
@media all and (max-width:1499px) {
	.mbn-txt dd br {display:none;}
	.mbn-txt dt {font-size:2.1em; }
	.mbn-txt dt:before {content:''; width:121px; height:9px; background:url(/images/main/xoxoxo.png) no-repeat center bottom; background-size:cover; position:absolute;  bottom:-40px;}
	.mbn-txt dd {font-size:1.00em;}
}
@media all and (max-width:1199px) {
	.mBrand_box ul li.txt {padding:6em 3em 2em 2em;}
	.mbn-txt dt { margin-bottom:2em;}
	.mbn-txt dt:before {bottom:-28px;}
}
@media all and (max-width:978px) {
	#mBrand{width:100%;height:auto; }

	.mBrand_box img {width:80%; margin:0 auto; }
	.mBrand_box ul li {width:100%; height:55vw;}
	.mBrand_box ul li.txt {height:35vw; padding:3em 9em 9em 9em; background:#fff}

	.mBrand_wrap .slick-dots{top:65%;   }
}
@media all and (max-width:869px) {
	.mBrand_box ul li.txt {height:46vw;  padding:3em 5em;}

	.mBrand_wrap .slick-dots{top:60%;  }
}
@media all and (max-width:675px) {
	.mBrand_box ul li.txt {height:52vw;}

	.mBrand_wrap .slick-dots{top:55%; }
}
@media all and (max-width:500px) {
	.mBrand_box ul li.txt {height:60vw; padding:2em;}

	.mbn-txt dt { margin-bottom:1.5em;}
	.mbn-txt dd {font-size:1.00em;}

	.mBrand_wrap .slick-dots{top:52%;  }
}
@media all and (max-width:450px) {
	.mBrand_box ul li.txt {height:70vw;}
		.mbn-txt dt { margin-bottom:2em;}



	.mBrand_wrap .slick-dots{top:48%;  left:70%;  }
}





#mNew {width:100%;  background:url(/images/main/mnew-bg.png) repeat-Y center center; padding:9em 0 3em;  position:relative; }
#mNew:before {content:""; display:block; width:137px; height:137px; background:url(/images/main/ttibu2.png) no-repeat center center; position:absolute; left:50%; top:0; margin:-68px;}

@media all and (max-width:1024px) {
	#mNew { padding:7em 0 1.5em;  position:relative; }
	#mNew:before {content:""; display:block; width:100px; height:100px; background-size:cover;margin:-45px;}
}
@media (max-width:768px){
	#mNew:before {width:80px; height:80px;margin:-40px;}
}