@charset "utf-8";
/*
construction.css
*/

body{background: #fff;}

.allwrap{margin-left: 5vw; display: block; background: #eeeeee;}
.wrap{width: auto; display: block; margin: 0 10vw 5vw 5vw;}
.wrap:last-child{margin-bottom: 0;}
.title2{text-align: right;line-height: 0;position: relative;display: block;margin-bottom: calc(5vw + 25px);/* margin-top: 5vw; */margin-right: -2.5vw;position: relative;z-index: 2;}
.title2 span{line-height: 20px;}
.title2 img{ height: 20px; width: auto;}
.title2::after{ content: ""; width: 30px; height: 4px; display: block; background: #000; position: absolute; right: 0; bottom:-20px;}

@media screen and (min-width: 901px){}
@media screen and (max-width: 1300px){
	.allwrap{margin-left: 5vw; display: block; background: #eeeeee;}
	.wrap{width: auto;display: block;margin: 0 10vw 5vw 10vw;}
	.title2{margin-bottom: calc(10vw + 15px);margin-right:0;}
	.title2 span{line-height: 15px;}
	.title2 img{ height: 15px; width: auto;}
}
@media screen and (max-width: 900px){
	.allwrap{margin-left: 0;}
	.title2 img{height: 15px;width: auto;}
	.title2::after{ height: 2px; bottom:-10px;}
	.wrap{width: auto;display: block;margin: 0 5vw 5vw;}
}
@media screen and (max-width: 600px){}

.bgTopWrap{background: url(../img/s_bg_contents.svg) no-repeat top left;background-size: 119.4%;}

.bgWrap{background: url(../img/s_bg_contents_f.svg) no-repeat right bottom;background-size:100%;}

#home #main .mainImg::after{ content:""; width: 150%; height:100%; position: absolute; left: -25%; top: 0; background: #000; transform: skewX(-14deg);}
#home #main .mainImg {height: 105vh;width: 100%;background: url(../img/main.jpg) no-repeat center;background-size:cover; overflow: hidden;}
#home #main .lead{fill: #fff;width: 30vw;height: auto;position: absolute;right: 2.5vw;top: 50%;transform: translateY(-50%) translateX(5%);  opacity: 0;}

#home #main.is-animation .mainImg::after{ transform: translateX(-150%) skewX(-14deg); 
	-webkit-transition: all 1s cubic-bezier(0.4, 0, 1, 1) 0s;
	transition:all 1s cubic-bezier(0.4, 0, 1, 1) 0s;
}
#home #main.is-animation .lead{transform: translateY(-50%) translateX(0%); opacity: 1;
	-webkit-transition: all 0.75s cubic-bezier(0.39, 0.58, 0.57, 1) 0.5s;
	transition:all 0.75s cubic-bezier(0.39, 0.58, 0.57, 1) 0.5s;
}

#home .sectionMov .title2{ opacity: 0; transform: translateX(10px);}
#home .sectionMov .title2::after{transform: skewX(-14deg) scaleX(0);}

#home .sectionMov.is-animation .title2{
	opacity: 1; transform: translateX(0vw);
	-webkit-transition: all 0.7s ease-out 0.3s;
	transition:all 0.7s ease-out 0.3s;
}
#home .sectionMov.is-animation .title2::after{
	-webkit-transition: all 0.7s ease-out 0.3;
	transition:all 0.7s ease-out 0.3s;
	transform: skewX(-14deg) scaleX(1);
}


#home #concept{background: #fff;min-height: 105vh;position: relative;overflow: hidden; }
#home #concept::before{content: "";width: 120%;height: 101%;position: absolute;left: 0px;top: 0;background: url(../img/concept_bg.svg) no-repeat center top;background-size: cover;z-index: 1;}
#home #concept .title2{margin-bottom: 10vw;}
#home #concept .conceptImg{width: 60vw;height: 100%;display: block;position: absolute;left: 0;top: 0;overflow: hidden;z-index: 0;background: url(../img/concept.jpg) no-repeat center;background-size: cover;}
#home #concept .conceptImg img{width: 100%;height: auto;position: absolute;top: 50%;left: 0;transform: translateY(-50%);}
#home #concept .wrap{position: relative;padding-top: 5vw;z-index: 2;/* overflow: hidden; */}
#home #concept .conceptText{width: 30vw;display: block;/* margin-left: 50vw; */float: right;margin-bottom: 10vw;}
#home #concept .conceptText .lead2{margin-bottom: 10vw;display: block;line-height: 0;}
#home #concept .conceptText .lead2 span{display: block;text-align: left;}
#home #concept .conceptText .lead2 img{height: 55px; width: auto;}
#home #concept .conceptText p{margin-bottom: 1.25vw;}
#home #concept .conceptText p:last-child{margin-bottom: 0;}
#home #lineup {display: block;margin-bottom: 0; padding-top: 10vw;}

