@charset "UTF-8";
/* CSS Document */



@media(min-width:1600px) {

#header h2{right: 5%;}

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

.categoryHeader .bkColor,
.categoryHeader.delighter .bkColor{right: 65%;}
.categoryHeader.delighter.started .bkColor{width: 35%;}
.categoryHeader .cover,
.categoryHeader.delighter .cover{width: 65%;}
.categoryHeader .photo{left: 35%;width: 65%;}
.categoryHeader .categoryTitle,
.categoryHeader.delighter .categoryTitle{padding-top: 12%;}

}




@media(max-width:1280px) {
.itemMain.set03{margin-top: 4%;}
}


@media(max-width:1300px) {



.sideNavi{right:-10%;width: 9.5%;}
.sideNavi ul{width: 75px;}
.sideNavi .title{font-size: 10px;}
.sideNavi .pagetop{width: 75px;}

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

.feature{width: 81%;}

.coordinate{width: 81%;}

.allBanner{width: 81%;}

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

.otherContents{width: 81%;}
.otherContents h3{font-size: 23px;}
.otherContents h4{font-size: 16px;}
.otherContents .more span{font-size: 17px;}
.otherContents .more a{font-size: 19px;}

.otherContents .otherList ul:before{top: 100px;bottom: 85px;}
.otherContents .otherList ul:after{top: 100px;bottom: 85px;}

}



@media(max-width:1200px) {

.pointList .detail{width: calc( 92% - 260px );}
.pointList .photo{width: 260px;margin-left: calc(100% - 260px);}

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

.allBanner .detail h2{font-size: 22px;}
.allBanner .detail .more a{font-size: 20px;}

}






@media(max-width:1050px) {


#header h1{width: 50%;}
.scrollbar{width: 23px;left:3%;}
.scrollbar p{width: 14px;margin-top: 6px;}

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

.lead.delighter.started:before{width: 85%;}
.lead .leadInner{width: 70%;}
.lead .leadInner .leadTitle,
.lead.delighter .leadInner .leadTitle{width: 13%;right: -16%;}
.lead .leadBody .text{padding: 5% 8% 16%;}
.lead .leadBody .text p,
.lead.delighter .leadBody .text p{font-size: 15px;}

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

.mainNavi .name h2{font-size: 29px;}

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

.separator{margin-top: 18%;}

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

.category{margin-top: 18%;}

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

.categoryHeader .categoryTitle h2{font-size: 40px;margin-left: 35px;}
.categoryHeader .categoryTitle h3{font-size: 26px;margin:1em 0 0 35px;}

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

.feature{margin-top: 18%;width: 81%;}
.feature.f01,.feature.f04{margin-top: 9%;}

.feature h2{font-size: 42px;margin-top: 50px;}
.feature h3{font-size: 20px;}
.feature .copy{margin-top: 2.3em;}

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

.pointList{width: 80%;margin-top: 10%;}

.pointList h2.titlePC{width: 3.9%;}
.pointList .detail{width: calc( 92% - 240px );}
.pointList .photo{width: 240px;margin-left: calc(100% - 240px);}

.pointList .detail h3{padding: 38px 0 25px 8%;font-size: 24px;}
.pointList .detail .copy,
.pointList .delighter .detail .copy{height: calc(100% - 88px);}
.pointList .detail .copy p{left: 8%;line-height: 2.2;}


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

.itemMain{margin-top: 13vw;width: 85%;}
.itemMain.set01{margin-top: 20vw;}

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

.itemMain.sta .visualBox{margin-left: 3%;}
.itemMain.rev .visualBox{margin-right: 4%;}

.itemMain .itemName h2{width: 27px;top: 50px;padding: 15px 0;}

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

.itemMain .itemBox,
.itemMain .itemBox.delighter{width: 38%;}

.itemMain.rev .itemListOnly .itemBox{margin-left: 0%;}
.itemMain .itemListOnly .itemBox,
.itemMain .itemListOnly .itemBox.delighter{width: 40%;}


.itemMain .itemBox .text{width: 100%;}

.itemList{margin-top: 30px;}
.itemList dl{margin-top: 12px;}
.itemList dl .name{width: calc( 100% - 85px);font-size: 16px;letter-spacing: 0.03em;}
.itemList dl .name span{font-size: 12px;}
.itemList dl .num{width: calc( 100% - 85px);margin-top: 0.2em;}
.itemList dl dd{width: 80px;}
.itemList dl dd a{font-size: 15px;}


.coordinate .itemList dl .name{width: calc( 100% - 68px);font-size: 15px;}
.coordinate .itemList dl .num{width: calc( 100% - 68px);}
.coordinate .itemList dl dd{width: 65px;}
.coordinate .itemList dl dd a{font-size: 13px;}
.coordinate .itemList .otherTrigger p.more{font-size: 15px;}

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

.otherImage{margin-top: 10%;}

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

.movieArea{margin-top: 10%;}

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


.coordinate{width: 81%;margin-top: 11%;}
.coordinate .coordTitle h2{font-size: 42px;padding: 55px 0 30px 40px;}
.coordinate .coordTitle .copy,
.coordinate .coordTitle.delighter .copy{width: 85%;padding: 25px 0 20px 40px;}
.coordinate .cooedItems{margin-top: 8%;}


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

.allBanner{margin-top: 20%;}
.allBanner .detail h2{font-size: 20px;}
.allBanner .detail .more a{font-size: 19px;}
.allBanner .detail .line{padding-top: 50%;}

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

.otherContents{width: 81%;margin-top: 23%;}
.otherContents h2,
.otherContents h2.delighter{padding: 28px 0 26px 4%;}
.otherContents h2 span,
.otherContents h2.delighter span{font-size: 42px;}

.otherContents .otherList{margin-top: 70px;}
.otherContents .otherList ul{width: 105%;}
.otherContents .otherList ul li{width: 28.333%;margin-right: 5%;}
.otherContents .otherList ul:before{top: 90px;bottom: 82px;left: 30.8%;}
.otherContents .otherList ul:after{top: 90px;bottom: 82px;left: 64.1%;}

.otherContents h3{font-size: 21px;}
.otherContents h4{font-size: 15px;}
.otherContents .more span{font-size: 16px;}
.otherContents .more a{font-size: 18px;}

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

.footer{margin-top: 30%;}
.footer .instagram{font-size: 18px;text-align: center;}
.footer .instagram .icon{width: 36px;}
.footer h2{width: 480px;margin-top: 17%;}
.footer .copyright{letter-spacing: 0.1em;font-size: 16px;}

.footer .pagetop{width: 70px;top: 14vw;right: 1vw;}

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

}










