@charset "utf-8";

/*
 * Site Name: connetta WEB Smart5
 * File Name homecss
 * Description: index.php Style
 * Version: 1.0
 * Author: DIS_ART_WORKS
 */




/*
layout
----------------------------------------- */
#home #header_wrapper{
	z-index: 10;
}

#home #header{
	display: block;
}

#home #header #header_top_right{
	padding: 0;
}

#home #header #site_lead {
}

#home #navs{
	margin-bottom: 16px;
	position: static;
}

#home #navs.fixed{
	position: fixed;
	z-index: 10000000;
}

#home #main_element {
	max-width: 100%;
	margin: 0 auto;
}

#home #home_main_button_wrapper{
	overflow: hidden;
}

#home #home_main_button{
	margin: 0 auto;
}

#home #home_main_button p{
	text-align: center;
	margin: 0 auto;
	padding: 32px 0;
	line-height: 0;
}

#home #home_main_button > div{
	padding: 24px;
	background: #efefef;
	width: 47%;
    box-sizing: border-box;
}

#home #home_main_button > div img{
	float: left;
	margin-right: 24px;
}

#home #home_main_button .left{
	float: left;
}

#home #home_main_button .right{
	float: right;
}

#home #home_main_button > div ul li{
	line-height: 1.68;
}

#home #home_main_button > div ul li a{
	font-size: 80%;
	color: #333;
}

#home #home_main_button > div ul li a:before{
	content: url(../images/home/arrow_mainbtn.png);
    position: relative;
    top: 0px;
    margin-right: 4px;
}

#home #main_column{
	float: left;
	width: 63.25%;
	padding: 0;
	margin: 40px 0 0;
	border: none;
	background: none;
}

#home #side_column{
	float: right;
	padding-top: 0;
	margin: 40px 0 0;
	width: 33.334% !important;
    position: static !important;
    bottom: auto !important;
}

#home #side_column #menu{
	display: none;
}

#home #fix_wrap{
    position: static !important;
}

#home #fix_wrap.fixed {
    position: static;
}

#home #side_banner{
	display: none;
}

#home .side_banner_add{
	display: block;
}

#home #side_menu_ex{
	display: none;
}

#home #side_sns_ex{
	display: none;
}

#home_topics_wrapper{
	clear: both;
}

#home_topics_wrapper h2{
	background: none;
}


/*
main_images
----------------------------------------- */
#home #mainElement {
	text-align: center;
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 1;
}

#main_images{
	vertical-align: middle;
	text-align: center;
	overflow: hidden;
	width: 100%;
	max-width: 100%;
	position: relative;
	background: url(../images/home/mainimage_back.jpg) repeat-x center bottom;
}

#main_images > div{
	width: 1200px;
	position: relative;
	margin: 0 auto;
}

#main_images img{
	position: relative;
	width: 1200px;
}

#mainImages{
	display: none;
}

#main_images_container{
	background: #333;
	background: url(../images/home/mainimage_back.jpg) no-repeat center center;
	background-size: cover;
}

#main_images_wrapper{
	width: 1200px;
	margin: 0 auto;
    position: relative;
	overflow: hidden;
	height: 335px;
}

/*
pick_up
----------------------------------------- */
#pick_up{
	float: left;
    width: 600px;
	padding: 0;
	color: #fff;
	text-align: left;
	height: 335px;
	overflow: hidden;
}

#pick_up > li{
	padding: 0;
	overflow: hidden;
}

#pick_up .slick-dots{
    bottom: 0;
}

#pick_up .slick-dots li button:before{
	color: #fff;
	opacity: 1;
	z-index: 90000;
}

#pick_up .slick-dots li.slick-active button:before{
	color: #fff;
	opacity: 1;
	z-index: 90000;
}




#pick_up .slick-slide{
	margin: 0 !important;
	height: 335px !important;
}

#pick_up ul.slick-dots li {
	width: 20px;
	margin: 0 4px;
}

#pick_up ul.slick-dots{
	height: auto;
}
#pick_up .slick-dots li button:before
{
    font-family: 'slick';
    line-height: 20px;

    position: absolute;
    bottom: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '●';
    text-align: center;
		font-size: 9px;

    opacity: 1;
    color: #fff;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
		z-index: 9999999;
}

#pick_up .slick-dots li button:before
{
    font-family: 'slick';
    line-height: 20px;

    position: absolute;
    bottom: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '●';
    text-align: center;
		font-size: 10px;

    opacity: 1;
    color: #909090;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
		z-index: #;
}




#pick_up .slick-dots li.slick-active button:before
{

    color: #fffea2;
		font-size: 11px;
}






#pick_up li a{
	color: #fff;
    display: block;
}

#pick_up li a:hover{
	text-decoration: none;
	opacity: 0.8;
}

