@charset "UTF-8";


/*-----------------------------------------------
	Layout (PC)
------------------------------------------------*/
/*---------------------------------------------------------------------------------
  HOME use ///////////////////////////////////////////////////////////////////////
---------------------------------------------------------------------------------*/
/* header use ---------------------------*/
#home header {
margin: 0 auto; width: 100%; 
background: url(../images/bg_01.png) top center no-repeat;
}
@media screen and (min-width: 751px) and (max-width: 1599px){
    #home header {
    background: url(../images/bg_01-less1600.png) top center no-repeat;
    background-size: contain;
    min-width:1260px; 
    }
}

#home header div.main{ text-align: center;}
#home header div.main img{ width:100%; min-width:1260px; max-width: 1600px; margin: 0 auto;}
#home header div.top_date_place{ display: table; margin: 0 auto; width: 100%; max-width: 1600px; min-width: 1260px; padding-top: 2%;}
#home header div.top_date_place .topdate{ display:table-cell; vertical-align: bottom; width:49%; padding-right: 1%; text-align: right;line-height: 0;}
#home header div.top_date_place .topdate img{ width:100%; max-width: 568px;}
#home header div.top_date_place .top_d_p{display: table-cell; width: 11.8125%;}
#home header div.top_date_place .topplace{ display:table-cell; vertical-align: bottom; 
width: 38.1875%; line-height: 0;}
#home header div.top_date_place .topplace img{ width: 100%; max-width: 427px; margin-top: 0;}
@media screen and (min-width: 751px) and (max-width: 1599px){
    #home header div.top_date_place .topdate img,
    #home header div.top_date_place .topplace img{ width:78.75%;
    }
}
/*---- header use ---------------------------*/

/* movie use ---------------------------*/
.movieArea{ max-width: 1600px; margin:  0 auto;}
.movieArea2{ max-width: 600px; margin:  0 auto;}
.movie-wrap {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    max-width:1600px;
}
.movie-wrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    max-width:1600px;
}
/*---- movie use ---------------------------*/
/* newsarea use ---------------------------*/         
#home section div#ctg .newsarea{ width:1200px; margin: 0 auto; border:1px solid #b2943b;  box-sizing: border-box; height: 113px; position: relative;}
#home section div#ctg .newsarea .ttlarea{ position: absolute; top:0; left:0;  height: 111px; }
#home section div#ctg .newsarea .ttlarea p{display: table-cell; vertical-align: middle;padding: 0 30px; height: 111px; background: #fff;}
#home section div#ctg .newsarea .ttlarea p img{ width:86px;}
#home section div#ctg .newsarea .copyarea{display: table-cell; vertical-align: middle; height: 111px; }
#home section div#ctg .newsarea .copyarea .sclbox{ overflow-y: scroll; height: 111px;width:1198px; padding: 1.4em 10px 1.4em 176px; box-sizing: border-box;}
#home section div#ctg .newsarea .copyarea .sclbox ul{ display: table-cell; vertical-align: middle; width:1198px; height: 111px;
padding: 0em 0;}
#home section div#ctg .newsarea .copyarea .sclbox ul li{ display: block; line-height:1.75;}
#home section div#ctg .newsarea .copyarea .sclbox ul span,
#home section div#ctg .newsarea .copyarea .sclbox ul a{ float:left;}
#home section div#ctg .newsarea .copyarea .sclbox ul span{ display: block; width:12%; min-with:14em;}
#home section div#ctg .newsarea .copyarea .sclbox ul li a{ display: block; width:88%; text-decoration: underline; color: #000; margin-bottom: 1em;}
#home section div#ctg .newsarea .copyarea .sclbox ul li:last-child a{  margin-bottom: 1.25em;}

#home section div#ctg .newsarea .copyarea .sclbox ul a:hover{ opacity: 0.5; filter: alpha(opacity=50); -ms-filter: "alpha(opacity=50)"; -khtml-opacity: 0.5; -moz-opacity: 0.5; transition-duration: 0.3s;}       
/*---- newsarea use ---------------------------*/ 

/* bannerarea use ---------------------------*/     
#home section div#ctg .bannerarea{ width:1205px; text-align: center; margin-top: 67px;}
#home section div#ctg .bannerarea a:hover{ opacity: 0.5; filter: alpha(opacity=50); -ms-filter: "alpha(opacity=50)"; -khtml-opacity: 0.5; -moz-opacity: 0.5; transition-duration: 0.3s;}
#home section div#ctg .bannerarea .bnr-1p{ margin-top:10px;}
#home section div#ctg .bannerarea .bnr-2p{ margin-top:10px;}

