/*@import url('//fonts.googleapis.com/css?family=Inter:700&display=swap');*/

:root {
  font-family: 'Inter, sans-serif';
  font-feature-settings: 'liga' 1, 'calt' 1; /* fix for Chrome */
}
@supports (font-variation-settings: normal) {
  :root { font-family: 'InterVariable, sans-serif'; }
}


@font-face {
font-family: 'inter';
src: url(fonts/InterVariable-Italic.woff2);
src: url(fonts/InterVariable.woff2);
}

/*-----*/
.con01 {
line-height: 1.5em;
text-align: center;
word-spacing: 0.1em;
max-width: 100%;
margin-right: auto;
margin-left: auto; }


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

/*BASIC----------*/

.boxBlk {
color: #fff;
background-color: #000; }
.boxGray {
background-color: #f5f5f5;
}
.boxWh {
color: #000;
background-color: #fff; }
.blue {
color: #09f !important; }

.red {
color: #f36 !important; }
.black {
color: #000 !important;
}

.box222 {
color: #fff;
background-color: #222; }

.box2f2725 {
color: #fff;
background-color: #2f2725; }


.white {
color: #fff !important;
}

.txblack {
color: #111 !important;
}

.padLR5em {
	padding-right: 5em;
	padding-left: 5em }

.padLR7em {
	padding-right: 7em;
	padding-left: 7em }

.padLR10em {
	padding-right: 10em;
	padding-left: 10em}

.padLR12em {
	padding-right: 12em;
	padding-left: 12em}

.padLR25vw {
	padding-right: 25vw;
	padding-left: 25vw}

.padLR20vw {
	padding-right: 20vw;
	padding-left: 20vw}

.padLR10vw {
	padding-right: 10vw;
	padding-left: 10vw}

.padLR15vw {
	padding-right: 15vw;
	padding-left: 15vw}

.padLR05vw {
	padding-right: 5vw;
	padding-left: 5vw}

.marLR05em {
	padding-right: 5em;
	padding-left: 5em}



.btn-unisex {
  display: inline-block;
  width: 25em;
  text-align: center;
  text-decoration: none;
  line-height: 8em;
  border-radius: 4em;
  outline: none;
  margin: 1em;
  padding:  1.8em 0 1.4em 0;
  background-color: #1a1c2f;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.btn-unisex h3 {
 color: #fff;
 font-weight: 600;
}

.btn-unisex:hover {
  transform: scale(1.1,1.1);
}



.btn-women {
  display: inline-block;
  width: 25em;
  text-align: center;
  text-decoration: none;
  line-height: 8em;
  border-radius: 4em;
  outline: none;
  margin: 1em;
  padding: 1.8em 0 1.4em 0;
  background-color: #8f3a3e;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.btn-women h3 {
 color: #fff;
 font-weight: 600;
}

.btn-women:hover {
  transform: scale(1.1,1.1);
}




/*-----*/

.hd {
background-color: #1e1e1e;
text-align: left;
position: fixed;
width: 100%;
z-index: 999999; }
.hdWh {
background-color: #fff;
text-align: left;
position: fixed;
width: 100%;
z-index: 999999;
}

/*-----*/



.boxB {
position: relative; 
z-index: 2;
mini-height: 800px; 
background-color: #fff;
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
padding-top: 73px; 
}
.boxBwh {background-color:    #fff;
background-repeat:   no-repeat;
background-position: center top;
mini-height:         800px;
background-size:     cover; }
.boxS {
max-width: 1150px;
margin-right: auto;
margin-left: auto;
padding-top: 50px; }

/*WEARTOP-----*/

.app01 {
position: fixed;
width: 100%;
/*height: 100vh;
background-image: url(img/header_A_1.jpg);
background-size: cover;
background-position: center;*/ }
.PC { }

.SP {
visibility: hidden;
display: none; }

.movPc { 
visibility: visible;
display: block; }

.movSp {
visibility: hidden;
display: none; }



/*
.app01 {
position: fixed;
width: -moz-available; }

.app01 .topImg {
width: 100vw;
margin-left: calc(-50vw + 50%);
max-width: none;
height: auto; }
*/


/*-----*/
.app02B {
position: relative;
margin-bottom: -20px; }


.app02 {
max-width: 100%;
padding-top: 3vh;
padding-bottom: 250px; }


/*PARALLAX-BG-----*/

.paraBg {
background-color: #fff;
position: relative;
z-index: 9998; }

/*-----*/

.app03 {
color: #545353;
max-width: 1000px;
margin-right: auto;
margin-left: auto;
padding-top: 100px;
padding-bottom: 100px; }
.app03U {
margin-bottom: -100px;
display:               grid;
align-items: center;
grid-template-columns: repeat(2, 50%); }
.app03Upara {
text-align: left;
width: 90%;
margin-top: -100px;
margin-right: auto;
margin-left: auto; }
.app03D {
display:               grid;
align-items: center;
grid-template-columns: repeat(2, 50%); }
.app03Dpara {text-align:   left;
margin-top:   100px;
margin-right: auto;
margin-left:  auto;
width:        90%; }
.app03-01 {
font-size:     25px;
font-weight:   bold;
line-height:   125%;
margin-bottom: 5px;
padding-top:   15px; }
/*-----*/
.app04 {
display: grid;
grid-template-columns: repeat(3, 33.3333%);
margin-bottom: 100px;
}
/*-----*/
.app05 {
max-width: 1000px;
margin-right: auto;
margin-bottom: 100px;
display:               grid;
margin-left: auto;
grid-template-columns: repeat(2, 50%); }
/*-----*/
.wearTop05 {
padding-bottom: 65px; }

.wt05-01 {
	color: #fff;
	font-size: 1.5em;
	font-weight: bold;
	background-color: #696969;
	max-width: 200px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 10px;
	padding-bottom: 10px;
	display: block; }

/*--------------------------------------------*/
/*@media screen and (max-width:850px){*/


@media screen and (max-width:1000px){
.app01 {
background-position: 0 top; }

}
@media screen and (max-width:900px){

}
@media screen and (max-width:800px){
/*DEPEND ON YOUTUBE WIDTH*/
/*FOR-YOUTUBE-SMARTPHONE----------*/
.video-container {
position: relative;
padding-bottom: 50%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.video-container iframe,  
.video-container object,  
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/*-----*/
.boxB {
padding-top: 9%;
}
.boxS {
width: 90%; }
.cmnTtl span {
display: block; }

/*-----*/
.PC {
visibility: hidden;
display: none; }
.SP {
visibility: visible;
display: block; }
	
.movPc {
visibility: hidden;
display: none; }
.movSp {
visibility: visible;
display: block; }
	
/*-----*/
.app03U {margin-bottom:         50px;
grid-template-columns: repeat(1, 100%); }

.app03Upara {
margin-top:   0px;
margin-bottom: 50px; }

.app03D {
margin-bottom: 50px;
grid-template-columns: repeat(1, 100%); }

.app03Dpara {margin-top:   50px; }

/*-----*/
.app04 {grid-template-columns: repeat(2, 50%); }
/*.app02 {
width: 100%;
padding-bottom: 0px;
padding-left: 0%; }
.app02Bg {
text-align:     center;
background-color: rgba(0, 0, 0, 0.6);
padding: 0 5% 250px; }*/



}

@media screen and (max-width:600px){
.boxB {padding-top: 10%; }
.boxBwh {
padding-top: 0;	 }
.boxS {
padding-top: 20px;
padding-bottom: 20px; }
.cmnTtl {
font-size: 15px; }

/*-----*/
.app05 {grid-template-columns: repeat(1, 100%); }

/*-----*/
.wearTop05 {
padding-top: 0; }
/*-----*/
}
@media screen and (max-width:560px){


}
@media screen and (max-width:400px){
.boxB {
padding-top: 14%; }
/*--------------------------------------------*/
}