#pick_up li:not(.cnt) .img img{
    max-width: 100%;
    max-height: 335px;
	margin: 0 auto;
}

#pick_up li.cnt .img{
	float: left;
	padding: 32px 0px 32px 32px;
}

#pick_up li.cnt img{
	width: 100%;
    max-height: 271px;
    max-width: 181px;
}

#pick_up li.cnt .img + ul{
	padding: 32px 32px 32px 16px;
}

#pick_up ul{
	overflow-y: auto;
	height: 335px;
}

#pick_up ul li.title{
    font-size: 136%;
    font-weight: bold;
    line-height: 1.4;
}

#pick_up ul li.ticket_date{
	font-size: 88%;
}


#pick_up ul li.event_date{
	/*font-size: 108%;*/
	font-size: 85%;
	padding: 0.75em 0 0.5em;
}

#pick_up ul li.time,
#pick_up ul li.facility,
#pick_up ul li.price{
	font-size: 80%;
}

#pick_up ul li.detail{
    margin: 8px 0;
}

#pick_up ul li.detail span{
	display: block;
	font-size: 88%;
    padding: 0px;
	width: 132px;
	max-width: 100%;
    background: #f4f4f4;
    color: #333;
    text-decoration: none;
    font-weight: bold;
	text-align: center;
}

#pick_up ul li.detail span:hover{
	opacity: 0.8;
}


/*
event_today
----------------------------------------- */
#event_today {
	float: right;
  width: 320px;

  color: #fff;
  font-size: 88%;
	padding: 32px;
	text-align: left;
	overflow-y: auto;
	height: 335px;
}

#event_today.event_today{
	  background: rgba(0, 0, 0, 0.7);
}

#event_today.offday{
	display: inline-block;
	position: relative;
	vertical-align: middle;
}


#event_today.summarys{
	background: none;
	width: 380px;
}

#event_today .title {
    text-align: center;
	font-size: 104%;
    margin-bottom: 8px;
}

#event_today.offday .title {
	position: relative;
	top: 45%;
}

#event_today ul li{
	border-top: 1px solid #ccc;
	padding: 8px 0;
}

#event_today ul li:first-child{
	border-top: none;
}

#event_today ul li span.content{
	padding-left: 1em;
	display: inline-block;
}

#event_today ul li a{
    color: #fff;
}

#event_today ul li a .date{
	display: block;
}

#event_today ul li a .cont{
	display: block;
}

/*
recommend_event_wrapper
----------------------------------------- */
#recommend_event_wrapper{
	text-align: center;
	padding: 24px 0;
	overflow: hidden;
	background: #f5f2e9 url(../images/home/back_recommend.png) no-repeat center top;
    background-size: contain;
}

#recommend_event_wrapper h2{
    color: #fff !important;
    margin: 0 0 20px !important;
    font-size: 1.5em !important;
}

#recommend_event_wrapper ul{
	width: 1200px;
	max-width: 1200px;
	margin: 0 auto;
	text-align: center;
}

#recommend_event_wrapper ul li{
	display: inline;
}

#recommend_event_wrapper ul li a{
	display: block;
	/*float: left;*/
    padding: 0;
/*
	width: 14%;
    margin: 0 0 0 3.2%;
    font-size: 13px;
*/
    font-size: 82%;
    color: #fff;
    font-weight: bold;
	text-decoration: none;
}

#recommend_event_wrapper ul li:first-child a{
    margin: 0;
}

#recommend_event_wrapper ul li a .img_wrap{
	height: 208px;
	position: relative;
}

#recommend_event_wrapper ul li a .img_wrap span{
	background-repeat: no-repeat;
    display: block;
	width: 152px;
    height: 208px;
    background-size: contain;
    background-position: top center;
    margin: 0 auto;
    position: relative;
}

#recommend_event_wrapper ul li .img_wrap span:before{
	content: "";
	width: 72px;
	height: 72px;
	position: absolute;
	top: 0;
	left: 0;
}

#pick_up li .img span{
	position: relative;
    display: block;
}

#pick_up li .img span:before{
	content: "";
	width: 80px;
	height: 80px;
	position: absolute;
	top: 0;
	left: 0;
}

#pick_up li .img span.flg_be_held:before,
#recommend_event_wrapper ul li.flg_be_held .img_wrap span:before{
	background: url(../images/status/flg_be_held.png) no-repeat;
	background-size: cover;
}

#pick_up li .img span.flg_coming_soon:before,
#recommend_event_wrapper ul li.flg_coming_soon .img_wrap span:before{
	background: url(../images/status/flg_coming_soon.png) no-repeat;
	background-size: cover;
}

#pick_up li .img span.flg_early_booking:before,
#recommend_event_wrapper ul li.flg_early_booking .img_wrap span:before{
	background: url(../images/status/flg_early_booking.png) no-repeat;
	background-size: cover;
}