#home section div#ctg .bannerarea .bnr-2p p.left{float:left; width:590px;}
#home section div#ctg .bannerarea .bnr-2p p.right{float:right; width:590px;}
#home section div#ctg .bannerarea img{ width:60%;}
/*---- bannerarea use ---------------------------*/ 


/* highlights use ---------------------------*/  
#home section .highlights{ background: url(../images/bg_02.png) top center no-repeat; min-height: 1860px; min-width:1260px;}

#home section div#ctg .highlightsarea{ width:1210px; text-align: center; margin-top: 67px;}
#home section div#ctg .highlightsarea a:hover{ opacity: 0.5; filter: alpha(opacity=50); -ms-filter: "alpha(opacity=50)"; -khtml-opacity: 0.5; -moz-opacity: 0.5; transition-duration: 0.3s;}
#home section div#ctg .highlightsarea .readcopy{width:1182px; margin: 0 auto 30px auto; padding-top: 30px;}
#home section div#ctg .highlightsarea .readcopy .text{position: relative; padding-bottom:80px;}
#home section div#ctg .highlightsarea .readcopy .text .text_block{display: block; padding: 0 0 2.5em 0;}
#home section div#ctg .highlightsarea .highlights_slt{width:1205px; margin: -80px auto 0 auto; padding-top: -142px; position: relative;}
#home section div#ctg .highlightsarea .highlights_slt p.ttl{position: absolute; top:0; right:0;}

#home section div#ctg .highlightsarea .highlights_slt div.hl-main .pc_base{width:1205px; height:1208px; margin: 0 auto;  background: url(../images/highlights_base-pc.png) top center no-repeat; position: relative;}
#home section div#ctg .highlightsarea .highlights_slt div.hl-main .pc_base p#thumbnail{position: absolute; top:0; left: 0; z-index2;}
#home section div#ctg .highlightsarea .highlights_slt div.hl-main .pc_base p#thumb_on{ position: absolute; top:0; left: 0; z-index3; display: none;}
#home section div#ctg .highlightsarea .highlights_slt div.hl-main .pc_base p#onmap{position: absolute; top:0; left: 0; z-index4;}
#home section div#ctg .highlightsarea .highlights_slt div.hl-main .pc_base area{ curor:pointer;}

/* -- move image -------------------------------------------------- */
.pic1,.pic2,.pic3,.pic4,.pic5,.pic6,.pic7,.pic8,.pic9,.pic10,.pic11,.pic12{ 
opacity: 0;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}
.pic1{ transition-delay:0.1s;}
.pic2{ transition-delay:0.2s;}
.pic3{ transition-delay:0.3s;}
.pic4{ transition-delay:0.4s;}
.pic5{ transition-delay:0.5s;}
.pic6{ transition-delay:0.7s;}
.pic7{ transition-delay:0.8s;}
.pic8{ transition-delay:0.9s;}
.pic9{ transition-delay:1.0s;}
.pic10{ transition-delay:1.1s;}
.pic11{ transition-delay:1.2s;}
.pic12{ transition-delay:1.3s;}

.pic_delay{opacity: 1;}

.picAllclose{
opacity: 0;
-webkit-transition: all 0s;
-moz-transition: all 0s;
-ms-transition: all 0s;
-o-transition: all 0s;
transition: all 0s;
}

#home section .highlights .tab{display:none;}
/* -------------------------------------------------- move image -- */
/*---- highlights use ---------------------------*/ 

/* Information use ---------------------------*/  
#home section .Information{ background: url(../images/bg_03.png) center 200px no-repeat; min-height: 780px; min-width:1260px;}
#home section div#ctg .Informationarea{ width:1200px; text-align: center; margin:0 auto;}
/*#home section div#ctg .Informationarea .left{ float: left; width:322px; text-align: left;}
#home section div#ctg .Informationarea .right{ float: right; width:878px; text-align: right;}*/

#home section div#ctg .Informationarea .left{ float: left; width:510px; text-align: left; margin: 0 0 0 66px;}
#home section div#ctg .Informationarea .right{ float: right; width:510px; text-align: right; margin:  0 66px 0 0;}

#home section div#ctg .Informationarea .left .twitterarea,
#home section div#ctg .Informationarea .right .facebook{ box-sizing: border-box; padding: 5px; background: #fff;
border-top:2px solid #eaeff2; 
border-left:2px solid #eaeff2;
border-right:1px solid #eaeff2;
border-bottom:1px solid #eaeff2;
/*width:878px;*/
width:500px;
height: 343px;
}