@media(max-width:950px) {

.separator{width: 82%;}

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

.lead.delighter.started:before{width: 87.5%;}
.lead .leadInner{width: 75%;}
.lead .leadInner .leadTitle,
.lead.delighter .leadInner .leadTitle{width: 12%;right: -14%;}
.lead .leadBody .text{padding: 5% 5% 12%;}
.lead .leadBody .text p,
.lead.delighter .leadBody .text p{font-size: 14px;}

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

.mainNavi .name h2{font-size: 25px;}
.mainNavi .more a{font-size: 17px;}

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

.categoryHeader .categoryTitle,
.categoryHeader.delighter .categoryTitle{width: 85%;}
.categoryHeader .categoryTitle h2{font-size: 36px;}
.categoryHeader .categoryTitle h3{font-size: 23px;}
.categoryHeader .categoryCopy{margin-top: 35px;padding: 30px 0 0 35px;}
.categoryHeader .categoryCopy p{font-size: 13px;line-height: 2.4;}

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

.feature{width: 85%;}
.feature .featureBody{width: 90%;}
.feature .featureBody .textBox{width: 90%;}

.feature h2{font-size: 37px;margin-top: 40px;}
.feature h3{font-size: 16px;}

.feature .copy{font-size: 13px;}

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

.pointList{width: 85%;}
.pointList .detail{width: calc( 95% - 220px );}
.pointList .detail h3{padding: 36px 0 24px 8%;font-size: 22px;}
.pointList .detail .copy,
.pointList .delighter .detail .copy{height: calc(100% - 82px);}
.pointList .detail .copy p{font-size: 13px;}
.pointList .photo{width: 220px;margin-left: calc(100% - 220px);}
.pointList .photo span{padding-top: 120%;}

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

.itemMain{width: 90%;}
.itemMain.sta .visualBox{margin-left: 2%;}
.itemMain.rev .visualBox{margin-right: 2%;}
.itemMain.sta .itemName{left: -7%;}
.itemMain.rev .itemName{right: -7%;}
.itemMain .itemName h2{width: 26px;top: 50px;padding: 20px 0;}


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

.itemMain .itemBox,
.itemMain .itemBox.delighter{width: 42%;}
.itemMain.sta .itemBox{margin-right: 2%;}
.itemMain.rev .itemBox{margin-left: 2%;}
.itemMain .itemBox .text p{font-size: 13px;}

.itemList{margin-top: 25px;}
.itemList dl .name{width: calc( 100% - 75px);}
.itemList dl .num{width: calc( 100% - 75px);}
.itemList dl dd{width: 70px;}
.itemList dl dd a{font-size: 15px;}


.coordinate .itemList dl .name{width: calc( 100% - 62px);font-size: 15px;}
.coordinate .itemList dl .num{width: calc( 100% - 62px);}
.coordinate .itemList dl dd{width: 60px;}


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

.otherImage.set01{width: 80%;}
.otherImage.set02 .img01{width: 46.5%;margin-right: 14%;}
.otherImage.set02 .img02{width: 53%;}
.otherImage.set04{width: 80%;}
.otherImage.set05{width: 80%;}
.otherImage.set06{width: 80%;}
.otherImage.set07{width: 80%;}

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

.movieArea .videoBox{width: 85%;}
.movieArea .thumb .playBT .play{width: 15vw;height: 15vw;margin-top: -7.5vw;padding:4.5vw;}

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

.coordinate{width: 95%;}
.coordinate .coordTitle h2{font-size: 36px;padding: 45px 0 25px 35px;}
.coordinate .coordTitle .copy,
.coordinate .coordTitle.delighter .copy{padding: 25px 0 20px 35px;font-size: 13px;line-height: 2.4;}

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

.allBanner{width: 87%;}
.allBanner .detail h2{font-size: 2.2vw;}
.allBanner .detail .more a{font-size: 2.1vw;}

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

.otherContents{width: 90%;}
.otherContents h2,
.otherContents h2.delighter{padding: 25px 0 23px 4%;}
.otherContents h2 span,
.otherContents h2.delighter span{font-size: 36px;}
.otherContents .otherList{margin-top: 60px;}
.otherContents .otherList ul:before{top: 85px;bottom: 70px;}
.otherContents .otherList ul:after{top: 85px;bottom: 70px;}

.otherContents h3{font-size: 19px;}
.otherContents h4{font-size: 13px;}

.otherContents .more{margin: 17px auto 25px;}
.otherContents .more span{font-size: 14px;padding: 10px 0 11px;}
.otherContents .more a{font-size: 16px;padding: 10px 0 9px;}

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


.footer .instagram{font-size: 17px;}
.footer .instagram .icon{width: 34px;}
.footer h2{width: 410px;}
.footer .copyright{font-size: 13px;margin-top: 25px;}
.footer .pagetop{width: 65px;}

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

.sideNavi{display: none;}

}











@media(max-width:768px) {

.wrapper{width: 100%;overflow-x: hidden;}

.spOnly{display: block;}
.pcOnly{display: none;}
.pclink{pointer-events: none;}
.screenWide{display: none;}

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


#header h1{
	top: auto;
	width: 55vw;
	bottom: 12vw;
	-webkit-transform:none;
	transform:none;
	padding: 0 8vw;
	-webkit-transition: bottom 1.6s cubic-bezier(0.25, 1, 0.5, 1), opacity 1.0s;
	transition: bottom 1.6s cubic-bezier(0.25, 1, 0.5, 1), opacity 1.0s;
}
#header.start h1{top: auto;bottom: 15vw;}
#header h1:before{top: -3vw;}
#header h1:after{top: auto;bottom: -3vw;}

#header h2{height:60vh;top:-10vw;right: 10%;}
#header.start h2{opacity: 1;top: 0;}
#header h2 img{width: 2.2vh;margin-top: 5vh;}

.scrollbar{display: none;}

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