#pick_up li .img span.flg_free:before,
#recommend_event_wrapper ul li.flg_free .img_wrap span:before{
	background: url(../images/status/flg_free.png) no-repeat;
	background-size: cover;
}

#pick_up li .img span.flg_new:before,
#recommend_event_wrapper ul li.flg_new .img_wrap span:before{
	background: url(../images/status/flg_new.png) no-repeat;
	background-size: cover;
}

#pick_up li .img span.flg_now_on_sale:before,
#recommend_event_wrapper ul li.flg_now_on_sale .img_wrap span:before{
	background: url(../images/status/flg_now_on_sale.png) no-repeat;
	background-size: cover;
}

#pick_up li .img span.flg_only_a_few:before,
#recommend_event_wrapper ul li.flg_only_a_few .img_wrap span:before{
	background: url(../images/status/flg_only_a_few.png) no-repeat;
	background-size: cover;
}

#pick_up li .img span.flg_today_released:before,
#recommend_event_wrapper ul li.flg_today_released .img_wrap span:before{
	background: url(../images/status/flg_today_released.png) no-repeat;
	background-size: cover;
}

#pick_up li .img span.soldout:before,
#recommend_event_wrapper ul li.soldout .img_wrap span:before{
    content: "";
    width: 100%;
    height: 160px;
    position: absolute;
    top: 72px;
    left: 0;
    background: url(../images/status/soldout.png) no-repeat;
    background-size: contain;
}

#recommend_event_wrapper ul li a img{
    margin: 0 auto;
	max-height: 208px;
}

#recommend_event_wrapper ul li a span.cat{
	display: inline-block;
    border-radius: 4px;
	margin: 12px 0 8px;
	padding: 2px 6px;
}

#recommend_event_wrapper ul li a span.title{
	display: block;
	color: #333;
}

#recommend_event_wrapper ul li a span.detail{
	display: block;
	color: #333;
	font-size: 92%;
}

/*
button_large_wrapper
----------------------------------------- */
#button_large_wrapper{
	background: url(../common/background02.jpg) repeat;
	padding: 40px 0;
}

#button_large_wrapper ul{
	width: 1200px;
	margin: 0 auto;
	text-align: center;
}

#button_large_wrapper ul li{
	display: inline;
}

#button_large_wrapper ul li a{
	display: inline-block;
    padding: 16px;
    width: 272px;
    margin: 0 24px;
    font-size: 120%;
    color: #fff;
    font-weight: bold;
    background: #fa9205;
    border-radius: 8px;
	text-decoration: none;
}

#button_large_wrapper ul li:nth-child(1) a:after{
    content: url(../common/icon_search.png);
    margin-left: 0px;
    position: relative;
    top: 4px;
}

#button_large_wrapper ul li:nth-child(2) a:after,
#button_large_wrapper ul li:nth-child(3) a:after{
    content: url(../common/icon_external_large.png);
    margin-left: 8px;
    position: relative;
    top: 0;
}

#button_large_wrapper ul li a:hover{
	opacity: 0.8;
}

#button_large_wrapper ul li a{
	font-size: 18px;
}

/*
button_middle_wrapper
----------------------------------------- */
#button_middle_wrapper{
	background: #f5f2e9;
	padding: 40px 0;
}

#button_middle_wrapper ul{
	width: 1200px;
	margin: 0 auto;
	text-align: center;
}

#button_middle_wrapper ul li{
	display: inline;
}

#button_middle_wrapper ul li a{
    display: inline-block;
    padding: 14px;
    width: 168px;
    margin: 0 8px;
    font-size: 112%;
    color: #fff;
    font-weight: bold;
    background: #3c352d;
    border-radius: 8px;
	text-decoration: none;
}

#button_middle_wrapper ul li a:hover{
	opacity: 0.8;
}

#button_middle_wrapper ul li:nth-child(1) a:before{
    content: url(../common/icon_shisetsu.png);
    margin-right: 4px;
    position: relative;
    top: 0;
}

#button_middle_wrapper ul li:nth-child(2) a:before{
    content: url(../common/icon_access.png);
    margin-right: 4px;
    position: relative;
    top: 0;
}

#button_middle_wrapper ul li:nth-child(3) a:before{
    content: url(../common/icon_event_guide.png);
    margin-right: 4px;
    position: relative;
    top: 0;
}

/*
buttons
----------------------------------------- */
#home ul#buttons,
#home ul#buttons_str{
	clear: both;
	width: 100%;
	list-style: none;
	margin: 0;
}

#home ul#buttons li,
#home ul#buttons_str li{
	float: left;
	list-style: none;
	vertical-align: top;
	text-align: center;
}

#home ul#buttons2 li img,
#home ul#buttons_str li img{
	min-width: 100%;
	margin: 0 auto;
}