#home section div#ctg .Informationarea .left .twitterarea .wh-size{width:100%;}
#home section div#ctg .Informationarea .left .twitterarea .t-btn{padding: 0.2em; text-align: right;}
#home section div#ctg .Informationarea .left .twitterarea .t-btn a{color:#bea767;}

#home section div#ctg .Informationarea .placebtnarea{ width:1200px; margin-top: 140px;}
#home section div#ctg .Informationarea .placebtnarea a{ display: block; width:100%; height: 100px;
background-image: url(../images/place.png); 
background-position: center; 
background-repeat:  no-repeat; 
background-color: rgba(255,255,255,0.7);
background-size: 32.25%;
border: 1px solid #b39744;
text-indent: -90000px;
}
#home section div#ctg .Informationarea .placebtnarea a:hover{opacity: 0.5; filter: alpha(opacity=50); -ms-filter: "alpha(opacity=50)"; -khtml-opacity: 0.5; -moz-opacity: 0.5; transition-duration: 0.3s;}

/*---- Information use ---------------------------*/ 

body {
  -webkit-touch-callout:none; /* リンク長押しのポップアップを無効化 */
  -webkit-user-select:none; /*  テキスト長押しの選択ボックスを無効化 */
  -webkit-touch-callout: none;
}

/*---------------------------------------------------------------------------------
 /////////////////////////////////////////////////////////// HOME use ////////////
---------------------------------------------------------------------------------*/









/*-----------------------------------------------
	Layout (sp)
------------------------------------------------*/
@media screen and (max-width: 750px){
/*---------------------------------------------------------------------------------
  HOME use ///////////////////////////////////////////////////////////////////////
---------------------------------------------------------------------------------*/
/* header use ---------------------------*/
#home header { background: none; background-size: auto; min-width: auto; min-width: initial; width:100%; }
#home header div.main img{ width:100%; min-width: auto; min-width: initial; max-width: 750px; margin: 0 auto;}
/*header{max-height: 1235px; height: auto; padding-top: 165%;}*/
#home header div.top_date_place{ display: block; margin: -2% 0 0 0; width: 100%; max-width: 750px; min-width: auto; min-width: initial; padding-top: 0;}
#home header div.top_date_place .topdate{ display: block; width:100%; padding-right: 0; text-align: center;}
#home header div.top_date_place .topdate img{ width:88.133333%; max-width: 661px;}
#home header div.top_date_place .topplace{ display: block; width:100%; padding-left: 0; text-align: center;}
#home header div.top_date_place .topplace img{ width:40%; max-width: 300px; margin-top: 1.35em;}
/*---- header use ---------------------------*/

/* newsarea use ---------------------------*/         
#home section div#ctg .ttlarea{  margin: 3em 0 0.25em 0;}
#home section div#ctg .ttlarea p{ display: block; width: 18.266666%; margin: 0 auto; padding: 0 0; height: auto;}
#home section div#ctg .ttlarea p img{ width:100%;}
#home section div#ctg .newsarea{
max-width:750px; width:88.8%; margin: 0 auto; border:1px solid #b2943b; height: auto; position:static;}
#home section div#ctg .newsarea .copyarea{ 
display: block; vertical-align: middle; height: auto; width:100%;}
#home section div#ctg .newsarea .copyarea .sclbox{
overflow-y: scroll; height: 8.35em; max-width:750px; width:100%; padding: 0.45em 1em; box-sizing: border-box;}
#home section div#ctg .newsarea .copyarea .sclbox ul{ display: block; max-width:750px; width:100%; height: auto;}
#home section div#ctg .newsarea .copyarea .sclbox ul span{ display: block; width:100%; min-with:14em;}
#home section div#ctg .newsarea .copyarea .sclbox ul li a{ display: block; width:100%; text-decoration: underline; color: #000; margin-bottom: 0.45em;}
#home section div#ctg .newsarea .copyarea .sclbox ul li:last-child a{ margin-bottom: 0.45em;}
#home section div#ctg .newsarea .copyarea .sclbox ul a:hover{ opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; -khtml-opacity: 1; -moz-opacity: 1; transition-duration: 0s;}
/*---- newsarea use ---------------------------*/ 

