@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300&display=swap');
* { min-height:0; min-width:0; box-sizing: border-box; }
*:focus	{ outline: none; }
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure, footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video {
  font-size: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
}
body	{ color: #000; background-color: #ffffff; font-family: 'Noto Serif JP', 'HiraMinProN-W6', 'ヒラギノ明朝 ProN W6', 'HiraKakuProN-W6', "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; font-weight: 300; }
.spConInner	{ margin: 0 auto; box-sizing: border-box; }
@media (max-width: 979px)	{ .spConcontainer { width: 100%; margin: 0; padding:0; } }
@media (min-width: 980px)	{ .spConInner { max-width: 1480px; } }
.img-responsive	{ display: block; height: auto; max-width: 100%; }
a:hover img.hov	{ opacity: .6; -webkit-opacity: .6; -moz-opacity: .6; filter: alpha(opacity=60); -ms-filter: "alpha(opacity=60)"; }
a img.hov	{ -webkit-backface-visibility: hidden; -webkit-transition: opacity 0.1s ease-out; -moz-transition: opacity 0.1s ease-out; -ms-transition: opacity 0.1s ease-out; transition: opacity 0.1s ease-out; }
a, a:link, a:visited, a:active	{ color: #000; text-decoration: none; }
a:hover	{ color: #a5a5a5; font-style: normal; text-decoration: none; }
.img-responsive	{ display: block; height: auto; max-width: 100%; }

.fadein {
    opacity : 0;
    transform : translate(0, 20px);
    transition:all 2s;
}
.fadein.scrollin {
    opacity : 1;
    transform : translate(0, 0);
}
.fadeintitle	{  animation-name: fadein; animation-duration: 2s; animation-iteration-count: 1; }
@keyframes fadein	{ 
	from	{ opacity: 0; transform: translateY(0); }
	to	{ opacity: 1; transform: translateY(0); }
}

/* ------------ HEADER ------------- */
@media (max-width: 767px)	{ 
	header	{ display: none; }
}

/* ------------ MAIN ------------- */
.mainVisual	{ position: fixed; top: 0px; left: 0px; width: 100%; height:100vh; padding: 0; z-index:-1; }
.mainVisual-inner	{ width: 100%; height:100%; }
.mainVisual-inner:before	{ content: ''; background-color:rgba(0,0,0,.1); background-attachment: fixed; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index:1; }
.mainVisualimg	{ width: 100%; height:100%; box-sizing: border-box; background-size: cover; background-position-x: center; background-position-y: center; background-repeat: no-repeat; }
.visual01pc	{ background-image: url(../images/top01pc21.jpg); }
.visual02pc	{ background-image: url(../images/top02pc.jpg); }
.visual03pc	{ background-image: url(../images/top03pc.jpg); }
.visual04pc	{ background-image: url(../images/top04pc.jpg); }
.visual05pc	{ background-image: url(../images/top05pc.jpg); }
.visual06pc	{ background-image: url(../images/top06pc.jpg); }
.visual01sp	{ background-image: url(../images/top01sp21.jpg); }
.visual02sp	{ background-image: url(../images/top02sp.jpg); }
.visual03sp	{ background-image: url(../images/top03sp.jpg); }
.visual04sp	{ background-image: url(../images/top04sp.jpg); }
.visual05sp	{ background-image: url(../images/top05sp.jpg); }
.visual06sp	{ background-image: url(../images/top06sp.jpg); }
.tppc	{ display: block; }
.tpsp	{ display: none; }
@media (orientation: portrait) and (max-width: 767px)	{ 
	.mainVisual	{ padding: 0; }
	.tppc	{ display: none; }
	.tpsp	{ display: block; }
}

.mainTitle	{ width: 100%; height:100vh; margin: 0; }
.mainTitle .wrapper	{ width: 100%; height:100%; position: relative; }
.mainTitle .wrapper h1	{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 470px; }
.mainTitle .wrapper h1 img	{ width: 100%; height: auto; }
.mainTitle .line	{ display: block; width: 470px; height:70px; border-right: 1px solid #fff; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); bottom:0; }
@media (orientation: portrait) and (max-width: 767px)	{ 
	.mainTitle	{ width: 100%; height:100%; margin: 0; padding: 0 37px; }
	.mainTitle .wrapper h1	{ width: 100%; padding: 0;  }
	.mainTitle .line	{ width: 100%; height:100px; }
}
@media (orientation: landscape) and (max-height: 490px)	{ 
	.mainTitle .wrapper h1	{ width: 230px; }
	.mainTitle .line	{ width: 230px; height:30px; }
}

.mainCp	{ text-align: center; width: 100%; background-color: #fff; }
.mainCp .wrapper	{ width: 630px; display: block; margin: 0 auto; padding: 200px 0 100px; }
.mainCp .wrapper img	{ width: 100%; height: auto; }
@media (orientation: portrait) and (max-width: 767px)	{ 
	.mainCp .wrapper	{ width: 100%; padding: 100px 37px 93px; }
}
.slider,
.bx-wrapper	{ height: 100%; min-height: 100%; }
.bx-viewport	{ min-height: 100%!important; }

/* ------------ NAVIGATION ------------- */
.navarea	{ display: block; background-color: #fff; text-align: center; padding: 100px 0; margin: 0; }
.navarea > strong	{ display: inline-block; padding: 0; margin: 0 auto 40px; width: 100%; max-width: 110px; }
.navarea > strong > img	{ width: 100%; }
.navarea > ul	{ display: -webkit-flex; display: flex; align-items: center; justify-content: center; margin: 0 auto; }
.navarea > ul > li	{ list-style: none; height:40px; width: auto; margin: 0 20px 0 0; padding: 0; }
.navarea > ul > li:last-child	{ margin: 0; }
.navarea > ul > li > a	{ display: block; border: 1px solid #000; background-color: #fff; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; }
.navarea > ul > li > a.nv01	{ background: #fff url(../images/nvpc01bg.svg) 0 0 no-repeat; background-size: contain; }
.navarea > ul > li > a.nv02	{ background: #fff url(../images/nvpc02bg.svg) 0 0 no-repeat; background-size: contain; }
.navarea > ul > li > a.nv03	{ background: #fff url(../images/nvpc03bg.svg) 0 0 no-repeat; background-size: contain; }
.navarea > ul > li > a.nv04	{ background: #fff url(../images/nvpc04bg.svg) 0 0 no-repeat; background-size: contain; }
.navarea > ul > li > a.nv05	{ background: #fff url(../images/nvpc05bg.svg) 0 0 no-repeat; background-size: contain; }
.navarea > ul > li > a.nv06	{ background: #fff url(../images/nvpc06bg.svg) 0 0 no-repeat; background-size: contain; }
.navarea > ul > li > a.nv01:hover	{ background: #000 url(../images/nvpc01ov.svg) 0 0 no-repeat; }
.navarea > ul > li > a.nv02:hover	{ background: #000 url(../images/nvpc02ov.svg) 0 0 no-repeat; }
.navarea > ul > li > a.nv03:hover	{ background: #000 url(../images/nvpc03ov.svg) 0 0 no-repeat; }
.navarea > ul > li > a.nv04:hover	{ background: #000 url(../images/nvpc04ov.svg) 0 0 no-repeat; }
.navarea > ul > li > a.nv05:hover	{ background: #000 url(../images/nvpc05ov.svg) 0 0 no-repeat; }
.navarea > ul > li > a.nv06:hover	{ background: #000 url(../images/nvpc06ov.svg) 0 0 no-repeat; }
.navarea > ul > li img	{ height:40px; width: auto; }
@media (orientation: portrait) and (max-width: 767px)	{ 
	.navarea	{ padding: 0 37px; }
	.navarea > strong	{ margin: 0 auto 25px; max-width: 104px; }
	.navarea > ul	{ flex-wrap: wrap; justify-content: space-between; }
	.navarea > ul > li	{ width: calc(50% - 7px); margin: 0 0 15px; text-align: center; height:auto; max-height: 40px; }
	.navarea > ul > li:last-child	{ margin: 0 0 15px; }
	.navarea > ul > li img	{ height:auto; max-height:40px; width: 100%; margin: 0 auto; }
	.navarea > ul > li > a	{ background-image:none!important; }
	.navarea > ul > li > a:hover	{ background-color: #fff!important; }
}
@media (orientation: landscape) and (max-height: 490px)	{ 
	.navarea > ul > li	{ height:30px; margin: 0 10px 0 0; }
	.navarea > ul > li img	{ height:30px; }
}


/* ------------ CONTENT ------------- */
.content	{ display:block; text-align: center; padding: 0; width: 100%; background-color: #fff; }
.content .wrapper	{ margin: 0 auto; padding: 0; display:block; width: 100%; }
.content .wrapper > ul	{ display: -webkit-flex; display: flex; flex-direction: column; margin: 0 auto; width: 100%; max-width: 100%; }
.content .wrapper > ul > li	{ list-style: none; text-align: center; padding: 0 0 50px; margin: 0; line-height: 0; }
.content .wrapper > ul > li:last-child	{ padding: 0; }
.content .wrapper > ul > li > a	{ display: inline-block; width: 100%; max-width: 1000px; height:auto; margin: 0 auto; padding: 0; line-height: 0; background-color: #000; position: relative; overflow: hidden; }
.content .wrapper > ul > li > a > img	{ width: 100%; position: relative; z-index:2 }
.content .wrapper > ul > li > a.nv01	{ background: #fff url(../images/pcbt01.jpg) center center no-repeat; background-size: contain; }
.content .wrapper > ul > li > a.nv02	{ background: #fff url(../images/pcbt02.jpg) center center no-repeat; background-size: contain; }
.content .wrapper > ul > li > a.nv03	{ background: #fff url(../images/pcbt03-21.jpg) center center no-repeat; background-size: contain; }
.content .wrapper > ul > li > a.nv04	{ background: #fff url(../images/pcbt04.jpg) center center no-repeat; background-size: contain; }
.content .wrapper > ul > li > a.nv05	{ background: #fff url(../images/pcbt05.jpg) center center no-repeat; background-size: contain; }
.content .wrapper > ul > li > a.nv06	{ background: #fff url(../images/pcbt06.jpg) center center no-repeat; background-size: contain; }
.content .wrapper > ul > li > a:after	{ display: block; content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); opacity: 0; transition: all .5s ease; z-index:1; }
.content .wrapper > ul > li > a:hover:after	{ opacity: 1; }
@media (orientation: portrait) and (max-width: 767px)	{ 
	.content .wrapper	{ padding: 62px 0 69px; }
	.content .wrapper > ul > li	{ padding: 0 0 25px; }
	.content .wrapper > ul > li:last-child	{ padding: 0; }
	.content .wrapper > ul > li > a	{ background-image:none!important; }
}


.minititle	{ background-color: #fff; text-align: center; padding: 0; margin: 0; }
.minititle > p	{ padding: 100px 0 200px; margin: 0 auto; line-height: 0; display: inline-block; width: 100%; max-width: 230px; }
.minititle > p > img	{ width: 100%; }
@media (orientation: portrait) and (max-width: 767px)	{ 
	.minititle > p	{ padding: 87px 0 100px; max-width: 150px; }
}

/* ------------ BRANDS ------------- */
.bottomoval	{ box-sizing: content-box; padding: 0; text-align:center; border-top: 1px solid #000; background-color: #fff; }
.bottomoval .wrapper	{ max-width: 100%; padding: 100px 0 90px; }
.bottomoval .wrapper h2	{ margin: 0 auto 53px; max-width: 90px; display: block; }
.bottomoval .wrapper h2 img	{ width: 100%; vertical-align:bottom; line-height: 0; }
.itemBrandWac	{ margin:0 auto; max-width: 930px; padding: 0 10px; display: -webkit-flex; display: flex; flex-wrap: wrap; }
.itemBrandColumn	{ width: calc(100% / 7); padding: 7px 1.1%; }
.itemBrandColumn img	{ width: 100%; vertical-align:bottom; line-height: 0; }
@media (orientation: portrait) and (max-width: 767px)	{ 
	.bottomoval .wrapper	{ padding: 73px 0 45px; }
	.bottomoval .wrapper h2	{ margin: 0 auto 43px; max-width: 68px; }
	.itemBrandWac	{ margin:0 auto; padding: 0 23px; }
	.itemBrandColumn	{ width: calc(100% / 4); padding: 5px 5px 1px; }
}
.footbtn	{ text-align: center; background-color: #fff; padding: 0; margin: 0; }
.footbtn > a	{ display: inline-block; margin: 0 auto; padding: 93px 0 5px; width: 228px; line-height: 1; }
.footbtn > a > img	{ width: 100%; }
@media (orientation: portrait) and (max-width: 767px)	{ 
	.footbtn > a	{ padding: 70px 0 38px; width: 170px; }
}


/* ------------ FOOTER ------------- */
footer	{ text-align: center; box-sizing: border-box; padding: 0; background-color: #000000; }
footer .footer-inner	{ margin: 0 auto; padding: 20px 0 25px; box-sizing: border-box; line-height: 0; }
footer .footer-inner small	{ color:#ffffff; font-size: 10px; }
@media (max-width: 767px)	{ 
	footer	{ padding: 0 0 10px; }
	footer .footer-inner	{  width: 100%; padding: 15px 0; }
	footer .footer-inner small	{ font-size: 9px; }
}
@media (max-width: 320px)	{ 
	footer .footer-inner small	{ font-size: 6px; -webkit-transform: scale(0.6); -webkit-transform-origin:0 0; }
}

/* ------------ GO TOP ------------- */
#scrollUp { display: none; bottom: 20px; right: 12px; background-color:rgba(255,255,255,0); display:block; width: 30px; height: 30px; overflow: hidden; background-image: url(../images/gotop.png); background-position: center center; background-repeat:no-repeat; background-size:cover; }
a#scrollUp:link, 
a#scrollUp:visited, 
a#scrollUp:hover, 
a#scrollUp:active	{ text-decoration: none; }
a#scrollUp:hover, 
a#scrollUp:active	{ background-color:rgba(255,255,255,0); background-image: url(../images/gotop_ov.png); }
@media (max-width: 767px)	{ 
	#scrollUp {  bottom: 15px; right: 5px; }
}

/* ------------ BLOCK ------------- */
@media (max-width: 567px)	{ .pconly-slider { display: none!important; height: 100%; min-height: 100%; } }
@media (min-width: 568px)	{ .pconly-slider { display: block; height: 100%; min-height: 100%; } }
@media (max-width: 567px)	{ .sponly-slider { display: block; height: 100%; min-height: 100%; } }
@media (min-width: 568px)	{ .sponly-slider { display: none!important; height: 100%; min-height: 100%; } }

@media (max-width: 767px)	{ .pconly { display: none!important; } }
@media (min-width: 768px), (max-width: 813px) and (max-height: 376px)	{ .pconly { display: block; } }
@media (max-width: 767px)	{ .sponly { display: block; } }
@media (min-width: 768px), (max-width: 813px) and (max-height: 376px)	{ .sponly { display: none!important; } }

@media (max-width: 1100px)	{ .pconly_st { display: none!important; } }
@media (min-width: 1101px)	{ .pconly_st { display: block; } }
@media (max-width: 1100px)	{ .sponly_st { display: block; } }
@media (min-width: 1101px)	{ .sponly_st { display: none!important; } }
@media (max-width: 1300px)	{ .pconly_st2 { display: none!important; } }
@media (min-width: 1301px)	{ .pconly_st2 { display: block; } }
@media (max-width: 1300px)	{ .sponly_st2 { display: block; } }
@media (min-width: 1301px)	{ .sponly_st2 { display: none!important; } }

/* ------------ clearfix ------------- */
span.clearfix	{ display:block; }
.clearfix:after	{ content:"."; display:block; height:0; clear:both; visibility:hidden; font-size:0; line-height:0; }
.clearfix	{ *overflow:hidden; *zoom:1; }
.clearfix:not(:target)	{ /* overflow:hidden\9; */ /* zoom:1\9; */ }
* html .clearfix	{ height:1%; overflow:visible; }