* {
margin: 0;
padding:0;
box-sizing: border-box;

}

html {
height: 100%;
}

body {
font-family: "Hiragino Kaku Gothic ProN", メイリオ, sans-serif;
}

a {
text-decoration: none;
color: #656575;
}

li {
list-style: none;
}

img{
margin: 0;
padding: 0;
}

h1{

}

p{

}
/*///// メインビジュアル /////*/
header{
margin:0 auto;
/*width:1200px;*/
width:127.931769723vh;
text-align: center;
position: relative;
height:100vh;
}

#main-img{
/*margin:0 auto 60px auto;*/
margin:0 auto 6.396588486vh auto;
/*width:1200px;*/
width:127.931769723vh;
/*height:677px;*/
height:72.174840085vh;
}

#main-img img{
width:100%;
height:auto;
}

header h1{
/*margin:0 auto 60px auto;*/
margin:0 auto 6.396588486vh auto;
/*width:219px;*/
width:23.347547974vh;
/*height:143px;*/
height:15.245202558vh;
}

header h1 img{
width:100%;
height:auto;
}

/*///// ナビゲーション /////*/
#nav-drawer{
position: absolute;
top:20px;
right:20px;
}

.nav-unshown {
display:none;
}

#nav-open {
display: inline-block;
width: 41px;
height: 37px;
vertical-align: middle;
background-color: rgba(0,0,0,0.5);
padding:8px;
}

#nav-open span, #nav-open span:before, #nav-open span:after {
position: absolute;
height: 3px;
width: 25px;
border-radius: 3px;
display: block;
content: '';
cursor: pointer;
background:#fff;
}
#nav-open span:before {
bottom: -8px;
}
#nav-open span:after {
bottom: -16px;
}

#nav-close {
display: none;
position: fixed;
z-index: 200;
top: 0;
left: 0;
width: 100%;
height: 100%;
background:#000;
opacity: 0;
transition: .3s ease-in-out;
}

#nav-content {
overflow: auto;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
width: 90%;
max-width: 35.106382978vh;
height: 100%;
background: #fff;
transition: .3s ease-in-out;
-webkit-transform: translateX(-105%);
transform: translateX(-105%);
text-align:left;
}

#nav-content::-webkit-scrollbar {
display: none;
}

#nav-content{
-ms-overflow-style:none;
}

#nav-content ul{
margin-bottom:6.382978723vh;
background:#1a1a1a;
padding-bottom:13.829787234vh;
}

#nav-content ul li a{
font-size:3.191489361vh;
color:#fff;
font-weight:bold;
line-height:1.5em;
padding:3.191489361vh 0 3.191489361vh 1.702127659vh;
display:block;
}

#nav-content ul li a:hover{
background: #3856b1;
}

.nav-content-conductor{
text-align:center;
}

.nav-content-conductor a{
display: inline-block;
background-color: #9ec34b;
width:80%;
height:6.382978723vh;
padding:1.6vh 0 0 0;
font-size:2vh;
color:#fff;
background:#eb0010;
text-align:center;
font-weight:bold;
}

.nav-content-conductor a:hover{
opacity: 0.8;
}

#nav-content .logo{
width:60%;
height:auto;
margin:0 auto 16px auto;
}

#nav-content .logo img{
width:100%;
height:auto;
}

#nav-content .txt{
margin:0 auto 3.191489361vh auto;
font-size:1.276595744vh;
color:#000;
text-align:center;
}

#nav-input:checked ~ #nav-close {
display: block;
opacity: .5;
}

#nav-input:checked ~ #nav-content {
-webkit-transform: translateX(0%);
transform: translateX(0%);
box-shadow: 6px 0 25px rgba(0,0,0,.15);
}

/*///// TOPICS /////*/
#topics{
width:100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
align-items: stretch;
}

#topics .left,
#topics .right{
width:50%;
}

#topics .left{
background:#1a1a1a;
padding:100px 0;
}

#topics .left h1{
color:#fff;
font-family: 'Rubik', sans-serif;
font-size:72px;
line-height:1em;
margin-bottom:60px;
}

#topics .left p{
color:#c7c7c7;
font-size:16px;
line-height:1.2em;
margin-right:60px;
}

#topics .right{
background:#f1f1f9;
}

#topics .left div{
width:600px;
margin:0 0 0 auto;
}

#topics .right ul{
width:600px;
margin:85px auto 0 0;
padding-bottom:16px;
}