#home ul#buttons2 li span.title,
#home ul#buttons_str li span.title{
	display: block;
	height: 2.8em;
	background-color: #172A88;
	color: #fff;
	font-weight: normal;
	text-align: center;
	padding-top: 0.5em;
	line-height: 1;
}

#home ul#buttons2 li span.strings,
#home ul#buttons_str li span.strings{
	display: block;
	background-color: #cbdae6;
	color: #172A88;
	font-weight: normal;
	text-align: left;
	padding: 1em;
	line-height: 1.2;
	height: 100%;

}

#home ul.buttons2 li{
	width: 48.3%;
	margin-left: 3.4%;
	background: #fff;
}

#home ul.buttons3 li{
	width: 30%;
	margin-left: 5%;
}

#home ul.buttons4 li{
	width: 24.2%;
	margin-left: 1%;
}

#home ul.buttons8 li{
	width: 23.75%;
	margin-left: 1.666%;
	margin-bottom: 18px;
}

#home ul#buttons li:first-child,
#home ul#buttons_str li:first-child{
	margin-left: 0;
}

#home ul.buttons8 li:nth-child(4n+1){
	margin-left: 0;
}

#home ul#buttons li a:hover img,
#home ul#buttons_str li a:hover img{
	opacity:0.8;
}

/*
side_banner_ex
----------------------------------------- */
#home #side_banner_ex{
	display: block;
	max-width: 400px;
}

/*
HEADLINE NEWS & NEWS
----------------------------------------- */
#home h2{
    border-bottom: none;
    padding: 16px 40px 12px;
    border-top: none;
    margin: 0;
	background: none !important;
    color: #333;
}

#home #headnews_wrapper,
#home #news_wrapper,
#home #event_wrapper{
	width: 100%;
}

#headnews_wrapper h2{
	border-left: none;
    padding: 0px 0px 0px;
    margin-bottom: 0;
	font-size: 1.75em;
}

#news_wrapper h2,
#event_wrapper h2{
	border-left: none;
    padding: 24px 0px 0px;
    margin-bottom: 0;
	font-size: 1.75em;
}

#headnews_wrapper h2:before,
#news_wrapper h2:before,
#event_wrapper h2:before{
    border-left: none;
}

#headnews_wrapper h2 a#list_of_news,
#news_wrapper h2 a#list_of_news,
#event_wrapper h2 a#list_of_event{
    display: block;
    font-size: 52%;
    color: #333;
    position: absolute;
    font-weight: normal;
    top: 40px;
    right: 0;
	padding-right: 20px;
}

#headnews_wrapper h2 a#list_of_news:hover,
#news_wrapper h2 a#list_of_news:hover,
#event_wrapper h2 a#list_of_event:hover{
	text-decoration: none;
	opacity: 0.8;
}

#headnews_wrapper h2 a#list_of_news:after,
#news_wrapper h2 a#list_of_news:after,
#event_wrapper h2 a#list_of_event:after{
	content: '';
	width: 5px;
	height: 5px;
	border: 0px;
	border-top: solid 1px #8b2926;
	border-right: solid 1px #8b2926;
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -4px;
}

#headnews_wrapper .topicses,
#news_wrapper .topicses,
#event_wrapper .topicses{
	padding: 8px 0px;
}

#headnews_wrapper li a,
#news_wrapper li a,
#event_wrapper li a{
	display: block;
	padding: 8px 0;
	border-top: 1px dotted #ccc;
}

#headnews_wrapper li a:hover,
#news_wrapper li a:hover,
#event_wrapper li a:hover{
	background: #f4f4f4;
	text-decoration: none;
}

#headnews_wrapper li:first-child a,
#news_wrapper li:first-child a,
#event_wrapper li:first-child a{
	border-top: none;
}

#headnews_wrapper li a .date,
#news_wrapper li a .date,
#event_wrapper li a .date{
	display: block;
	color: #333;

    width: 10em;
    float: left;
}

#headnews_wrapper li a .wrap img,
#news_wrapper li a .wrap img,
#event_wrapper li a .wrap img{
	height: 15px;
	vertical-align: -2px;
}

/*
NEWS
----------------------------------------- */
#home #news_wrapper{
	float: left;
}

/*
#news_wrapper h2:before{
	content: url(../images/home/icon_news.png);
	top: 0;
}
*/

/*
EVENT
----------------------------------------- */
#home #event_wrapper{
	float: right;
}

#event_wrapper h2:before{
	content: url(../images/home/icon_event.png);
	top: 0px;
}

#home #side_top_twitter {
	display: block;
}




#home h2 {
border-bottom: none;
padding: 16px 40px 12px;
border-top: none;
margin: 0 0;
background: none;
color: #333;

}

#main_image {
    /*margin-top: 0;*/
}