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

/*=======
  
2017autumn

========*/

#SPimg{display:none;}

/*スライドトップ*/
#slideTop {position:relative;}
#slideTop .mainView{
	margin:-75px auto 50px;
	padding:10px;
	width:674px;
	height:253px;
	background-color:#FFF;
	line-height:0;
}
#slideTop .mainView ul{
	width: 682px;
	height: 320px;
}
#slideTop .mainView li{
	position:absolute;
	list-style-type:none;
}
#slideTop .thumbNail{
	position:absolute;
	bottom: -30px;
    left: 351px;
}
#slideTop .thumbNail li{
	float:left;
	width: 20px;
	height: 20px;
    background: url(../../images/history/2018/BtnPhotoList.png) no-repeat center center;
	list-style-type:none;
	cursor: pointer;
    transition: background 0.5s; 
    -webkit-transition: background 0.5s;
}
#slideTop .thumbNail li:hover{
	opacity:0.8;
	-ms-filter: "alpha(opacity=80)";  /* ie 8 */
	filter: alpha(opacity=80);        /* ie lt 8 */

	-moz-opacity:0.8;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.8;              /* Safari 1.x */
}
#slideTop .thumbNail li.active{
    background: url(../../images/history/2018/BtnPhotoList_on.png) no-repeat center center;
}

.PhotoPut .mainView li{
	position:absolute;
	list-style-type:none;
}
.PhotoPut .thumbNail li:hover{
	opacity:0.8;
	-ms-filter: "alpha(opacity=80)";  /* ie 8 */
	filter: alpha(opacity=80);        /* ie lt 8 */

	-moz-opacity:0.8;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.8;              /* Safari 1.x */
}

/*各ブース*/
.PhotoCircle{
	position:absolute;
	list-style-type:none;
    border-radius: 50%;
    padding: 10px;
    background: #fff;
    -webkit-box-shadow:0px 0px 2px 2px rgba(0,0,0,0.1);
    -moz-box-shadow:0px 0px 2px 2px rgba(0,0,0,0.1);
    box-shadow:0px 0px 2px 2px rgba(0,0,0,0.1);
}
#ContentsInner {
	overflow:visible;
    padding-bottom: 0;
}
#ContentsMain{
    background:url(../../images/history/2018/OutlineCI.jpg) ;
    overflow: hidden;
}

/*ページ内リンク*/
#BoothNav {
    display: flex;

    flex-wrap: wrap;
    justify-content:center;
}
#BoothNav li a{
    position: relative;
    display: block;
    margin: 0 10px 0 0;
    width: 240px;
    height: 60px;
    border-radius: 5px;
    background-color: #e38835;
    list-style: none;
    text-indent: -999px;
    z-index: 0;
		box-shadow: 1px 8px 15px rgba(0,0,0,0.25);
}

#BoothNav li:last-child a{
	margin: 0;
}
/*#BoothNav li a:before{
    position: absolute;
    bottom: -5px;
    left: 50%;
    display: block;
    margin-left: -3px;
    width: 15px;
    height: 15px;
    border-top: 1px solid #333;
    border-right: 1px solid #333;
    content: "";
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    z-index: 2;
    transition: bottom 1s; 
    -webkit-transition: bottom 1s;
}*/
#BoothNav li a:after{
    position: absolute;
		top:10px;
    left: 10px;
    display: block;
    width: 217px;
    height: 38px;
    background: url(../../images/history/2018/BoothHM.png);
    content: "";
    z-index: 1;
}

#BoothNav li#NavFood a{background-color: #0072a8;}
#BoothNav li#NavFood a:after{
    left: 10px;
    width: 172px;
    height: 42px;
    background: url(../../images/history/2018/BoothFD.png);
}
#BoothNav li#NavWorkshop a{background-color: #045f3b;}
#BoothNav li#NavWorkshop a:after{
    left: 10px;
		top:8px;
    width: 160px;
    height: 44px;
    background: url(../../images/history/2018/BoothWS.png);
}
/*hover*/
#BoothNav li:hover a{opacity: .8;}
#BoothNav li:hover a:before{bottom: -15px;}