#topics .right ul li{
margin:0 auto 30px 45px;
}

#topics .right a{
display:block;
padding:15px 15px;
}

#topics .right ul li a:hover{
background:#f9f9fc;
}

#topics .txt_news{
text-decoration: underline;
font-size:16px;
color:#000;
line-height:1.5em;
}

#topics .tag{
font-size:14px;
color:#fff;
margin-bottom:12px;
}

#topics .tag span{
background:#000;
padding:0.4em 0.6em;
}

#topics li.cat-0 .tag span{
background:#eb0010;
}

#topics .day{
font-size:14px;
margin-bottom:12px;
color:#000;
}

.more_btn{
text-align: right;
width:600px;
margin:0 auto 100px 0;
}

.more_btn a{
text-align: center;
color:#000;
font-size:16px;
width:30%;
border: solid 1px #000;
margin:0 0 0 auto;
}


/*///// HISTORY /////*/
#history{
width:100%;
text-align: center;
overflow: hidden;
padding-bottom:100px;

}

#history h1{
color:#000;
font-family: 'Rubik', sans-serif;
font-size:72px;
line-height:1em;
margin-bottom:60px;
}

#history p{
color:#000;
font-size:16px;
line-height:2em;
}

.infiniteslide{
height:433px;
margin-bottom:60px;
}

.infiniteslide ul li{
width:650px;
height:433px;
}

.infiniteslide ul li img{
width:100%;
height:auto;
}

/*///// INSTACGRAM /////*/
#instagram{
width:100%;
text-align: center;
background: linear-gradient(-90deg, #ba00b1, #e4062f);
padding:100px 0;
}

#instagram h1{
color:#fff;
font-family: 'Rubik', sans-serif;
font-size:72px;
line-height:1em;
margin-bottom:80px;
}

#instagram p.btn{
color:#fff;
font-size:24px;
line-height:1.5em;
font-weight:bold;
width:600px;
margin:0 auto;
}

#instagram p.btn a{
color:#fff;
background-color: rgba(255,255,255,0.3);
width:100%;
padding:40px 0 40px 100px;
display:inline-block;
background-image:url(../images/glyph-logo_May2016.svg);
background-repeat:no-repeat;
background-size:55px;
background-position: 50px 28px;
}

#instagram p.btn a:hover{
opacity: 0.8;
}

#instafeed{
width:1200px;
height:900px;
margin:0 auto 70px auto;
position: relative;
background:#000;
}

#instafeed a{
width:300px;
height:300px;
display:block;
overflow: hidden;
position: relative;
}

#instafeed a:first-child {
width:600px;
height:600px;

}

#instafeed a:nth-of-type(2){
position: absolute;
top:0;
left:600px;

}

#instafeed a:nth-of-type(3){
position: absolute;
top:0;
left:900px;

}

#instafeed a:nth-of-type(4){
position: absolute;
top:300px;
left:600px;

}

#instafeed a:nth-of-type(5){
position: absolute;
top:300px;
left:900px;

}

#instafeed a:nth-of-type(6){
position: absolute;
top:600px;
left:0;

}

#instafeed a:nth-of-type(7){
position: absolute;
top:600px;
left:300px;

}

#instafeed a:nth-of-type(8){
position: absolute;
top:600px;
left:600px;

}

#instafeed a:nth-of-type(9){
position: absolute;
top:600px;
left:900px;

}


#instafeed a img{
width:100%;
height:100%;
object-fit: cover;
font-family: 'object-fit: cover;'

 /*
width:auto;
height:100%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);*/
}

/*///// SHOP /////*/
#shop{
width:100%;
text-align: center;
background:#1a1a1a;
padding:100px 0;
}

#shop .logo{
width:640px;
height:114px;
margin:0 auto 18px auto;
}

#shop .logo img{
width:100%;
height:auto;
}

#shop h1{
color:#fff;
font-size:30px;
padding-bottom:140px;
background-image:url(../images/next_arrow.svg);
background-repeat:no-repeat;
background-size:49px;
background-position: center 110px;
}

#shop .btn{
font-size:30px;
font-weight:bold;
width:600px;
margin:0 auto;
}

#shop .btn a{
color:#fff;
background:#eb0010;
padding:40px 60px;
width:100%;
display:inline-block;
}

#shop .btn a:hover{
opacity: 0.8;
}