/*anime*/
#home #concept .conceptImg{transform: translateY(-10px); opacity: 0;}
#home #concept.sectionMov.is-animation .conceptImg{transform: translateY(0); opacity: 1;
	-webkit-transition: all 1s ease-out 0s;
	transition:all 1s ease-out 0s;
}
#home #concept .conceptText .lead2{ opacity: 0; transform: translateX(10px);}
#home #concept.sectionMov.is-animation .lead2{left: -2.5vw;position: relative;opacity: 1;transform: translateX(0px);-webkit-transition: all 1s ease-out 0.5s;transition:all 1s ease-out 0.5s;}

#home #concept .conceptText p{opacity: 0; transform: translateX(10px);}
#home #concept.sectionMov.is-animation .conceptText p{opacity: 1; transform: translateX(0px) ;
-webkit-transition: all 1s ease-out 1s;
	transition:all 1s ease-out 1s;
}


.portrait #home #main .mainImg{/* background: url(../img/main_length.jpg) no-repeat center!important; */background-size: cover;}

@media screen and (min-width: 901px){}
@media screen and (max-width: 1300px){
	#home #main .mainImg{height: 100vh;background: url(../img/main.jpg) no-repeat center;background-size: cover;}
	
	#home #concept{min-height: 50vh;}
	#home #concept .wrap{padding-top: 10vw;}
	#home #concept .conceptImg{width:60vw;}
	#home #concept .conceptImg img{height: 100%; width:auto; right: 0; left: initial;}
	#home #concept .conceptText{width: 35vw;margin-bottom: 10vw;}
	#home #concept .conceptText .lead2 img{height: 30px;width: auto;}
}

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

@media screen and (max-width: 900px){
	#home #main .mainImg{height: 80vw;/* margin-top: 40vh; */}
	#home #main .lead{right: 5vw;top: 35vh;bottom: inherit;transform:none;width: 60vw;fill: #000;}
	#home #concept{padding-bottom: 180%;background: url(../img/sp_concept_sp.jpg)#e7f2fa bottom center no-repeat;background-size: cover;position: relative;}
	#home #concept .wrap{}
	#home #concept::before{content: "";width: 100%;height: 100%;display: block;position: absolute;left: 0;top: 0;background: url(../img/s_bg_contents.svg) no-repeat top left;background-size: 72%;}
	#home #concept .conceptImg{width: 100%;height: auto;top: initial;bottom: 0;display: none;}
	#home #concept .conceptImg img{height: auto;width: 100%;right: 0;left: initial;}
	#home #concept .conceptText{width: 100%;margin-bottom: 10vw;}
	#home #concept .conceptText .lead2 img{height: 30px;width: auto;}
	#home #lineup{margin-bottom: 20vw;}
}
@media screen and (max-width: 600px){}

#home .lineupList{margin-bottom: 10vw;}
#home #lineup .moreLink{opacity: 0;-webkit-transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);transform-origin: 0;}
#home #lineup .productLink:hover .moreLink{opacity: 1;}

#home .product.act1 .typeA{ opacity: 1; -webkit-transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);}
#home .product.act1 .typeB{ opacity: 0; -webkit-transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);}
#home .product .typeA{ opacity: 0; -webkit-transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);}
#home .product .typeB{opacity: 1;display: block;position: absolute;left: 50%;transform: translateX(-50%);top: 0; -webkit-transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);}

#home .product .whach{text-align: center;}
#home .product .whach img{width: 80%;height: auto;margin: 0 auto;}
#home .product.box-column5 .box-column-size1{width:4.5vw;}
#home .product.box-column5 .box-column-size1:last-child{margin-right: 0;}