/* bannerarea use ---------------------------*/     
#home section div#ctg .bannerarea{ max-width:750px; width:89.8%; margin:  2.6em auto 0 auto;}
#home section div#ctg .bannerarea a:hover{ opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; -khtml-opacity: 1; -moz-opacity: 1; transition-duration: 0s;}
#home section div#ctg .bannerarea .bnr-1p{ margin-top:0.6em;}
#home section div#ctg .bannerarea .bnr-2p{ margin-top:0.6em;}
#home section div#ctg .bannerarea .bnr-2p p.left{float:none; width:100%;}
#home section div#ctg .bannerarea .bnr-2p p.right{float:none; width:100%; margin-top:0.6em;}
#home section div#ctg .bannerarea img{ width:100%;}
/*---- bannerarea use ---------------------------*/ 

/* highlights use ---------------------------*/  
#home section .highlights{ background: url(../images/bg_02-sp.png) top center no-repeat; background-size:100%; min-height: auto; min-height:initial; min-width:initial; min-width:auto;}
#home section div#ctg .highlightsarea{ max-width:750px; width:100%; text-align: center; margin-top: 12%;}

#home section div#ctg .highlightsarea a:hover{ opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; -khtml-opacity: 1; -moz-opacity: 1; transition-duration: 0s;}

#home section div#ctg .highlightsarea .readcopy{ max-width:750px; width:100%; margin: 0 auto 0 auto; padding-top: 5%;}
#home section div#ctg .highlightsarea .readcopy img{ width:74.8%;}
#home section div#ctg .highlightsarea .readcopy .text{left: 3%; right: 3%; width: 94%; font-size: 4vw; text-align:left; padding-bottom:0px;}
#home section div#ctg .highlightsarea .readcopy .text .text_block{padding: 0 0 1em 0;}


#home section div#ctg .highlightsarea .highlights_slt{max-width:750px; width:100%; margin: 5% auto 0 auto; padding-top: 0; position: static;}

#home section div#ctg .highlightsarea .highlights_slt p.ttl{position: static; top:0; right:0;}
#home section div#ctg .highlightsarea .highlights_slt p.ttl img{ width:27.466666%;}

#home section div#ctg .highlightsarea .highlights_slt div.hl-main{ margin-top: 5%;}
#home section div#ctg .highlightsarea .highlights_slt div.hl-main a.hl04sp{ display: block; margin-top: -21%; z-index: 2;}
#home section div#ctg .highlightsarea .highlights_slt div.hl-main img{ width:100%;}

/*---- highlights use ---------------------------*/ 


/* Information use ---------------------------*/  
#home section .Information{ background: url(../images/bg_03-sp.png) center top no-repeat; min-height: auto; min-height:initial; min-width:initial; min-width:auto;background-size: 100%; padding-top: 14em; margin-top: -19%; }
@media screen and (max-width: 320px){
    #home section .Information{ padding-top: 10em;}
}


#home section div#ctg .Informationarea{ max-width:750px; width:89.8%; text-align: center; margin:0 auto;}

#home section div#ctg .Informationarea .left,
#home section div#ctg .Informationarea .right{ float: none; width:100%; text-align: center; margin: 0 0 1.5em 0;}

#home section div#ctg .Informationarea img{ width:44.5434298%; }

#home section div#ctg .Informationarea .left .twitterarea{ background: #fff;
width:100%; height: 275px; overflow-x: scroll;/*
width:320px; height: 212px; overflow-x: scroll;*/
}
#home section div#ctg .Informationarea .right .facebook{ background: #fff;
width:auto; height: 275px; overflow-x: scroll;/*
width:320px; height: 212px; overflow-x: scroll;*/
}
#home section div#ctg .Informationarea .left .twitterarea .wh-size{width:100%;}
#home section div#ctg .Informationarea .left .t-btn{padding: 0.2em; text-align: right;}
#home section div#ctg .Informationarea .left .t-btn a{color:#bea767;}


#home section div#ctg .Informationarea .placebtnarea{ max-width:750px; width:100%; margin: 5em auto 4em auto;}
#home section div#ctg .Informationarea .placebtnarea a{ display: block; width:100%; height: auto;
padding: 7% 0;
background-image: url(../images/place.png); 
background-position: center; 
background-repeat:  no-repeat; 
background-color: rgba(255,255,255,0.7);
background-size: 84.26626%;
border: 1px solid #b39744;
text-indent: -90000px;
}
#home section div#ctg .Informationarea .placebtnarea a:hover{opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; -khtml-opacity: 1; -moz-opacity: 1; transition-duration: 0s;}
/*---- Information use ---------------------------*/ 


/*---------------------------------------------------------------------------------
 /////////////////////////////////////////////////////////// HOME use ////////////
---------------------------------------------------------------------------------*/
}