@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i");
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,300,400,500,700,900");
/*-----------------------------------

	変数定義

-----------------------------------*/
/*-----------------------------------

	common

-----------------------------------*/
html { -webkit-font-smoothing: antialiased; font-size: 62.5%; }

@media (max-width: 768px) { html { font-size: 50.5%; } }

@media (max-width: 488px) { html { font-size: 45.5%; } }

body { font-family: 'Noto Sans JP','ヒラギノ角ゴシック Pro','Hiragino Kaku Gothic Pro',游ゴシック体,'Yu Gothic',YuGothic,メイリオ,Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif; font-size: 1.6rem; letter-spacing: 0px; color: #252525; width: 100%; max-width: 1920px; letter-spacing: 0.5px; }

.container { max-width: 1120px; padding: 0 20px; margin: auto; }

.f-Josef { font-family: 'Josefin Sans',sans-serif; }

.f-mont { font-family: 'Montserrat', sans-serif; }

.f-myriad { font-family: 'Myriad Pro Regular'; font-weight: bold; }

.sentence { line-height: 37px; }

@media (max-width: 768px) { .sentence { line-height: 1.7; } }

img { max-width: 100%; width: 100%; display: inline-block; }

.click-invalid { pointer-events: none; }

.click-invalid a { pointer-events: none; }

.hidden-xs { display: none; }

@media (min-width: 769px) { .hidden-xs { display: block; } }

.visible-xs { display: none; }

@media (max-width: 768px) { .visible-xs { display: block; } }

.link-menu { position: relative; display: inline-block; -webkit-transition: .7s; -o-transition: .7s; transition: .7s; color: #252525; padding: 3px 3px 2px 4px; margin-left: -4px; }

.link-menu:before { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; content: ''; background: #252525; -webkit-transform-origin: right top; -ms-transform-origin: right top; transform-origin: right top; -webkit-transform: scale(0, 1); -ms-transform: scale(0, 1); transform: scale(0, 1); -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; -o-transition: transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; }

.link-menu:hover { color: #fff !important; }

.link-menu:hover::before { -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); }

.link-menu.white:before { background: #fff; }

.link-menu.white:hover { color: #000 !important; }

/*-----------------------------------

	function

-----------------------------------*/
/*-----------------------------------

  アニメーション

-----------------------------------*/
/* 定型文 @include fadein(); transition-delay: 1s; */
/* 定型文 @include fadein-anim(unquote("0px,60px")); animation-delay:$delay; */
@-webkit-keyframes fadein-animation { 100% { opacity: 1;
    -webkit-transform: translate(0px, 0px);
            transform: translate(0px, 0px); } }
@keyframes fadein-animation { 100% { opacity: 1;
    -webkit-transform: translate(0px, 0px);
            transform: translate(0px, 0px); } }

/* -----------------------------------

  line-heightの一行目削除

----------------------------------- */
section { margin-top: 100px; }

section.no-margin { margin-top: 0px; }

@media (max-width: 768px) { section { margin-top: 50px; } }

header { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; height: 80px; background-color: #000; }

header img { width: 200px; }

/*--------------------------------

  ヒーローエリア

--------------------------------*/
#hero-area .main { height: 90vh; background-image: url(../images/main_img-key.png); background-size: cover; background-repeat: no-repeat; background-position: center; }

@media (max-width: 768px) { #hero-area .main { background: none; height: auto; } }

#hero-area .list-shose { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }

@media (max-width: 768px) { #hero-area .list-shose { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } }

#hero-area .list-shose li { padding: 0 10px; }

@media (max-width: 768px) { #hero-area .list-shose li { width: 25%; } }

#hero-area .tit { font-size: 2rem; color: #ff3f39; text-align: center; margin-top: 70px; margin-bottom: 45px; letter-spacing: 1.5px; }

@media (max-width: 768px) { #hero-area .tit { margin-top: 50px; margin-bottom: 20px; } }

#hero-area .carousel { margin-top: 15px; }

#hero-area .attention { text-align: right; font-size: 1.2rem; margin-top: 10px; padding: 0 20px; line-height: 1.4; color: #666; }

@media (max-width: 768px) { #hero-area .attention { text-align: left; } }

#hero-area .quote { -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; opacity: 0; -webkit-transform: translate(0px,60px); -ms-transform: translate(0px,60px); transform: translate(0px,60px); }

#hero-area .quote.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

#hero-area .quote .h2 { font-size: 3.6rem; text-align: center; margin-top: 20px; }

#hero-area .quote .sub-tit { margin-top: 20px; font-size: 2rem; text-align: center; font-weight: 600; }

@media (max-width: 768px) { #hero-area .quote .sub-tit { font-size: 1.8rem; } }

#hero-area .quote .box { max-width: 720px; margin: 20px auto 0; position: relative; letter-spacing: 1px; }

#hero-area .quote .box .des { font-size: 1.6rem; margin-top: 20px; font-style: italic; text-align: center; }

#hero-area .quote .box .des:first-child { margin-top: 0; }

@media (max-width: 768px) { #hero-area .quote .box .des { line-height: 1.7; } }

#hero-area .quote .box .quote { width: 30px; position: absolute; }

#hero-area .quote .box .quote.top { top: 30px; left: 60px; }

#hero-area .quote .box .quote.bottom { bottom: 30px; right: 60px; }

/*--------------------------------

  商品説明

--------------------------------*/
.detail .box { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-top: 100px; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; opacity: 0; -webkit-transform: translate(60px,0px); -ms-transform: translate(60px,0px); transform: translate(60px,0px); }

.detail .box.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

.detail .box:first-of-type { margin-top: 50px; }

@media (max-width: 768px) { .detail .box { margin-top: 50px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: left; -webkit-justify-content: left; -ms-flex-pack: left; justify-content: left; display: block; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; opacity: 0; -webkit-transform: translate(0px,60px); -ms-transform: translate(0px,60px); transform: translate(0px,60px); } }

.detail .box.reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; opacity: 0; -webkit-transform: translate(-60px,0px); -ms-transform: translate(-60px,0px); transform: translate(-60px,0px); }

.detail .box.reverse.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

@media (max-width: 768px) { .detail .box.reverse { -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; opacity: 0; -webkit-transform: translate(0px,60px); -ms-transform: translate(0px,60px); transform: translate(0px,60px); -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } }

.detail .box .img { -webkit-flex-basis: 55%; -ms-flex-preferred-size: 55%; flex-basis: 55%; }

@media (max-width: 768px) { .detail .box .img { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } }

.detail .box .description { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-flex-basis: 45%; -ms-flex-preferred-size: 45%; flex-basis: 45%; }

@media (max-width: 768px) { .detail .box .description { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; width: 100%; margin-top: 20px; } }

@media (max-width: 768px) { .detail .box .description div { width: 100%; } }

.detail .box .description h3 { font-size: 4.2rem; letter-spacing: 0.1em; }

.detail .box .description p { margin-top: 40px; font-size: 1.8rem; }

@media (max-width: 768px) { .detail .box .description p { margin-top: 10px; } }

/*

*/
.detail.cp02 .h2 { font-size: 3.6rem; text-align: center; margin-top: 20px; }

.detail.cp02 .sub-tit { margin-top: 20px; font-size: 2rem; text-align: center; font-weight: 600; }

.detail.cp02 h3 { line-height: 1.4; }

.detail.cp02 p { margin-top: 40px; }

/*--------------------------------

  キャンペーンバナー

--------------------------------*/
.campaign-banner h2 { font-size: 4.2rem; text-align: center; margin-bottom: 40px; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; opacity: 0; -webkit-transform: translate(0px,30px); -ms-transform: translate(0px,30px); transform: translate(0px,30px); }

.campaign-banner h2.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

@media (max-width: 768px) { .campaign-banner h2 { margin-bottom: 20px; line-height: 1.4; } }

.campaign-banner .box { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }

@media (max-width: 768px) { .campaign-banner .box { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } }

.campaign-banner .box .banner { -webkit-flex-basis: 60%; -ms-flex-preferred-size: 60%; flex-basis: 60%; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; opacity: 0; -webkit-transform: translate(0px,30px); -ms-transform: translate(0px,30px); transform: translate(0px,30px); }

.campaign-banner .box .banner.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

.campaign-banner .box .banner:nth-child(2).active { -webkit-transition-delay: .4s; -o-transition-delay: .4s; transition-delay: .4s; }

@media (max-width: 768px) { .campaign-banner .box .banner:nth-child(2) { margin-top: 20px; } }

/*--------------------------------

  OFF GOLF STYLE

--------------------------------*/
#off-golf-style h2 { text-align: center; font-size: 5rem; letter-spacing: .1em; margin-bottom: 10px; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; opacity: 0; -webkit-transform: translate(0px,60px); -ms-transform: translate(0px,60px); transform: translate(0px,60px); }

@media (max-width: 768px) { #off-golf-style h2 { font-size: 4.4rem; line-height: 1.2; } }

#off-golf-style h2.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

#off-golf-style .copy { text-align: center; margin-bottom: 50px; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; opacity: 0; -webkit-transform: translate(0px,60px); -ms-transform: translate(0px,60px); transform: translate(0px,60px); }

#off-golf-style .copy.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

@media (max-width: 768px) { #off-golf-style .copy { margin-bottom: 20px; text-align: left; } }

#off-golf-style .imgs { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; }

#off-golf-style .imgs .img { -webkit-flex-basis: 33.3%; -ms-flex-preferred-size: 33.3%; flex-basis: 33.3%; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; opacity: 0; -webkit-transform: translate(0px,60px); -ms-transform: translate(0px,60px); transform: translate(0px,60px); }

#off-golf-style .imgs .img.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

@media (max-width: 768px) { #off-golf-style .imgs .img:nth-child(1) { margin-top: 0px; } }

#off-golf-style .imgs .img:nth-child(2) { -webkit-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; }

#off-golf-style .imgs .img:nth-child(3) { -webkit-transition-delay: 0.4s; -o-transition-delay: 0.4s; transition-delay: 0.4s; }

@media (max-width: 768px) { #off-golf-style .imgs .img { margin-top: 50px; -webkit-transition-delay: 0; -o-transition-delay: 0; transition-delay: 0; } }

@media (max-width: 768px) { #off-golf-style .imgs { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } }

/*--------------------------------

  シューズラインナップ

--------------------------------*/
.lineup-items { position: relative; }

.lineup-items .bg-headline { background-color: #000; background-repeat: no-repeat; background-position: top 0% left 50%; background-size: 100%; position: absolute; width: 100%; top: 0; left: 0; height: 300px; z-index: -1; }

.lineup-items h2 { padding: 70px 0; font-size: 4.2rem; text-align: center; color: #fff; text-shadow: 0px 7px 9px #000000; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; opacity: 0; -webkit-transform: translate(0px,60px); -ms-transform: translate(0px,60px); transform: translate(0px,60px); }

.lineup-items h2.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

@media (max-width: 768px) { .lineup-items h2 { line-height: 1.4; padding: 50px 0; } }

.lineup-items .item-container { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: left; -webkit-justify-content: left; -ms-flex-pack: left; justify-content: left; }

@media (max-width: 768px) { .lineup-items .item-container { -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } }

.lineup-items .item-container .item { -webkit-flex-basis: 31%; -ms-flex-preferred-size: 31%; flex-basis: 31%; position: relative; margin-bottom: 50px; position: relative; margin-right: 3.5%; }

.lineup-items .item-container .item:nth-child(3n-1).active { -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s; }

@media (max-width: 768px) { .lineup-items .item-container .item:nth-child(3n-1).active { -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; } }

.lineup-items .item-container .item:nth-child(3n) { margin-right: 0; }

.lineup-items .item-container .item:nth-child(3n).active { -webkit-transition-delay: .4s; -o-transition-delay: .4s; transition-delay: .4s; }

@media (max-width: 768px) { .lineup-items .item-container .item:nth-child(3n).active { -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; } }

@media (max-width: 768px) { .lineup-items .item-container .item:nth-child(2n) { margin-right: 0; }
  .lineup-items .item-container .item:nth-child(2n).active { -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s; } }

.lineup-items .item-container .item .label { position: absolute; top: 25px; left: -10px; background-color: #ff3f39; color: #fff; font-size: 1.4rem; font-weight: bold; padding: 8px 20px 11px; }

@media (max-width: 768px) { .lineup-items .item-container .item .label { padding: 5px 10px 8px; top: 10px; } }

.lineup-items .item-container .item .label::before { position: absolute; content: ''; top: 100%; left: 0; border: none; border-bottom: solid 15px transparent; border-right: solid 10px #c92f2b; }

.lineup-items .item-container .item .label.blue { top: 75px; background-color: #3291dc; }

@media (max-width: 768px) { .lineup-items .item-container .item .label.blue { padding: 2px 10px 5px; top: 33px; } }

.lineup-items .item-container .item .label.blue::before { border-bottom: solid 15px transparent; border-right: solid 10px #2773af; }

.lineup-items .item-container .item .tit { font-size: 2rem; line-height: 1.4; margin-top: 10px; }

@media (max-width: 768px) { .lineup-items .item-container .item .tit { font-size: 1.8rem; } }

.lineup-items .item-container .item .fee { line-height: 1; font-size: 2.2rem; margin-top: 10px; color: #ff3f39; text-align: right; font-weight: 500; }

.lineup-items .item-container .item .tag { margin-top: 10px; padding-top: 10px; border-top: solid 1px #666; }

.lineup-items .item-container .item .tag span { margin-right: 10px; font-size: 1.2rem; display: inline-block; padding: 5px 10px; border-radius: 20px; border: solid 1px #777; color: #777; margin-bottom: 10px; }

.lineup-items .item-container .item:nth-last-child(1) { margin-bottom: 0; }

.lineup-items .item-container .item:nth-last-child(2) { margin-bottom: 0; }

.lineup-items .item-container .item:nth-last-child(3) { margin-bottom: 0; }

.lineup-items .item-container .item a { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }

.lineup-items .item-container .item a:hover img { opacity: 0.7; }

@media (max-width: 768px) { .lineup-items .item-container .item { -webkit-flex-basis: 47.5%; -ms-flex-preferred-size: 47.5%; flex-basis: 47.5%; margin-right: 2.5%; margin-bottom: 2.5%; } }

@media (max-width: 768px) { .lineup-items .item-container .item:nth-child(2n) { margin-right: 0px; margin-left: 2.5%; } }

/*--------------------------------

  動画エリア

--------------------------------*/
#video { text-align: center; }

#video h2 { font-size: 5rem; letter-spacing: .1em; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; opacity: 0; -webkit-transform: translate(0px,60px); -ms-transform: translate(0px,60px); transform: translate(0px,60px); }

@media (max-width: 768px) { #video h2 { font-size: 4.2rem; line-height: 1.2; } }

#video h2.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

#video .youtube { padding: 0 10px; }

#video .youtube iframe { width: 100%; }

@media (max-width: 768px) { #video .youtube iframe { height: 200px; } }

#video .video-container { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; }

@media (max-width: 768px) { #video .video-container { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } }

#video .video-container .video-box { -webkit-flex-basis: 49%; -ms-flex-preferred-size: 49%; flex-basis: 49%; }

@media (max-width: 768px) { #video .video-container .video-box { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } }

#video .video-container .video-box .about { text-align: center; margin-top: 10px; }

#video .video-container .video-box .about a { color: #333; border-bottom: solid 1px #000; }

#video .video-container.center { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }

#video h3 { margin-top: 50px; font-size: 3.8rem; text-align: center; margin-bottom: 10px; color: #999; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; opacity: 0; -webkit-transform: translate(0px,60px); -ms-transform: translate(0px,60px); transform: translate(0px,60px); }

#video h3.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

#video video { width: 100%; height: auto; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; opacity: 0; -webkit-transform: translate(0px,60px); -ms-transform: translate(0px,60px); transform: translate(0px,60px); }

#video video.active { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

@media (max-width: 768px) { #video video { width: 100%; } }

/*--------------------------------

  ショップエリア

--------------------------------*/
#shop-area { padding-top: 100px; padding-bottom: 100px; background-color: #111; }

@media (max-width: 768px) { #shop-area { padding: 50px 20px; } }

#shop-area .bg-japan { background: url(../images/japan.png) no-repeat; background-size: contain; background-position: center; }

#shop-area .subt-top { text-align: center; color: #fff; }

#shop-area .subt-top .subt-en { font-size: 7.2rem; letter-spacing: 0.2em; }

@media (max-width: 768px) { #shop-area .subt-top .subt-en { font-size: 4.8rem; } }

#shop-area .subt-top .subt-jp { display: block; font-weight: bold; font-size: 2rem; margin-top: 10px; }

#shop-area .shop-btn .btn-logo { display: inline-block; margin-right: 5px; width: 72px; height: 17px; background: url(../images/logo_pc.png) no-repeat; background-size: contain; background-position: 0; }

#shop-area .shop-btn .btn-txt { font-weight: bold; }

#shop-area .shop-btn a { color: #fff; max-width: 440px; margin: 55px auto 0; font-size: 1.7rem; border: solid 5px #fff; text-align: center; padding: 27px 0; display: block; }

@media (max-width: 768px) { #shop-area .shop-btn a { margin-top: 20px; height: 60px; padding: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } }

#shop-area .shop-btn a:hover .icon-right-arrow02 { left: 10px; }

#shop-area .shop-btn a .icon-right-arrow02 { position: relative; left: 0; font-size: 1.4rem; margin-left: 10px; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; }

/*--------------------------------

  フッター

--------------------------------*/
.footer-copy { background-color: #fff; padding: 30px 0; text-align: center; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }

@media (max-width: 768px) { .footer-copy { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } }

.footer-copy .copy-logo { width: 160px; margin-right: 20px; }

@media (max-width: 768px) { .footer-copy .copy-logo { margin: 0 0 10px 0; } }

.footer-copy .cory-rights { font-size: 1.2rem; }

/*--------------------------------

  固定バナー

--------------------------------*/
.fixed-to-lineup { z-index: 11; background-color: black; width: 100%; padding: 5px 0; position: fixed; left: 0; bottom: -120px; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; }

.fixed-to-lineup.slideup { bottom: 0; }

.fixed-to-lineup .container { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 100%; }

@media (max-width: 768px) { .fixed-to-lineup .container { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding: 0 10px; } }

.fixed-to-lineup .container div { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }

.fixed-to-lineup .text01 { font-size: 1.6rem; font-weight: bold; color: #fff; margin-right: 20px; }

.fixed-to-lineup .text02 { font-size: 4rem; font-weight: bold; color: #fff; }

@media (max-width: 768px) { .fixed-to-lineup .text02 { font-size: 2.8rem; } }

.fixed-to-lineup .btn { cursor: pointer; text-align: center; display: block; width: auto; margin: 10px 5px 10px 5px; color: #fff; font-weight: bold; padding: 20px; background: -webkit-gradient(linear, left top, left bottom, from(#c5d850), color-stop(50%, #c5d850), color-stop(50%, #b6c74c), to(#b6c74c)); background: -webkit-linear-gradient(top, #c5d850 0%, #c5d850 50%, #b6c74c 50%, #b6c74c 100%); background: -o-linear-gradient(top, #c5d850 0%, #c5d850 50%, #b6c74c 50%, #b6c74c 100%); background: linear-gradient(180deg, #c5d850 0%, #c5d850 50%, #b6c74c 50%, #b6c74c 100%); }

@media (max-width: 980px) { .fixed-to-lineup .btn { line-height: 1.7; } }

@media (max-width: 768px) { .fixed-to-lineup .btn { width: auto; padding: 5px 10px; margin: 10px 5px 0px 5px; } }

.fixed-to-lineup .btn br { display: block; }

@media (min-width: 980px) { .fixed-to-lineup .btn br { display: none; } }

.fixed-to-lineup .btn.pink { background: -webkit-gradient(linear, left top, left bottom, from(#f5b4cf), color-stop(50%, #f5b4cf), color-stop(50%, #dca2ba), to(#dca2ba)); background: -webkit-linear-gradient(top, #f5b4cf 0%, #f5b4cf 50%, #dca2ba 50%, #dca2ba 100%); background: -o-linear-gradient(top, #f5b4cf 0%, #f5b4cf 50%, #dca2ba 50%, #dca2ba 100%); background: linear-gradient(180deg, #f5b4cf 0%, #f5b4cf 50%, #dca2ba 50%, #dca2ba 100%); }

.fixed-to-lineup .btn span { position: relative; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; right: 0px; font-size: 1.4rem; margin-left: 10px; }

.fixed-to-lineup .btn:hover span { right: -10px; }

.scroll-top { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; display: none; width: 60px; height: 60px; background-color: #000; position: fixed; right: 5%; bottom: 15%; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; opacity: 0; -webkit-transform: translate(0px,-60px); -ms-transform: translate(0px,-60px); transform: translate(0px,-60px); }

.scroll-top.slidein { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); }

.scroll-top span { -webkit-transform: rotateZ(-90deg); -ms-transform: rotate(-90deg); transform: rotateZ(-90deg); font-size: 30px; }

@media (max-width: 768px) { .slick-slide { padding: 0px; }
  .slick-next { right: 0; }
  .slick-prev { left: 0; } }