#home .product .whach{display: block;margin-bottom: 30px;position: relative;}
#home .product .whachname{text-align: center;margin-bottom: 30px;}
#home .product .whachname img{height: 30px; width: auto;}
#home .product a{display: block;}
#home .product a .whach{ display: block; transform: scale(1); -webkit-transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);}


.strap .title4{text-align: center;font-size: 11px;display: block;line-height: 1em;margin-bottom: 10px;font-weight: bold;letter-spacing: 0.1em;}
#home .sectionMov.is-animation .product .storesjp-button-cart{margin-top: 40px;}

.strapClist{overflow: hidden;text-align: center;}
.strapClist li{ width: calc(50% - 5px); display: block; float: left; cursor: pointer;}
.strapClist li:first-child{margin-right: 10px;}
.strapClist li .strapC{display: block;line-height: 1.8em;font-size: 11px;text-align: center;letter-spacing: 0.1em;box-sizing: border-box; }


.strapC.color-b{ border: #000 1px solid;  color: #000; }
.strapC.color-n{ border: #913e0c 1px solid; color: #913e0c;}
.strapC.color-m{ border: #3d291b 1px solid; color: #3d291b;}
.strapC.color-bl{ border: #003189 1px solid; color: #003189;}
.strapC.color-db{ border: #124746 1px solid; color: #124746;}
.strapC.color-t{ border: #591500 1px solid; color: #591500;}

.act .strapC.color-b,.strapC.color-b:hover{ background: #000; color: #fff; }
.act .strapC.color-n,.strapC.color-n:hover{ background: #913e0c; color: #fff;}
.act .strapC.color-m,.strapC.color-m:hover{ background: #3d291b; color: #fff;}
.act .strapC.color-bl,.strapC.color-bl:hover{ background: #003189; color: #fff;}
.act .strapC.color-db,.strapC.color-db:hover{ background: #124746; color: #fff;}
.act .strapC.color-t,.strapC.color-t:hover{ background: #591500; color: #fff;}

/*anime*/
#home .sectionMov .product{opacity: 0; transform:translateY(30px) ;}
#home .sectionMov.is-animation .product{opacity: 1; transform:translateY(0px);-webkit-transition: all 1s cubic-bezier(0.39, 0.58, 0.57, 1) 0.5s;transition: all 1s cubic-bezier(0.39, 0.58, 0.57, 1) 0.5s;}

#spec{opacity: 0; transform:translateY(30px) ;}
#home .sectionMov.is-animation #spec{opacity: 1; transform:translateY(0px); -webkit-transition: all 1s cubic-bezier(0.39, 0.58, 0.57, 1) 1s;transition: all 1s cubic-bezier(0.39, 0.58, 0.57, 1) 1s;}

@media screen and (min-width: 901px){
	#home .product a:hover .whach{ transform: scale(1.05);}
	
}
@media screen and (max-width: 1300px){
#home .product .whach img{width: 100%;height: auto;margin: 0 auto;}
#home .product .whach{ display: block; margin-bottom: 15px;}
#home .product .whachname{text-align: center;margin-bottom: 15px;}
#home .product .whachname img{height: 20px; width: auto;}
.strapClist li{ width:100%; display: block; float: none;}
.strapClist li:first-child{margin-right: 0; margin-bottom: 5px;}
}
@media screen and (max-width: 900px){
	#home .product .whach img{height: 60vh;width: auto;}
	.strapClist li {width: calc(50% - 5px);max-width: 150px;display: inline-block;float: none;}
	.strapClist li:first-child{margin-right: 5px;}
	#home #lineup .moreLink{opacity: 1;display: none;}
	#home .sectionMov.is-animation #spec{margin-bottom: 10vw;}
}
@media screen and (max-width: 600px){}


.moreLink{width: 25px;height: 25px;position: absolute;bottom: -50px;left: 50%;transform: translateX(-50%) translateY(0%);border-radius: 25px;border: 1px solid #000;/* background: rgba(0, 0, 0, 0.9); */margin: 15px auto 0;text-indent: -9999px;overflow: hidden;}
.product .moreLink::before{content: "";width: 8px;height: 1px;display: block;position: absolute;background: #000;left: 50%;top: 50%;transform: translateX(-50%) translateY(-50%);}
.product .moreLink::after{content: "";width: 1px;height: 8px;display: block;position: absolute;background: #000;left: 50%;top: 50%;transform: translateX(-50%) translateY(-50%);}

.closeBtn span{width: 40px;height: 40px;position: relative;display: block;border-radius: 20px;border: 1px solid #000;margin: 0 auto 0;text-indent: -9999px;overflow: hidden;transform: rotate(45deg); -webkit-transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1);transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1);}
.closeBtn span::before{ content: ""; width: 10px; height: 1px; display: block; position: absolute; background: #000; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); -webkit-transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1);transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1);}
.closeBtn span::after{ content: ""; width: 1px; height: 10px; display: block; position: absolute; background: #000; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); -webkit-transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1);transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1);}

/*photo*/
#home #photo{width: 100%;/* height: 100vh; */box-sizing: border-box;display: block;padding: 10vw 0 0 0;}
.instaList .feed img{width: 100%;height: auto;margin-bottom: 20px;}
.instaDeta{display: block;padding-left: 6em;position: relative;text-align: left;}
.instaDeta time{font-size: 11px;text-align: left;position: absolute;left: 0;top: 0;}

.instaList .feed{opacity: 0; transform: translateY(50px);}
.is-animation .instaList .feed{padding-bottom: 10px;opacity: 1;position: relative;transform: translateY(0px);-webkit-transition: all 1s cubic-bezier(0.39, 0.58, 0.57, 1) 1s;transition: all 1s cubic-bezier(0.39, 0.58, 0.57, 1) 0.5s;}

@media screen and (min-width: 901px){
	.closeBtn:hover span{background: #000;}
	.closeBtn:hover span::after{background: #fff;}
	.closeBtn:hover span::before{background: #fff;}
	
	.is-animation .instaList .feed::after{content: "";width: 100%;height: 2px;transform:scaleX(0) skewX(-14deg);transform-origin: left;position: absolute;left: 0;/* top: calc(50% - 2px); */bottom: 0;background: #000;-webkit-transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1);transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1);}
	.is-animation .instaList .feed:hover::after{transform:scaleX(1) skewX(-14deg);}
	
}
@media screen and (max-width: 1300px){
	.instaList .feed img{margin-bottom: 10px;}
.instaDeta{display: block;padding-left: 0em;position: relative;text-align: left;line-height: 1.5em;}
.instaDeta time{font-size: 11px;text-align: left;position:relative;display: block;line-height: 1.5em;left: 0;top: 0;}
}
@media screen and (max-width: 900px){
	.moreLink{width: 30px;height: 30px;position: relative;border-radius: 20px;border: 1px solid #000;margin: 15px auto 0;text-indent: -9999px;overflow: hidden;}
}
@media screen and (max-width: 600px){}

/*contact*/
#home #contact{ height: 100vh; width: 100%; display: block; position: relative;}
#home #contact .lead2 {display: inline-block;position: absolute;left: 50%;top: 50%;transform: translateX(-50%) translateY(-50%);}
#home #contact .lead2 span{display: block;}
#home #contact .wrap{display: block;/* width: 100%; */height: 100%;}
#home #contact .lead2 svg{ height: 55px; width: auto;}


#home #contact .lead2{opacity: 0; transform: translateX(-50%) translateY(-20%);}
#home #contact.is-animation .lead2{opacity: 1; transform: translateX(-50%) translateY(-50%); -webkit-transition: all 1s cubic-bezier(0.39, 0.58, 0.57, 1) 0s;transition: all 1s cubic-bezier(0.39, 0.58, 0.57, 1) 0s;}

.underLine::after{content: "";width: 100%;height: 4px;display: block;background: #000;transform: skewX(-14deg) scaleX(0);position: absolute;right: 0;bottom: -20px;}
.is-animation .underLine::after{transform: skewX(-14deg) scaleX(1); 
	-webkit-transition: transform 1s cubic-bezier(0.39, 0.58, 0.57, 1) 1.5s;
	transition: transform 1s cubic-bezier(0.39, 0.58, 0.57, 1) 1.5s;
}

@media screen and (min-width: 901px){
	#home #contact.is-animation .lead2.underLine:hover::after{background: #999; -webkit-transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1) 0s;
	transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1) 0s;}
	#home #contact.is-animation .lead2.underLine:hover svg{fill:#999; -webkit-transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1) 0s;
	transition: all 0.3s cubic-bezier(0.39, 0.58, 0.57, 1) 0s;	}

	
}
@media screen and (max-width: 1300px){
	#home #contact .lead2 svg{ height: 30px; width: auto;}
	#home #contact{height: 80vh;}
}
@media screen and (max-width: 900px){
	#home #contact .lead2 svg{ height: 20px; width: auto;}
}
@media screen and (max-width: 600px){}


/*spec*/
#home .specList{border-top: 2px solid #000;letter-spacing: 0.05em;}
#home .specList dt{width: 15%;font-size: 13px;border-bottom: 1px solid #000;background: #fff;text-align: left;font-weight: bold;padding: 10px 20px 10px 10px;line-height: 1.5em;}
#home .specList dd{width: 35%;border-bottom: 1px solid #000;text-align: left;padding: 10px 20px;font-size: 13px;line-height: 1.5em;}


/*.subpage*/
.subpage{padding-bottom: 10vw;padding-top: 10vw;}
.subpage .title2{margin-bottom: 10vw;}
.subpage .box-column1 .wrap{margin: 0 0 5vw;}

@media screen and (min-width: 901px){}
@media screen and (max-width: 1300px){
	.subpage{padding-bottom: 10vw;padding-top: 30vw;}
}
@media screen and (max-width: 900px){
	#home .specList dt{width: 30%;}
	#home .specList dd{ width: 70%;}
}
@media screen and (max-width: 600px){}

.dlList{border-top: 2px solid #000;letter-spacing: 0.05em;}
.dlList dt{width: 25%;font-size: 13px;border-bottom: 1px solid #000;background: #fff;text-align: left;font-weight: bold;padding: 10px 20px 10px 10px;line-height: 1.5em;}
.dlList dd{width: 75%;border-bottom: 1px solid #000;text-align: left;padding: 10px 20px;font-size: 13px;line-height: 1.5em;}

#map{width: 100%; height: 70vh; margin-bottom: 5vw;}
#map > *{width:100%; height: 100%;}

/*contact*/
#contact .title3{border-bottom: 2px solid #000; padding-bottom: 15px;} 
#contact .mailList{margin-bottom: 5vw; padding-top: 2.5vw; }
#contact .mailList dt{width: 25%;text-align: left;margin-bottom: 20px;padding: 10px 0;font-size: 13px;line-height: 1.5em;}
#contact .mailList dd{width: 75%;text-align: left;margin-bottom: 20px;border-bottom: 1px solid #999;}
#contact .mailList dd .text{width: 100%!important;background: none;border: none;padding: 10px 15px;line-height: 1.5em;}
#contact .mailList dd .textArea{width: 100%!important;background: none;border: none;padding: 10px 15px;line-height: 1.5em;}
#contact .mailList dd label{display:block;font-size: 13px;margin-left: 10px;}
#contact .mailList dd label:last-child{margin-bottom: .5em;}
#contact .mailList dd label input{margin-right: 0.5em;}
#contact .mailList dd label span{font-size: 13px; line-height: 2em;}
body #contact .submitBtn{width: 100%;  line-height: 1.0em; background-color: #000000; color: #ffffff; font-size: 16px; font-family: 'Domine', serif; -moz-osx-font-smoothing: auto; -webkit-font-smoothing: subpixel-antialiased; letter-spacing: .04em; padding: 20px 0; display: block; border: none;}
#contact #thanks{text-align: left; min-height: 50vh;}
#contact #thanks .arr {    color: #999999;    font-family: 'Domine', serif;}
#contact #thanks .title3{margin-bottom: 50px;}
#contact #thanks p{margin-bottom: 50px;}

/*productPage*/
#productPage .productCont {width: 100%; display: block; overflow: hidden; }
#productPage .productName{width: 7.5vw; position: absolute; left: 50%; top: 2.5vw; transform: translateX(-50%);}
#productPage .productName img:first-child{width: 75%;height: auto;margin: 0 auto 10px;}


#productPage .productName img:last-child{width:100%; height: auto; margin: 0 auto;}
#productPage .productCont .productWrap{ width: 50%; display: block; float: left;}
#productPage .productCont .productWrap .whole{width: 35%; text-align: center; position: relative;}
#productPage .productCont .productWrap .detail{width: 65%;}
#productPage .productCont .productWrap .upImg,
#productPage .productCont .productWrap .strapImg{height: 50vh; width: 100%; display: block; overflow: hidden; position: relative;}
#productPage .productCont .productWrap:first-child .whole figure{width:auto;height: 50vh;margin: 0 auto;position: absolute;left: 50%;top: calc(50% - 70px);transform: translateX(-45%) translateY(-50%);}
#productPage .productCont .productWrap:last-child .whole figure{width:auto;height: 50vh;margin: 0 auto;position: absolute;left: 50%;top: calc(50% - 70px);transform: translateX(-55%) translateY(-50%);}
#productPage .productCont .productWrap .whole figure img{height: calc(100% - 60px);width: auto;margin-bottom: 20px;}
#productPage .productCont .productWrap .detail img{width: 100%; height: auto; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%);}
#productPage .productCont .strapClist li{width: 100%;max-width: 100px;margin: 0 auto;display: block;float: none;}
#productPage .closeBtn {position: fixed;bottom: 40px;left: 50%;transform: translateX(-50%);z-index: 5001;}
.storesBtnArea{ position: fixed; width: calc(30% - 30px); bottom:100px; left: 50%;transform: translateX(-50%);z-index: 999999999; display: none; }
.storesBtnArea p{font-size: 0.8rem; line-height: 1.8rem;}

.storesBtnArea.act{display: block;}
html.drower.bb .storesBtnArea.bbsel,
html.drower.mm .storesBtnArea.mmsel,
html.drower.sg .storesBtnArea.sgsel,
html.drower.sr .storesBtnArea.srsel,
html.drower.wb .storesBtnArea.wbsel{opacity: 0;}

.pageNete {}
.pageNete .next{position: fixed;right: 2.5vw;top: 50%; z-index: 10; transform: translateY(-50%);  color: #000;}
.pageNete .prev{position: fixed;left: 2.5vw;top: 50%; z-index: 10; transform: translateY(-50%); color: #000;}

.pageNete .next:hover span,
.pageNete .prev:hover span{transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);}
.pageNete .next span::after{ content: ""; width: 200%; height: 2px; display: block; background: #000; transform: skewX(-14deg);position: absolute; left: 0; bottom:-10px; transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);}
.pageNete .prev span::after{ content: ""; width: 200%; height: 2px; display: block; background: #000; transform: skewX(-14deg);position: absolute; right: 0; bottom:-10px; transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);}

html.drower{overflow-y: hidden;}
html.drower #barba-wrapper{overflow-y:auto; overflow-x: hidden;}

@media screen and (min-width: 901px) {
	.pageNete .prev:hover span{color: #999!important;}
	.pageNete .next:hover span{color: #999!important;}
	.pageNete .next:hover span::after{background: #999;}
	.pageNete .prev:hover span::after{background: #999;}
}

@media screen and (max-width: 1300px) {
#productPage .productCont .productWrap .whole{width: 30%; text-align: center; position: relative;}
#productPage .productCont .productWrap .detail{width: 70%;}
}

@media screen and (max-width: 900px){
#productPage{padding-top: 0;padding-bottom: 15vh;}
#productPage .productCont {width: 100%; display: block; overflow: hidden; }
#productPage .productName{width: 25vw;position:relative;left:inherit;top:inherit;transform:none;margin: 0 auto 15vw;}
#productPage .productName img:first-child{margin: 0 auto 5px;}
#productPage .productName img:last-child{}
#productPage .productCont .productWrap{ width: 100%; }
#productPage .productCont .productWrap .whole{width: 50%;}
#productPage .productCont .productWrap .detail{width: 50%;}
#productPage .productCont .productWrap .upImg,
#productPage .productCont .productWrap .strapImg{height: 50vw;}
#productPage .productCont .productWrap:first-child .whole figure,
#productPage .productCont .productWrap:last-child .whole figure{width:auto;height: 85vw;margin: 0 auto;position: absolute;left: 50%;top: 50%;transform: translateX(-50%) translateY(-55%);}
#productPage .productCont .productWrap .whole figure img{height: calc(100% - 60px);width: auto;margin-bottom: 20px;}
#productPage .productCont .productWrap .detail img{width: auto;height: 100%;position: absolute;left: 50%;top: 50%;transform: translateX(-50%) translateY(-50%);}
	#productPage .closeBtn{bottom:100px;}
#productPage .productCont .strapClist li{width: 100%;max-width: 100px;margin: 0 auto;display: block;float: none;}
#contact .mailList dt{width: 100%;text-align: left;margin-bottom: 0;padding: 10px 0 0 0;font-size: 13px;line-height: 1.5em;}
#contact .mailList dd{width: 100%;text-align: left;margin-bottom: 10px;padding: 0;border-bottom: 1px solid #999;}
	
.storesBtnArea{position: fixed;width: 100%;bottom: 0;padding-top: 10px;left:auto;transform:none;background: #eee;line-height: 1.5em;}

.storesBtnArea p{font-size: 0.8rem; line-height: 1.8rem;}


}


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

/*縦長*/
.portrait #productPage .productCont .productWrap{ width: 100%; }
.portrait #productPage .productCont .productWrap .whole{width: 50%;}
.portrait #productPage .productCont .productWrap .detail{width: 50%;}
.portrait #productPage .productCont .productWrap .upImg,
.portrait #productPage .productCont .productWrap .strapImg{height: 50vw;}
.portrait #productPage .productCont .productWrap:first-child .whole figure,
.portrait #productPage .productCont .productWrap:last-child .whole figure{width:auto;height: 85vw;margin: 0 auto;position: absolute;left: 50%;top: 50%;transform: translateX(-50%) translateY(-55%);}
.portrait #productPage .productCont .productWrap .whole figure img{height: calc(100% - 60px);width: auto;margin-bottom: 20px;}
.portrait #productPage .productCont .productWrap .detail img{width: auto;height: 100%;position: absolute;left: 50%;top: 50%;transform: translateX(-50%) translateY(-50%);}
.portrait #productPage .productCont .strapClist li{width: 100%;max-width: 100px;margin: 0 auto;display: block;float: none;}
.portrait #productPage .productName{width: 15vw;position:relative;left:inherit;top:inherit;transform:none;margin: 40px auto;}
.portrait #productPage .productName img:first-child{margin: 0 auto 15px;}
.portrait #productPage .productName img:last-child{}

@media screen and (max-width: 600px){
	.portrait #productPage .productName img:first-child{margin-bottom: 5px;}
	.portrait #productPage .productName{line-height: 0;}
}

#producthtml #barba-wrapper{ height: 100vh;}

/*body#top .homeBtnwrap .storesBtnArea{display: none;}
.drower body#top .homeBtnwrap .storesBtnArea{display: none;}
body#top #barba-wrapper .storesBtnArea{ display: none;}
body#producthtml .storesBtnArea{ display: block;}*/

.comingsoon{padding: 20vh 0;}
.comingsoon p.eng2{font-size: 50px; display: block; text-align: center;}

/**/
.ver2 #home .product a{position: relative;padding-bottom: 10px;margin-bottom: 20px;}
.ver2 #home #lineup .productLink .moreLink{bottom:-10px;}
.ver2 #home #lineup .productLink:hover .moreLink{bottom:0;}
.ver2 .buyBtn{position: absolute; bottom:50px; width: 100%; text-align: center;}
/*.ver2 #productPage .closeBtn{ transform: none; right: 50px; left: inherit; top: 50px; bottom: inherit;}*/

.onlineBtn{width: 400px;height: auto;position: relative;display: block;margin: 0 auto;line-height: 0;padding: 20px 40px;border: 2px solid #000;border-radius: 10px; transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);}
.onlineBtn svg{width: auto;height: 20px; transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);}

.onlineBtn:hover{background: #000;}
.onlineBtn:hover svg{fill:#fff;}
@media screen and (max-width: 900px){
	.onlineBtn{width: 80%;}
	
	.onlineBtn svg{height: 15px;}
}