.lead{margin-top: 34vw;}
.lead .leadInner{width: 85%;}
.lead.delighter.started:before{width: 92.5%;}

.lead .leadInner .leadTitle,
.lead.delighter .leadInner .leadTitle{width: 38vw;top: -21vw;right: 0%;}
.lead.delighter.started .leadInner .leadTitle{top: -16vw;}

.lead .leadBody .text .date,
.lead.delighter .leadBody .text .date{left:auto;right: -4.5%;bottom: calc(3vw + 25px);}
.lead.delighter.started .leadBody .text .date{bottom: 3vw;}

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

.category{margin-top: 24vw;}

.categoryHeader .categoryCopy{width: 80%;}
.categoryHeader .categoryCopy:before{width: 80%;}

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

.separator{margin-top: 24vw;width: 90%;}

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

.feature{margin-top: 22vw;width: 90%;}
.feature.f01,.feature.f04{margin-top: 12vw;}

.feature .featureBody{width: 95%;}
.feature .copy{font-size: 14px;}

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

.pointList{width: 90%;margin-top: 10vw;}
.pointList .pointBody{width: 96%;}
.pointList h2.titlePC{display: none;}
.pointList h2.titleSP{
	display: block;
	position:relative;
	width: 100%;
	font-weight: 600;
	font-size: 25px;
	letter-spacing: 0.1em;
	line-height: 1.6;
	margin-bottom: 37px;
}
.pointList .detail h3{padding: 24px 0 24px 8%;}
.pointList ul li{margin-bottom: 37px;}

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

.itemMain{width: 90%;margin-top: 15vw;}
.itemMain.set01{margin-top: 23vw;}


.itemMain .visualBox{width: 54%;}
.itemMain.sta .visualBox{margin-left: 0%;}
.itemMain.rev .visualBox{margin-right: 0%;}

.itemMain.sta .itemName{left: -5.5%;}
.itemMain.rev .itemName{right: -5.5%;}
.itemMain .itemName h2{width: 3vw;top: 6vw;padding: 2vw 0;}

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

.itemMain.sta .itemBox{margin-right: 0%;}
.itemMain.rev .itemBox{margin-left: 0%;}
.itemList dl dd a{padding: 8px 0px 7px;}
.itemList .otherTrigger{margin-top:13px;}

.slick-dots li button{height:12px;width:32px;}


.coordinate .itemList dl .name{width: calc( 100% - 75px);font-size: 16px;}
.coordinate .itemList dl .num{width: calc( 100% - 75px);}
.coordinate .itemList dl dd{width: 70px;}
.coordinate .itemList dl dd a{font-size: 14px;}
.coordinate .itemList .otherTrigger p.more{font-size: 16px;}

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

.otherImage{margin-top: 12vw;}

.otherImage.set01{width: 85%;}
.otherImage.set02 .img01{width: 49%;margin-right: 12%;}
.otherImage.set02 .img02{width: 53%;}
.otherImage.set04{width: 85%;}
.otherImage.set05{width: 85%;}
.otherImage.set06{width: 85%;}
.otherImage.set07{width: 85%;}

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

.movieArea{margin-top: 13vw;}
.movieArea .videoBox{width: 100%;}
/*---------------------------------------*/


.coordinate{width: 90%;margin-top: 11vw;}
.coordinate .coordTitle{width: 92%;}

.coordinate .slick-list{overflow:hidden;padding-bottom: 2px;}
.coordinate .cooedItems,
.coordinate .cooedItems.delighter{
	width: 95%;
	position: relative;
	top: 30px;
	opacity: 0;
	-webkit-transition: top 1.6s cubic-bezier(0.25, 1, 0.5, 1), opacity 1.6s;
	transition: top 1.6s cubic-bezier(0.25, 1, 0.5, 1), opacity 1.6s;
}
.coordinate .cooedItems.delighter.started{opacity: 1;top: 0;}



.coordinate .cooedItems li,
.coordinate .cooedItems.delighter li{
	top: 0;
	opacity: 1;
	-webkit-transition: none;
	transition: none;
}
.coordinate .cooedItems li.left{
	padding:0 0.6%;
}
.coordinate .cooedItems li.center{
	padding:0 0.6%;
	-webkit-transition-delay: 0;
	transition-delay: 0;
}
.coordinate .cooedItems li.right{
	padding:0 0.6%;
	-webkit-transition-delay: 0;
	transition-delay: 0;
}


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

.allBanner{margin-top: 22vw;}