/*///// FOOTER /////*/
footer{
width:100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
align-items: stretch;
background:#f1f1f9;
}

footer .left{
width:300px;
height:auto;
background:#000;
}

footer .left h2{
width:300px;
height:auto;
}

footer h2 img{
width:100%;
height:auto;
}

footer .right{
padding:80px 24px 0 80px;
font-size:14px;
color:#58586a;
}

footer ul{
margin-bottom:24px;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
}

footer ul li{
margin-right:24px;
}

footer ul li a{
text-decoration: underline;
font-weight:bold;
}

#text_copyright{
margin-top:24px;
}

/*///// 下層ページ /////*/
body#blog_page header{
width:1200px;
height:263px;
}

body#blog_page header h1{
margin:0 auto 60px auto;
width:219px;
height:143px;
padding-top:60px;
}

body#blog_page header h1 img{
width:100%;
height:auto;
}

body#blog_page #blogTit{
background:#1a1a1a;
padding:60px 60px;
margin-bottom:60px;
color:#fff;
}

body#blog_page #blogTit h2{
font-family: 'Rubik', sans-serif;
font-size:72px;
line-height:1em;
margin-bottom:60px;
}

body#blog_page #blogTit p{
color:#c7c7c7;
font-size:16px;
line-height:1.2em;
}

body#blog_page #blogCon,
body#blog_page #blogList{
width:1200px;
margin:0 auto;
}

.pNav{
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
align-items: stretch;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
padding:30px 0;
color:#000;
margin-bottom:30px;
}

.pNav li{
margin-bottom:0.5em;
}

.pNav .bck{
position: relative;
padding-left:16px;
}

.pNav .bck::after {
content: '';
display: block;
position: absolute;
top: 6px;
left: 3px;
width: 6px;
height: 6px;
border: 0px;
border-top: solid 1px #000;
border-right: solid 1px #000;
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}

.pNav a{
color:#000;
text-decoration: underline;
}

#blog h1 {
padding: 0.25em 0 0.25em 0.5em;
background: transparent;
border-left: solid 5px #000;
margin-bottom:20px;
font-size:32px;
line-height:1.5em;
}

#blogCon .tag{
border: solid 1px #000;
color: #000;
font-size: 14px;
padding:0.3em 1em;
margin-right:1em;
}

#blogCon #up_ymd{
color: #000;
font-size: 14px;
}

#blog #detail{
margin:60px 0;
color:#000;
font-size:16px;
}

#blog .detailText{
margin-bottom:60px;
line-height:1.5em;
}

#blog .detailText div{
margin-top:1em;
}

#blog .detailText a {
color:#00aeff;
text-decoration: underline;
}


body#blog_page #blogList{
margin-bottom:100px;
}

#blog_page #news li{
margin-bottom:45px;
}

#blog_page #news a{
display:block;
padding:15px 15px;
}

#blogList #news a:hover{
background:#f9f9fc;
}

#blogList #news .txt_news{
text-decoration: underline;
font-size:16px;
color:#000;
line-height:1.5em;
}

#blogList #news .tag{
font-size:14px;
color:#fff;
margin-bottom:12px;
}

#blogList #news .tag span{
background:#000;
padding:0.4em 0.6em;
}

#blogList #news li.cat-0 .tag span{
background:#eb0010;
}

#blogList #news .day{
font-size:14px;
margin-bottom:12px;
color:#000;
}

.pager{
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
justify-content: center;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-bottom:30px;
line-height:1.5em;
}

.pager a{
border: solid 1px #000;
font-size:16px;
color:#000;
margin:0 0.5em;
padding:0 0.5em;
}

.pager a.current{
color:#fff;
background:#000;
}

#notfound{
margin:40px auto 100px auto;
text-align: center;
}

/*//////////////////////////////    PC    //////////////////////////////*/

@media screen and (max-width: 1200px) {
/*///// メインビジュアル /////*/
header{
width:100%;
height:auto;
}

#main-img{
margin:0 auto 60px auto;
width:100%;
height:auto;
}

header h1{
margin:0 auto 60px auto;
width:219px;
height:143px;
}

/*///// TOPICS /////*/
#topics .left{
padding:100px 30px;
}

#topics .left p{
margin-right:0;
}

#topics .right{
padding:100px 30px;
}

#topics .left div{
width:100%;
margin:0;
}

#topics .right ul{
width:100%;
margin:0;
padding-bottom:16px;
}