/*概要*/
#OutlineBox{
	position:relative;
	background: url(../../images/history/2018/OutlineCI.jpg);
	/*height: 1137px;*/
}

#Outline2018 {
    position:relative;
    margin-top:45px;
    text-align:center;
}
#Outline2018 span{}
#Outline2018 span a{
    position: absolute;
    display: block;
    margin: 0 10px;
    width: 400px;
    height: 60px;
    border-radius: 5px;
    background: rgba(242,172,153,0.5);
    list-style: none;
    text-indent: -999px;
    z-index: 0;
    left: 16px;
    bottom: 0;
}
#Outline2018 span a{
    position: absolute;
		bottom: -50px;
		left:22px;
    display: block;
    width: 350px;
    height: 61px;
		background: url(../../images/history/2018/BoothCI.png);
    content: "";
    z-index: 1;
}
#Outline2018 span:hover{opacity:.8;}

/*ブース*/
h3{
	padding-top:48px;
	margin-top: 55px;
	text-align:center;
}
#FoodBox h3{ padding-top:0px;}
#WorkshopBox h3{padding-top: 0px;}

#HandmadeBox,
#WorkshopBox,
#FoodBox{
	position:relative;
}
#HandmadeBox{
    margin: -2px 0 0 0px;
    padding: 0;
	height:1609px;
    background:url(../../images/history/2018/Hbg.jpg) no-repeat center top;
}
#FoodBox {
	height:1464px;
    background:url(../../images/history/2018/Fbg.jpg) no-repeat center top;
}
#WorkshopBox{
	height:1090px;
    background:url(../../images/history/2018/Wbg.jpg) no-repeat center top;
}
.PhotoPut{
	position:absolute;
	padding:10px;
	background-color:#FFF;
    -webkit-box-shadow:0px 0px 2px 2px rgba(0,0,0,0.1);
    -moz-box-shadow:0px 0px 2px 2px rgba(0,0,0,0.1);
	box-shadow:0px 0px 2px 2px rgba(0,0,0,0.1);
	list-style-type:none;
	line-height:0;
}

.Oblong{
	width:301px;
	height:167px;
}
.sub1{
	width: 265px;
	height: 140px;
	z-index: 100;
}

.sub2{
	width: 408px;
	height: 377px;
}

.sub3{
	width: 326px; 
	height: 188px;
}



.sub4{
	width: 336px;
	height: 195px;
}

.sub5{
	width: 308px;
	height: 217px;
}

.sub6{
	width: 352px;
	height: 276px;
}

.sub7{
	width: 317px;
	height: 173px;
}

.clImg{
	width:682px;
	height:320px;
    margin:0 auto;
}

.sub5{
	width: 308px;
	height: 217px;
}

.tapeL,.tapeR {
	position:absolute;
	width:32px;
	height:32px;
}
.tapeL {
	top:-10px;
	left:-10px;
}
.tapeR {
	right:-10px;
	bottom:-10px;
}

.PhotoPut .thumbNail{
	position:absolute;
	bottom:-30px;
	left:0;
}

.PhotoPut .middleThumbNail{
	left:326px;
}

.PhotoPut .rightThumbNail{
	left: 360px;
}


.PhotoPut .thumbNail.thumbNailR{
	right:0;
	left:auto;
}
.PhotoPut .thumbNail li{
    background-position: center;
	float:left;
	width: 20px;
	height: 20px;
    background: url(../../images/history/2018/BtnPhotoList.png) no-repeat center center;
	list-style-type:none;
	cursor: pointer;
    transition: background 0.5s; 
    -webkit-transition: background 0.5s;
}
.PhotoPut .thumbNail li.active{
    background: url(../../images/history/2018/BtnPhotoList_on.png) no-repeat;
}