.allBanner .spLink{
	display: block;
	z-index: 20;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.allBanner .photo{width: 58%;padding-top: 40%;}
.allBanner .bannerInner{width: 42%;}
.allBanner .detail h2{font-size: 2.4vw;}
.allBanner .detail .more a{font-size: 2.2vw;}
.allBanner .detail .line span{top: 13%;bottom: 15%;}
.c01 .allBanner .detail .more a{border: none; background: #592E2C;color: #D9D8D6;}
.c02 .allBanner .detail .more a{border: none;background: #595B3C;color: #D9D8D6;}

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

.otherContents{width: 94%;margin-top: 24vw;}
.otherContents h2,
.otherContents h2.delighter{padding: 22px 0 20px 0;text-align: center;}

.otherContents h2:before,
.otherContents h2.delighter:before{right: 0;margin: 0 auto;}
.otherContents h2:after,
.otherContents h2.delighter:after{right: 0;margin: 0 auto;}

.otherContents h2 span,
.otherContents h2.delighter span{left: 0;}

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


.footer{padding-top:10%;background-image: url("../../images/footer_sp.jpg");}
.footer .instagram{font-size: 19px;}
.footer .instagram .icon{width: 34px;margin-top: 13px;}
.footer h2{width: 180px;margin-top: 18vw;}
.footer .copyright{font-size: 14px;margin-top: 30px;}



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


body.fixed{
    position:fixed;
    width:100%;
    height:100%;
    overflow:hidden;    
}

#trigger{display: block;}
/*トリガー*/
.menu-trigger{
	position:fixed;
	top:20px;
	left:20px;
	width:40px;
	height:30px;
	z-index:500;
    pointer-events: auto;
}
.menu-trigger span{
	position:absolute;
	left:0;
	width:100%;
	height:2px;
	background-color:#DCE3EB;
	-webkit-transition: all 0.6s cubic-bezier(0.68, -0.6, 0.32, 1.6);
	transition: all 0.6s cubic-bezier(0.68, -0.6, 0.32, 1.6);
}
.menu-trigger span:nth-of-type(1){top:0;width: 70%;left: 30%;}
.menu-trigger span:nth-of-type(2){top:14px;}
.menu-trigger span:nth-of-type(3){bottom:0;}

.menu-trigger.color span{background-color:#3D3935;}

.menu-trigger.open span:nth-of-type(1) {
	left: calc(-100% - 23px);
}
.menu-trigger.open span:nth-of-type(2) {
	left: calc(-100% - 23px);
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
}
.menu-trigger.open span:nth-of-type(3) {
	left: calc(-100% - 23px);
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.spNavi{
    position:fixed;
    top:0;
    right:0;
    left: 0;
    width:100%;
    height:100%;
    z-index:-1;
	pointer-events: none;
	opacity: 0;
    overflow:hidden;
	display: block;
	-webkit-transition-delay: 0.8s;
	transition-delay: 0.8s;
}
.spNavi.open{
	pointer-events: auto;
	 z-index:550;
	opacity: 1;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}
.spNavi .bk{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
	opacity: 0;
    -webkit-transition:opacity 0.6s 0s;
	transition:opacity 0.6s 0s;
}
.spNavi.open .bk{
	opacity: 1;
    -webkit-transition:opacity 0.8s 0.2s;
	transition:opacity 0.8s 0.2s;
}

.spNavi .bk .top{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 50%;
	background: url("../../images/spnavi_bk01.jpg") top center;
	background-size: cover;
}
.spNavi .bk .bottom{
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	bottom: 0;
	background: url("../../images/spnavi_bk02.jpg") center center;
	background-size: cover;
}

.spNavi .spCloseBT{
	position: fixed;
	top: 30px;
	left: 20px;
	z-index: 40;
	width: 100px;
	height: 100px;	
}
.spNavi .spCloseBT span{
	position:absolute;
	left:0;
	width:100%;
	top: 50%;
	height:1px;
	opacity: 0;
	background-color:#FFF;
}
.spNavi .spCloseBT span:nth-of-type(1){
	-webkit-transform:rotate(0deg);
	transform:rotate(0deg);
	-webkit-transition:all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s;
	transition:all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s;
}
.spNavi .spCloseBT span:nth-of-type(2){
	-webkit-transform:rotate(0deg);
	transform:rotate(0deg);
	-webkit-transition:all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s;
	transition:all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s;
}

.spNavi.open .spCloseBT span:nth-of-type(1){
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	opacity: 1;
	-webkit-transition:all 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.6s;
	transition:all 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.6s;
}
.spNavi.open .spCloseBT span:nth-of-type(2){
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);
	opacity: 1;
	-webkit-transition:all 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.6s;
	transition:all 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.6s;
}



.spNavi .naviInner{
    width:290px;
    position: absolute;
    top: 0;
    left:6vw;
    right:0;
	bottom: 0;
    margin: 0 auto;
	z-index: 20;
	opacity: 0;
	-webkit-transition:opacity 0.5s 0s;
	transition:opacity 0.5s 0s;
	
}
.spNavi.open .naviInner{
	opacity: 1;
	-webkit-transition:opacity 0s 0.4s;
	transition:opacity 0s 0.4s;
}
.spNavi .naviInner .innerTop{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 50%;
}
.spNavi .naviInner .innerBottom{
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	bottom: 0;
}
.spNavi .naviInner .menu{
	position: absolute;
	left: 0;
	opacity: 0;
	top: 58%;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
	-webkit-transition: top 0.6s, opacity 0.6s;
	transition: top 0.6s, opacity 0.6s;
}
.spNavi.open .naviInner .menu{
	opacity: 1;
	top: 55%;
	-webkit-transition: top 0.6s cubic-bezier(0.25, 1, 0.5, 1) 0.6s, opacity 0.6s 0.6s;
	transition: top 0.6s cubic-bezier(0.25, 1, 0.5, 1) 0.6s, opacity 0.6s 0.6s;
}
.spNavi .instagram{
	position: fixed;
	right: 5vw;
	top: 5vw;
	width: 40px;
	opacity: 0;
	-webkit-transition:opacity 0.6s;
	transition:opacity 0.6s;
}
.spNavi.open .instagram{
	opacity: 1;
	-webkit-transition:opacity 0.6s 0.6s;
	transition:opacity 0.6s 0.6s;
}

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


.spNavi .nav{
	width: 100%;
	position: relative;
}
.spNavi .nav:before{
	 content: '';
	 position: absolute;
	 top: 0;
	 left: 0;
	 width: calc(3vw + 60px);
	 height: 1px;
	 background: #FFF;
}
.spNavi .nav:after{
	 content: '';
	 position: absolute;
	 top: 0;
	 bottom: 0;
	 left: 0;
	 width: 1px;
	 background: #FFF;
}
.spNavi .topic{
	font-family: "FFTibereRegularItalic";
	font-size: 13px;
	font-weight: normal;
	letter-spacing: 0.03em;
	line-height: 1;
	color: #FFF;
	position: absolute;
	top: -1.5em;
	left:3vw;
}
.spNavi .topic span{
	font-family: 'Crimson Text', serif;
	font-weight: 400;
	font-style: italic;
	font-size: 16px;
	padding-left: 0.3em;
}

.spNavi .nav a{color: #FFF;}

.spNavi .nav h3{
	font-family: "FFTibereRegular";
	font-size: 30px;
	font-weight: normal;
	letter-spacing: 0.2em;
	line-height: 1.0;
	padding: 3.5vw 0 4vh 3vw;
}

.spNavi .nav ul{}
.spNavi .nav li{
	font-family: "FFTibereRegularItalic";
	font-size: 19px;
	font-weight: normal;
	letter-spacing: 0.15em;
	line-height: 1;
	padding-left: 12vw;
	position: relative;
	margin-bottom: 4.0vh;
}
.spNavi .nav li:before{
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 10.5vw;
	height: 1px;
	background: #FFF;
}


}






@media(max-width:720px) {


#header h1{width: 65%;}
#header.start h1{bottom: 17vw;}

#header h2{right: 7vw;}


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

.lead{margin-top: 40vw;}
.lead .leadInner .leadTitle,
.lead.delighter .leadInner .leadTitle{width: 47vw;top: -25vw;}
.lead.delighter.started .leadInner .leadTitle{top: -20vw;}

.lead .leadBody .text .date,
.lead.delighter .leadBody .text .date{width: 2.6vw;right: -3.8vw;bottom: calc(6vw + 25px);}
.lead.delighter.started .leadBody .text .date{bottom: 6vw;}

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

.mainNavi{width: 65vw;margin-top: 10vw;}
.mainNavi .navBox{width: 100%;}
.mainNavi .navBox.to01{float: none;}
.mainNavi .navBox.to02{float: none;margin-top: 13vw;}

.mainNavi .name{padding-left: 16%;}
.mainNavi .name h2{font-size: 5.0vw;padding: 0.7em 0 0.7em;}

.mainNavi .more{margin-top: 20px;}
.mainNavi .more a{font-size: 3.1vw;}
.mainNavi .to01 .more a{border-color:#592E2C;background:#592E2C;color: #D8DFE1;}
.mainNavi .to02 .more a{border-color:#595B3C;background:#595B3C;color: #D8DFE1;}

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

.categoryHeader .bkColor,
.categoryHeader.delighter .bkColor{right: 68%;}
.categoryHeader.delighter.started .bkColor{width: 32%;}

.categoryHeader .cover,
.categoryHeader.delighter .cover{width: 68%;}

.categoryHeader .photo{left: 32%;width: 68%;}

.categoryHeader .categoryTitle,
.categoryHeader.delighter .categoryTitle{width: 85%;padding-top: 15%;}
.c02 .categoryHeader .categoryTitle,
.c02 .categoryHeader.delighter .categoryTitle{width: 85%;padding-top: calc(15% - 32px);}

.categoryHeader .categoryTitle h2{font-size: 32px;margin-left: 25px;}
.categoryHeader .categoryTitle h2 br{display: block;}

.categoryHeader .categoryTitle h3{font-size: 21px;margin-top: 0.6em; margin-left: 25px;}
.categoryHeader .categoryCopy{width: 90%;margin-top: 35px;padding: 20px 0 0 25px;}
.categoryHeader .categoryCopy:before{width: 70%;}

.categoryHeader .topic{top: 1.8em;left:-3.0em;}

.c01 .categoryHeader .photo{background-image: url("../../images/category01_sp.jpg");}
.c02 .categoryHeader .photo{background-image: url("../../images/category02_sp.jpg");}


.categoryHeader .categoryTitle .titleInner:before{width: 1px;}
.categoryHeader .categoryCopy:before{height: 1px;}

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

.feature{margin-top: 27vw;width: 88%;}
.feature.f01,.feature.f04{margin-top: 16vw;}

.feature .featureBody{width: 92%;}
.feature .featureBody .textBox{width: 95%;padding-left: 3%;}

.feature h2{font-size: 34px;margin-top: 35px;}
.feature h3{font-size: 16px;}

.feature .topic:before,
.feature.delighter .topic:before{height: 1px;}
.feature.delighter.started .topic:before{width: calc( 107% - 6.5em );}
.feature .featureBody:before,
.feature.delighter .featureBody:before{width: 1px;}

.c02 .feature .featureBody .textBox{padding-bottom: 15%;}

.feature .photo,
.feature.delighter .photo{padding-top: 95%;}
.feature.f01 .photo{background-image: url("../../images/feature01sp.jpg");}
.feature.f02 .photo{background-image: url("../../images/feature02sp.jpg");}
.feature.f03 .photo{background-image: url("../../images/feature03sp.jpg");}
.feature.f04 .photo{background-image: url("../../images/feature04sp.jpg");}
.feature.f05 .photo{background-image: url("../../images/feature05sp.jpg");}
.feature.f06 .photo{background-image: url("../../images/feature06sp.jpg");}

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

.pointList{width: 92%;margin-top: 11vw;}
.pointList h2.titleSP{font-size: 25px;line-height: 1.5;margin-bottom: 37px;}

.pointList ul li{margin-bottom: 8vw;}

.pointList .detail{width: 91%;position: relative;}
.pointList .detail:before,
.pointList .delighter .detail:before{width: 1px;}
.pointList .detail h3:before,
.pointList .delighter .detail h3:before{height: 1px;}

.pointList .detail h3{padding: 22px 0 25px 6%;font-size: 21px;}
.pointList .detail .copy,
.pointList .delighter .detail .copy{width: 100%;height: 46vw;}
.pointList .detail .copy p{
	position:relative;
	top: 0;
	left:0;
	padding: 4% 0 0 6%;
	font-size: 14px;
	-webkit-transform:none;
	transform:none;
	width: 55vw;
}
.pointList .photo{
	position:absolute;
	bottom: 0;
	right: -5.8vw;
	width: 35vw;
	margin-left: 0;
}

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


.itemMain{width: 90%;margin-top: 15vw;}
.itemMain.set01{margin-top: 23vw;}
.itemMain.set03{margin-top: 10vw;}


.itemMain .visualBox{width: 76%;}
.itemMain.sta .visualBox{float: none;margin: 0 auto;}
.itemMain.rev .visualBox{float: none;margin: 0 0 0 0;margin-left: calc(24% + 5vw);}

.itemMain .itemName{width: 5vw;}
.itemMain.sta .itemName{left: -10vw;}
.itemMain.rev .itemName{right: -10vw;}
.itemMain .itemName h2{width: 4.8vw;top: 7vw;padding: 2vw 0;left: -1.4vw;}
.itemMain .itemName:before,
.itemMain .delighter .itemName:before{width: 1px;}


.itemMain .itemBox,
.itemMain .itemBox.delighter{width: 71%;}

.itemMain.sta .itemBox{float: none;margin: 12vw auto 0;}

.itemListOnly{
	position:relative;
	width: 76%;
	margin-left: calc(24% + 5vw);
}
.itemMain.rev .itemBox{float: none;margin: 8% 0 0 7%;}
.itemMain .itemListOnly .itemBox,
.itemMain .itemListOnly .itemBox.delighter{width: 83%;margin: 8% 0 0 7%;}


.itemMain .itemBox .itemSlide .itemSlick{border-width: 1px;}
.itemMain .itemBox .itemSlide{padding-bottom: 50px;}

.itemList dl .name{width: calc( 100% - 85px);font-size: 16px;}
.itemList dl .num{width: calc( 100% - 85px);}
.itemList dl dd{width: 80px;}

.coordinate .itemList dl .name{width: calc( 100% - 85px);font-size: 16px;}
.coordinate .itemList dl .num{width: calc( 100% - 85px);}
.coordinate .itemList dl dd{width: 80px;}
.coordinate .itemList dl dd a{font-size: 15px;}



.c01 .itemList dl dd a{background:#592E2C;border-color: #592E2C;color: #D9D8D6;}
.c02 .itemList dl dd a{background:#595B3C;border-color: #595B3C;color: #D9D8D6;}

.itemList .otherTrigger p.more{margin-left: 43px;padding:6px 5px 6px 0;font-size: 16px;}
.itemList .otherTrigger p.close{left: 43px; padding:6px 5px 6px 0;font-size: 16px;}
.itemList .otherTrigger span{width: 33px;height: 27px;}

.coordinate .itemList .otherTrigger p.more{margin-left: 43px;padding:6px 5px 6px 0;font-size: 16px;}
.coordinate .itemList .otherTrigger p.close{left: 43px; padding:6px 5px 6px 0;font-size: 16px;}



/*-------------*/
.slick-prev,
.slick-next {width: 8vw;height: 8vw;top:49vw;}
.slick-prev{left:-8vw;}
.slick-next{right:-8vw;}

.itemMain .slick-prev,
.itemMain .slick-next {top: 50%;margin-top: -4vw;}
.itemMain .slick-prev{left:-10vw;}
.itemMain .slick-next{right:-10vw;}

.slick-prev::after{left: 3vw;width: 5.0vw;height: 5.0vw;  }
.slick-next::after{right: 3vw;  width: 5.0vw;height: 5.0vw;  }
.slick-dots li{margin: 0 7px;}


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

.otherImage{margin-top: 13vw;}
.otherImage.set01,
.otherImage.set02,
.otherImage.set03,
.otherImage.set04,
.otherImage.set05,
.otherImage.set06,
.otherImage.set07{width: 100%;}

.otherImage.set01 .img01{width: 74.6%;margin-right: 0;z-index: 7;}
.otherImage.set01 .img02{width: 59.7%;margin-top: -15%;}
.otherImage.set02 .img01{width: 74.6%;margin-right: 10%;}
.otherImage.set02 .img02{width: 82%;margin-top:10vw;}
.otherImage.set04 .img01{width: 74.6%;margin-right: 0;}
.otherImage.set04 .img02{width: 59.7%;margin-top: -5%;}
.otherImage.set05 .img01{width: 89.3%;margin-right: 0;}
.otherImage.set05 .img02{width: 59.7%;margin-top: 10%;margin-left: 0;}
.otherImage.set06 .img01{width: 74.6%;margin-right: 7.5%;}
.otherImage.set07 .img01{width: 74.6%;margin-right: 0;}
.otherImage.set07 .img02{width: 59.7%;margin-top: -11%;margin-left: 0;}



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

.movieArea{margin-top: 14vw;}

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

.coordinate{width: 100%;margin-top: 12vw;}
.coordinate .coordTitle{width: 94%;margin:0 0 0 6%;}
.coordinate .coordTitle:before,
.coordinate .coordTitle.delighter:before{width: 1px;}

.coordinate .coordTitle h2{font-size: 32px;padding: 30px 0 30px 3.5vw;}
.coordinate .coordTitle h2:before,
.coordinate .coordTitle.delighter h2:before{height: 1px;}

.coordinate .coordTitle .copy,
.coordinate .coordTitle.delighter .copy{padding: 3.5vw 0 4.5vw 3.5vw;font-size: 14px;width: 90%;}


.coordinate .cooedItems,
.coordinate .cooedItems.delighter{width: 72%;margin-top: 10vw;}

.coordinate .cooedItems li.left{padding:0 0.7%;}
.coordinate .cooedItems li.center{padding:0 0.7%;}
.coordinate .cooedItems li.right{padding:0 0.7%;}

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

.allBanner{width: 88%;border-width: 1px;margin-top: 23vw;}
.allBanner .detail{width: 100%;}

.allBanner .detail h2{font-size: 2.6vw;}
.allBanner .detail .more{width: 80%;margin: 0 auto;}
.allBanner .detail .more a{font-size: 2.6vw;}

.allBanner .detail .line{padding-top: 35%;}
.allBanner .detail .line span{top: 13%;bottom: 17%;}


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

.otherContents{width: 72%;}
.otherContents h2,
.otherContents h2.delighter{width: 100%;}
.otherContents h2 span,
.otherContents h2.delighter span{font-size: 32px;}

.otherContents .otherList{margin-top: 0;padding-bottom: 17vw;}
.otherContents .otherList ul{width: 80%;margin: 0 auto;max-width: 320px;margin-top: 12%;}
.otherContents .otherList ul li{width: 100%;margin:0 auto;display: block;padding: 0 10%;}
.otherContents .otherList ul li:nth-child(1),
.otherContents .otherList ul li:nth-child(2){margin-bottom: 14%;padding-bottom: 14%;border-bottom: 1px solid #5C3327;}

.otherContents .otherList ul:before{display: none;}
.otherContents .otherList ul:after{display: none;}

.otherContents h3{font-size: 22px;line-height: 1.2;}
.otherContents h4{font-size: 15px;}

.otherContents .more{margin: 20px auto 0;border-width: 1px;}
.otherContents .more span{font-size: 16px;}
.otherContents .more a{font-size: 17px;padding: 11px 0 10px;}

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

.footer{margin-top: 18vw;padding-top: 11vw;padding-bottom: 40px;}

.footer h2{width: 160px;margin-top: 20vw;}
.footer .copyright{margin-top: 20px;line-height: 1.2;}
.footer .copyright br{display: block;}

.footer .pagetop{width: 60px;top: 25vw;}

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

}









@media(max-width:550px) {


#header h1{padding: 0 8vw;}
#header.start h1{bottom: 17vw;}
#header h1:before{top: -4vw;}
#header h1:after{bottom: -4vw;}
#header h2 img{left: 0.8vw;}

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

.lead{margin-top: 45vw;}
.lead .leadInner .leadTitle,
.lead.delighter .leadInner .leadTitle{width: 53vw;top: -28vw;}
.lead.delighter.started .leadInner .leadTitle{top: -23vw;}
.lead.delighter .leadBody .text .date{width: 2.8vw;right: -3.8vw;}
.lead.delighter .leadBody .text p{font-size: 13px;line-height: 2.3;}

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

.mainNavi{width: 66vw;margin-top: 11vw;}
.mainNavi .navBox.to02{float: none;margin-top: 16vw;}
.mainNavi .name h2{font-size: 5.2vw;padding: 0.8em 0 0.7em;}
.mainNavi .more{margin-top: 15px;}
.mainNavi .more a{font-size: 3.4vw;}

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

.c02 .categoryHeader .categoryTitle,
.c02 .categoryHeader.delighter .categoryTitle{padding-top: calc(15% - 27px);}
.categoryHeader .categoryTitle h2{font-size: 27px;margin-left: 22px;}
.categoryHeader .categoryTitle h3{font-size: 19px;margin-left: 22px;}
.categoryHeader .categoryCopy{width: 95%;margin-top: 30px;padding: 18px 0 0 22px;}
.categoryHeader .categoryCopy p{font-size: 13px;line-height: 2.1;}

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

.feature h2{font-size: 30px;margin-top: 35px;}
.feature h3{font-size: 15px;}
.feature .copy{font-size: 13px;line-height: 2.1;}
.feature .featureBody .textBox{width: 100%;padding-left: 6%;}

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

.pointList h2.titleSP{font-size: 22px;margin-bottom: 5vw;}

.pointList ul li{margin-bottom: 10vw;}

.pointList .detail h3{padding: 18px 0 23px 6%;font-size: 19px;}

.pointList .detail .copy,
.pointList .delighter .detail .copy{;height: 50vw;}
.pointList .detail .copy p{padding: 5% 0 0 6%;font-size: 13px;line-height: 2.0;width: 53vw;}
.pointList .photo{right: -5.8vw;width: 37vw;}

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

.itemList dl{margin-top: 12px;}
.itemList dl .num{margin-top: 0;}
.itemList dl dd a{font-size: 14px;}

.coordinate .itemList dl{margin-top: 12px;}
.coordinate .itemList dl .num{margin-top: 0;}
.coordinate .itemList dl dd a{font-size: 14px;}

.slick-dots li button{height:11px;width:28px;}

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

.coordinate .coordTitle h2{font-size: 30px;padding: 28px 0 28px 3.5vw;}
.coordinate .coordTitle .copy,
.coordinate .coordTitle.delighter .copy{padding: 4vw 0 5vw 3.5vw;font-size: 13px;line-height: 2.1; width: 92%;}

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

.otherContents h2,
.otherContents h2.delighter{padding: 18px 0 16px 0;}
.otherContents h2 span,
.otherContents h2.delighter span{font-size: 30px;}

.otherContents h3{font-size: 20px;}
.otherContents h4{font-size: 14px;margin-top: 0.3em;}

.otherContents .photo{margin-top: 15px;}


.otherContents .more span{}
.otherContents .more a{padding: 10px 0 9px;}


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

.footer .instagram{font-size: 17px;}
.footer .instagram .icon{width: 30px;}
.footer h2{width: 140px;margin-top: 25vw;}

.footer .pagetop{width: 55px;top: 25vw;}

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

.menu-trigger{top:15px;left:13px;width:26px;height:18px;}
.menu-trigger span{height:1px;}
.menu-trigger span:nth-of-type(2){top:9px;}

.spNavi .spCloseBT{top: 5vw;left: 2vw;width: 86px;height: 86px;}
.spNavi .instagram{right: 5vw;top: 9vw;width: 32px;}

.spNavi .nav:before{width: calc(4vw + 45px);}

.spNavi .naviInner{width:55vw;left:9vw;}

.spNavi .topic{font-size: 12px;}
.spNavi .topic span{font-size: 14px;}

.spNavi .nav h3{font-size: 5.5vw;padding: 5vw 0 4vh 4vw;}
.spNavi .nav li{font-size: 3.6vw;padding-left: 16vw;margin-bottom: 3.6vh;}
.spNavi .nav li:before{width: 14vw;}

}






@media(max-width:440px) {


#header h1{bottom: 16vw;}
#header.start h1{bottom: 22vw;}



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

.lead{margin-top: 46vw;}
.lead .leadInner .leadTitle,
.lead.delighter .leadInner .leadTitle{width: 55vw;top: -29vw;}
.lead.delighter.started .leadInner .leadTitle{top: -24vw;}
.lead.delighter .leadBody .text .date{width: 3vw;right: -3.8vw;}
.lead.delighter .leadBody .text p{font-size: 13px;line-height: 2.1;}

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

.mainNavi .name .topic{font-size: 12px;top: -1.6em;}
.mainNavi .name .topic span{font-size: 14px;}

.mainNavi .name h2{font-size: 5.5vw;}
.mainNavi .more{margin-top: 12px;}
.mainNavi .more a{font-size: 3.8vw;}

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

.separator{margin-top: 26vw;width: 90%;}

.category{margin-top: 26vw;}

.categoryHeader .topic span{font-size: 14px;}
.categoryHeader .categoryTitle h2{font-size: 21px;margin-left: 18px;}
.categoryHeader .categoryTitle h3{font-size: 16px;margin-left: 18px;}
.categoryHeader .categoryCopy{width: 98%;margin-top: 27px;padding: 16px 0 0 18px;}
.categoryHeader .categoryCopy p{font-size: 12px;line-height: 2.0;}

.c02 .categoryHeader .categoryTitle,
.c02 .categoryHeader.delighter .categoryTitle{padding-top: calc(15% - 21px);}


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

.feature{margin-top: 32vw;}
.feature.f01,.feature.f04{margin-top: 18vw;}

.feature .featureBody .textBox{padding-bottom: 8%;}
.c02 .feature .featureBody .textBox{padding-bottom: 18%;}

.feature .featureBody:before,
.feature.delighter .featureBody:before{top: 7px;}

.feature .topic,
.feature.delighter .topic{font-size: 12px;}
.feature .topic span{font-size: 14px;}
.feature .topic:before,
.feature.delighter .topic:before{left: 6.0em;}
.feature.delighter.started .topic:before{width: calc( 106% - 6.5em );}

.feature h2{font-size: 24px;margin-top: 30px;}
.feature h3{font-size: 15px;}
.feature .copy{font-size: 12px;line-height: 2.0;margin-top: 2.0em;}

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

.pointList{margin-top: 12vw;}
.pointList h2.titleSP{font-size: 18px;margin-bottom: 5vw;}
.pointList .detail h3{padding: 15px 0 20px 6%;font-size: 16px;}

.pointList .delighter .detail .copy{height: 52vw;}
.pointList .detail .copy p{font-size: 12px;line-height: 1.8;}
.pointList .photo span{padding-top: 126%;}

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

.itemMain{width: 90%;margin-top: 17vw;}
.itemMain.set01{margin-top: 25vw;}

.itemMain .visualBox{width: 80%;}
.itemMain.rev .visualBox{margin-left: calc(20% + 5vw);}


.itemListOnly{width: 80%;margin-left: calc(20% + 5vw);}

.itemMain .itemName{width: 5.2vw;}
.itemMain.sta .itemName{left: -8vw;}
.itemMain.rev .itemName{right: -8vw;}
.itemMain .itemName h2{width: 5.0vw;}
.itemMain.rev .itemBox{float: none;margin: 8% 0 0 0;}
.itemMain .itemListOnly .itemBox,
.itemMain .itemListOnly .itemBox.delighter{width: 92%;margin: 8% 0 0 0;}



.itemMain .itemBox,
.itemMain .itemBox.delighter{width: 75%;}
.itemMain.sta .itemBox{margin-top: 13vw;}

.itemMain .itemBox .text {width: 110%;margin-left: -5%;}
.itemMain .itemBox .text p{font-size: 12px;}

.itemMain .itemList{width: 108%;margin-left: -4%;}
.itemMain .itemListOnly .itemList{width: 100%;margin-left: 0;}


.coordinate .itemList dl,
.itemList dl{margin-top: 10px;}
.coordinate .itemList dl .name,
.itemList dl .name{width: calc( 100% - 75px);font-size: 15px;line-height: 1.0;}
.coordinate .itemList dl .name span,
.itemList dl .name span{font-size: 11px;}
.coordinate .itemList dl .num,
.itemList dl .num{width: calc( 100% - 75px);font-size: 11px;}
.coordinate .itemList dl dd,
.itemList dl dd{width: 70px;}
.coordinate .itemList dl dd a,
.itemList dl dd a{font-size: 13px;padding: 7px 0px 5px;}
.coordinate .itemList .otherTrigger p.more,
.itemList .otherTrigger p.more{font-size: 15px;padding:5px 5px 5px 0;}
.coordinate .itemList .otherTrigger p.close,
.itemList .otherTrigger p.close{font-size: 15px;padding:5px 5px 5px 0;}
.coordinate .itemList .otherTrigger span,
.itemList .otherTrigger span{width: 33px;height: 25px;}


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

.coordinate{margin-top: 15vw;}
.coordinate .coordTitle h2{font-size: 24px;padding: 20px 0 20px 4.5vw;}
.coordinate .coordTitle .copy,
.coordinate .coordTitle.delighter .copy{padding: 4vw 0 5.5vw 4.5vw;font-size: 12px;line-height: 2.0;}

.coordinate .cooedItems,
.coordinate .cooedItems.delighter{width: 80%;margin-top: 10vw;}

.coordinate .cooedItems li.left{padding:0 0.9%;}
.coordinate .cooedItems li.center{padding:0 0.9%;}
.coordinate .cooedItems li.right{padding:0 0.9%;}

.slick-prev{left:-7vw;}
.slick-next{right:-7vw;}
.coordinate .itemList{width: 102%;margin-left: -1%;}


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

.otherImage{margin-top: 15vw;}

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

.movieArea{margin-top: 16vw;}
.movieArea .thumb .playBT .play{padding:4.3vw;}

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

.allBanner{margin-top: 23vw;}
.allBanner .photo{width: 52%;padding-top: 43%;}
.allBanner .bannerInner{width: 48%;}
.allBanner .detail h2{font-size: 3.2vw;}
.allBanner .detail .more a{font-size: 3.1vw;padding: 7px 0 7px;}
.allBanner .detail .line{padding-top: 30%;}

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

.otherContents h2,
.otherContents h2.delighter{padding: 16px 0 14px 0;}
.otherContents h2 span,
.otherContents h2.delighter span{font-size: 26px;}

.otherContents .otherList{padding-bottom: 20vw;}
.otherContents .otherList ul{width: 85%;margin-top: 15%;}
.otherContents .otherList ul li:nth-child(1),
.otherContents .otherList ul li:nth-child(2){margin-bottom: 16%;padding-bottom: 16%;}

.otherContents h3{font-size: 17px;}
.otherContents h4{font-size: 13px;margin-top: 0.3em;}

.otherContents .more{margin-top: 15px}
.otherContents .more span{font-size: 14px;padding: 8px 0 8px;}
.otherContents .more a{font-size: 16px;padding: 8px 0 7px;}


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

.footer{margin-top: 22vw;padding-top: 13vw;}
.footer .instagram{font-size: 16px;}
.footer .instagram .icon{width: 28px;}
.footer h2{width: 120px;margin-top: 25vw;}
.footer .pagetop{width: 50px;top: 25vw;}
.footer .copyright{font-size: 13px;}

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

.spNavi .spCloseBT{top: 4vw;left: 1vw;width: 75px;height: 75px;}
.spNavi .instagram{width: 30px;}

.spNavi .naviInner{left:15vw;width:56vw;}

}






@media(max-width:360px) {


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

.otherContents .otherList ul{width: 88%;}
.otherContents h3{font-size: 16px;}
.otherContents h4{font-size: 12px;}

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

.footer .copyright{font-size: 12px;}

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

.spNavi .spCloseBT{width: 70px;height: 70px;}
.spNavi .naviInner{left:15vw;width:60vw;}
.spNavi .nav li{font-size: 4.0vw;}
}