#topics .right ul li{
margin:0 auto 30px 0;
}

.more_btn{
width:100%;
margin:0;
}

.more_btn a{
width:30%;
margin:0 30px 0 auto;
}

/*///// INSTACGRAM /////*/
#instagram{
padding:100px 0;
}

#instafeed{
width:95.238095238vw;
height:71.428571428vw;
}

#instafeed a{
width:23.809523809vw;
height:23.9vw;
}

#instafeed a:first-child {
width:47.619047619vw;
height:47.8vw;

}

#instafeed a:nth-of-type(2){
left:47.619047619vw;
}

#instafeed a:nth-of-type(3){
left:71.428571428vw;
}

#instafeed a:nth-of-type(4){
top:23.809523809vw;
left:47.619047619vw;
}

#instafeed a:nth-of-type(5){
top:23.809523809vw;
left:71.428571428vw;
}

#instafeed a:nth-of-type(6){
top:47.619047619vw;
}

#instafeed a:nth-of-type(7){
top:47.619047619vw;
left:23.809523809vw;
}

#instafeed a:nth-of-type(8){
top:47.619047619vw;
left:47.619047619vw;
}

#instafeed a:nth-of-type(9){
top:47.619047619vw;
left:71.428571428vw;
}

/*///// 下層ページ /////*/
body#blog_page header{
width:100%;
}

body#blog_page #blogCon,
body#blog_page #blogList{
width:100%;
padding:0 30px;
}



}

/*//////////////////////////////    タブレットレイアウト    //////////////////////////////*/

@media screen and (max-width: 960px) {
/*///// メインビジュアル /////*/
#main-img{
margin:0 auto 13.333333333vw auto;
}

header h1{
margin:0 auto 13.333333333vw auto;
}

/*///// TOPICS /////*/
#topics{
display: block;
}

#topics .left,
#topics .right{
width:100%;
}

#topics .left{
padding:13.333333333vw 0 60px 0;
text-align: center;
}

#topics .left h1{
margin:0 auto 8vw auto;
font-size:9.6vw;
}

#topics .left p{
margin:0 24px;
}

#topics .right{
padding:8vw 24px 0 24px;
}

#topics .right ul{
padding-bottom:2.133333333vw;
}

.more_btn{
padding-bottom:100px;
}

.more_btn a{
font-size:14px;
}

/*///// HISTORY /////*/
#history{
padding-bottom:13.333333333vw;
}

#history h1{
font-size:9.6vw;
margin-bottom:8vw;
}

#history p{
font-size:14px;
}

.infiniteslide{
margin-bottom:8vw;
}

/*///// INSTACGRAM /////*/
#instafeed{
width:86.956521739vw;
height:65.217391304vw;
}

#instagram h1{
font-size:9.6vw;
}

#instafeed a{
width:21.739130434vw;
height:21.8vw;
}

#instafeed a:first-child {
width:43.478260869vw;
height:43.6vw;

}

#instafeed a:nth-of-type(2){
left:43.478260869vw;

}

#instafeed a:nth-of-type(3){
left:65.217391304vw;

}

#instafeed a:nth-of-type(4){
top:21.739130434vw;
left:43.478260869vw;

}

#instafeed a:nth-of-type(5){
top:21.739130434vw;
left:65.217391304vw;

}

#instafeed a:nth-of-type(6){
top:43.478260869vw;

}

#instafeed a:nth-of-type(7){
top:43.478260869vw;
left:21.739130434vw;

}

#instafeed a:nth-of-type(8){
top:43.478260869vw;
left:43.478260869vw;

}

#instafeed a:nth-of-type(9){
top:43.478260869vw;
left:65.217391304vw;

}

/*///// FOOTER /////*/
footer .right{
padding:30px 24px 0 30px;
}

/*///// 下層ページ /////*/
body#blog_page header{
height:35.066666666vw
}

body#blog_page header h1{
margin:0 auto 8vw auto;
width:28.666666666vw;
height:19.066666666vw;
padding-top:8vw;
}

body#blog_page #blogTit{
padding:8vw 8vw;
margin-bottom:8vw;
}

body#blog_page #blogTit h2{
font-size:9.6vw;
margin-bottom:8vw;
}

body#blog_page #blogTit p{
font-size:14px;
}



}



/*//////////////////////////////    750以下    //////////////////////////////*/

@media screen and (max-width: 700px) {
/*///// メインビジュアル /////*/
header h1{
width:28.266666666vw;
height:18.8vw;
}

/*///// ナビゲーション /////*/
#nav-drawer{
top:16px;
right:16px;
}

#nav-content {
max-width: 80%;
}

#nav-content::-webkit-scrollbar {
display: none;
}

#nav-content{
-ms-overflow-style:none;
}

#nav-content ul{
margin-bottom:4vh;
background:#1a1a1a;
padding-bottom:3vh;
}

#nav-content ul li a{
font-size:3.191489361vh;
color:#fff;
font-weight:bold;
line-height:1.5em;
padding:3.191489361vh 0 3.191489361vh 1.702127659vh;
display:block;
}

#nav-content ul li a:hover{
background: #3856b1;
}

.nav-content-conductor{
text-align:center;
}

.nav-content-conductor a{
display: inline-block;
background-color: #9ec34b;
width:80%;
height:6.382978723vh;
padding:2.2vh 0 0 0;
font-size:2vh;
color:#fff;
background:#eb0010;
text-align:center;
font-weight:bold;
}

.nav-content-conductor a:hover{
opacity: 0.8;
}

#nav-content .logo{
width:60%;
height:auto;
margin:0 auto 16px auto;
}

#nav-content .logo img{
width:100%;
height:auto;
}

#nav-content .txt{
margin:0 auto 3.191489361vh auto;
font-size:1.276595744vh;
color:#000;
text-align:center;
}

#nav-input:checked ~ #nav-close {
display: block;
opacity: .5;
}

#nav-input:checked ~ #nav-content {
-webkit-transform: translateX(0%);
transform: translateX(0%);
box-shadow: 6px 0 25px rgba(0,0,0,.15);
}

/*///// TOPICS /////*/
#topics .left p{
font-size:14px;
}

.more_btn{
padding-bottom:13.333333333vw;
margin-right:0;
}

.more_btn a{
font-size:14px;
margin-right:0;
}

/*///// HISTORY /////*/
.infiniteslide{
height:28.666666666vw;
margin-bottom:8vw;
}

.infiniteslide ul li{
width:43.066666666vw;
height:28.666666666vw;
}

.infiniteslide ul li img{
width:100%;
height:auto;
}

/*///// INSTACGRAM /////*/
#instagram{
padding:13.33333333333vw 0;
}

#instagram h1{
margin-bottom:8vw;
}

#instagram p.btn{
font-size:3.2vw;
width:81.2vw;
}

#instafeed{
margin:0 auto 8vw auto;
}

#instagram p.btn a{
padding:5.333333333vw 0 5.333333333vw 13.333333333vw;
background-size:7.333333333vw;
background-position: 6.666666666vw 4vw;
}

/*///// SHOP /////*/
#shop{
padding:13.33333333333vw 0;
}

#shop .logo{
width:84.8vw;
height:14.933333333vw;
}

#shop h1{
font-size:4vw;
padding-bottom:18.666666666vw;
background-size:6.533333333vw;
background-position: center 14.666666666vw;
}

#shop .btn{
font-size:4vw;
width:81.2vw;
}

#shop .btn a{
padding:5.333333333vw 8vw;
}

/*///// FOOTER /////*/
footer{
display:block;
text-align: center;
padding:13.33333333333vw 0;
margin-top:0;
}

footer .left{
width:100%;
padding-top:0;
background:none;
}

footer .left h2{
width:40vw;
height:40vw;
margin:0 auto;
}

footer .right{
padding:8vw 24px 0 24px;
}

footer ul{
margin-bottom:10.133333333vw;
display:block;
}

footer ul li{
margin:0 24px 4.266666666vw 24px;
}

#text_copyright{
margin-top:3.2vw;
}

/*///// 下層ページ /////*/
body#blog_page header h1{
width:28.266666666vw;
height:18.8vw;
}

.detailUpfile{
max-width:100%;
}

.detailUpfile img{
width:100%;
}

.pNav{
padding:8px 0;
}

.bcknone{
display:none;
}

#blogCon h1{
font-size:27px;
}

#notfound{
width:80%;
}

#notfound img{
width:100%;
}

}

/*//////////////////////////////    SPレイアウト    //////////////////////////////*/

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




}

/*//////////////////////////////    510以下    //////////////////////////////*/

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




}


/*//////////////////////////////    320以下    //////////////////////////////*/

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


}