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

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

slide

 ----------------------------------------------*/
.slide_container {
	width: 100%;
	overflow: hidden;
	position:absolute;
	top:70px;
	background:#fff;
}
.slide_all {
	width: 1000px;
	margin: 0 auto;
	height: 400px;
	position: relative;
}
.slide_wrap {
	width:2000px;
	position: absolute;
	margin-left: -500px;
}
.slide_body {
	width: 100%;
}
.slide {
	width: 2000px;
	height:400px;
}
.slide img {
	width: 100%;
/*	vertical-align: bottom;*/
}

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

detailBox

 ----------------------------------------------*/
#detailBox {
	clear:both;
	width:100%;
	margin: auto;
}

/* ニュース
---------------------------------------------------- */
.newsBoxColor{
	background:#dedede;
}
#newsBox{
	width:800px;
	min-height: 200px;
	margin:auto;
	padding: 40px 0 60px 0;
	color:#2f2f2f;
}
#newsBox h3{
	margin-bottom:40px;
	text-align: center;
}
/* dl */
#newsBox dl {
	border-bottom:1px dotted #999;
	line-height:1.5;
	font-size: 14px;
	padding: 15px 0 15px 0;
}
/* dt */
#newsBox dl dt {
	width:125px;
	padding:0 15px 0 15px;
	display: block;
	float: left;
}
/* dd */
#newsBox dl dd {
	width: 675px;
	padding-right: 60px;
	display: block;
	float: left;
	font-weight: bold;
}
#newsBox dl dd {
	background-image: url(../images/newslist_arrow.png);
	background-repeat:no-repeat;
	background-size:12px 14px;
	background-position:right 16px center;
}
/* ニュース一覧ボタン */
#newsListBtn a{
	font-size: 15px;
	width: 210px;
	display: block;
	margin: 0 auto;
	border: 1px solid #222;
	margin-top: 40px;
	padding:16px;
	text-align: center;
	background-image: url(../images/newslistbtn_arrow.png);
	background-repeat:no-repeat;
	background-size:10px 16px;
	background-position:right 14px center;
}
#newsListBtn a:hover{
	background-color: #333;
	background-image: url(../images/newslistbtn_arrow_w.png);
	color:#fff;
}

/* コンセプト
---------------------------------------------------- */
.ConceptBoxBtn div{
	height:330px;
	padding:100px 0 40px;
	transition:1s;
	cursor:pointer;
}
.ConceptBoxBtn div p{
	text-align:center;
}
.ConceptBoxBtn div p>img {
	margin-bottom:40px;
}
ConceptBoxBtn div p img.animated {
	display:block;
}
.ConceptBoxBtn div:hover {
    opacity: 0.7;
    filter: alpha(opacity=80);
    transition:0.25s;
}
/*onclick*/
.ConceptBoxBtn div.active{
	height:330px;
	padding:100px 0 40px;
	opacity:0;
	visibility:hidden;
}
#ConceptBox{
	width:800px;
	height:1009px;
	margin:-330px auto 0;
	text-align:center;
	opacity:0;
	transition:2.25s;
	transition-delay:0.75s;
	padding: 75px 0;
	visibility: hidden;
	z-index:10;
}
/*onclick*/
#ConceptBox.active{
	opacity:1;
	width:800px;
	height:1009px;
	margin:-330px auto 0;
	padding: 75px 0;
	text-align:center;
	visibility:visible;
}
.ConceptBoxColor{
	background:#fff;
}
.mb45{
 margin-bottom:45px;
}

/* bnr
---------------------------------------------------- */
.bnrBoxColor{
	background:#fff;
}
#bnrBox{
	width:100%;
	margin:-679px 0 0;
/*	visibility: hidden;*/
}
#bnrBox.active {
	margin:0;
	transition:1s;
}
#bnrBox ul {
    overflow: hidden;
    width: 100%;
}
#bnrBox ul li {
	float:left;
	width:33.33%;
	height:auto;
	display:block;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
}
/*#bnrBox ul li {
	width:100%;
	height:auto;
	display:block;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
}*/
#bnrBox ul li a img {
    height: 100%;
    width: 100%;
}

/* i-dio phone
---------------------------------------------------- */
.phoneBoxColor{
	background:#fff;
}
#phoneBox{
	width:1000px;
	margin:auto;
	padding: 30px 0px 60px 0px;
	color:#2f2f2f;
	visibility: hidden;
	text-align:center;
}
#phoneBox ul {
	display:inline-block;
}
#phoneBox ul li {
	margin:0 4px 10px 0;
	display:inline-block;
	font-size:14px;
}
#phoneBox ul li span {
	border:1px #000000 solid;
	display: table-cell;
	vertical-align: middle;
	background: url(../images/iconwindow.gif);
	background-position:right 8px top 8px;
	background-repeat:no-repeat;
	height:60px;
}
#phoneBox ul li a {
	display: inline-block;
/*	width:186px;*/ /* 5 button */
	width:210px; /* 8 button */
}
#phoneBox ul li a small {
	font-size:10px;
}

/*soldout*/
#phoneBox ul li.soldout span {
	border:1px #000000 solid;
	display: table-cell;
	vertical-align: middle;
	height:60px;
	background:none;
}
#phoneBox ul li.soldout span {
	width:186px;
}

/* bnr2col
---------------------------------------------------- */
.bnr2colBoxColor{
	background:#f0f0f0;
}
#bnr2colBox{
	width:1000px;
	margin:auto;
	padding: 40px 0px;
	color:#2f2f2f;
	visibility: hidden;
	text-align:center;
}
.bnr480 {
	width:480px;
	height:auto;
	background:#FFF;
	float:left;
}
.bnr480 a>img {
	width:480px;
	height:auto;
	display:block;
}
.bnr480:first-child {
	margin-right:40px;
}
#bnr2colBox ul {
	background:#f0f0f0;
	width:460px;
	padding:10px 10px 5px;
	margin:0 auto 10px;
	text-align:left;
}
#bnr2colBox ul li {
	font-size:11px;
	float:left;
	margin-right:25px;
	margin-bottom:5px;
}
#bnr2colBox ul li a {
	color:#666;
}
#bnr2colBox a>img {
    width: 1000px;
    margin: auto;
    height: auto;
    display: block;
}
/* Wi-Fi
---------------------------------------------------- */
.wifiBoxColor{
	background:#fff;
	border-top:5px solid #2f2f2f;
}
#wifiBox{
	width:800px;
	margin:auto;
	padding: 30px 0px 30px 0px;
	color:#2f2f2f;
	visibility: hidden;
	text-align:center;
}

/* CONTENTS
---------------------------------------------------- */
.contentsBoxColor{
	background:#dedede;
	border-top:5px solid #2f2f2f;*/
}
#contentsBox{
	width:1000px;
	min-height: 200px;
	margin:auto;
	padding: 80px 0 0;
	color:#2f2f2f;
	text-align: center;
	visibility: hidden;
}
#contentsBox ul {
	margin:50px auto;
}
#contentsBox ul li a {
	width:230px;
	background:#000;
	float:left;
	color:#FFF;
	display:block;
	text-align:left;
	margin:0 10px 30px;
}
#contentsBox ul li a p.contents_line1 {
	padding:8px 8px 2px;
	font-size:11px;
}
#contentsBox ul li a p.contents_line1 span {
	background:#F00;
	padding:0 10px;
	margin-right:8px;
	font-size:9px;
}
#contentsBox ul li a p.contents_line1 time {
	color:#999;
	font-style:italic;
}
#contentsBox ul li a p.contents_line2 {
	padding:3px 8px 8px;
}

/* contact
---------------------------------------------------- */
.contactBoxColor{
	background:#fff;
	border-top:5px solid #2f2f2f;
}
#contactBox{
	width:800px;
	margin:auto;
	padding: 90px 0px;
	text-align:center;
}

/* APP
---------------------------------------------------- */
.appBoxColor{
	background:url(../images/app_bg.jpg) no-repeat top center;
	background-color:#232323;
/*	border-top:5px solid #2f2f2f;*/
}
#appBox{
	width:800px;
	min-height: 200px;
	margin:auto;
	padding: 80px 0;
	color:#fff;
	text-align: center;
	visibility: hidden;
}
#appBox h3{
	margin-bottom:60px;
	text-align: center;
}
#app_info_main {
	width:100%;
	background:#232323;
	padding:20px 0 40px;
	color:#FFF;
	text-align:center;
}

/* app_summary */
#app_summary {
	width:800px;
	margin:10px auto 35px;
	text-align:left;
}
#app_summary h4 {
	font-size:14px;
	font-weight:normal;
	text-align:center;
	margin-bottom:6px;
}
#app_summary>div{
	width:400px;
	border:1px solid #4C4C4C;
	border-radius:5px;
	margin:0 auto;
	padding:8px 20px 8px 18px;
}
#app_summary>div img {
	display:block;
	margin-right:15px;
	float:left;
}
#app_summary>div>div {
	float:left;
}
#app_summary>div p {
	font-size:18px;
	font-weight:bold;
	line-height:50px;
	display:inline-block;
	margin:7px 0px;
}
#app_summary>div small {
	font-size:12px;
	line-height:15px;
	display: inline-block;
	border:1px solid #FFF;
	border-radius:15px;
	padding:3px 12px;
	margin-left:6px;
	vertical-align: text-bottom;
}

/* app_mode */
#app_mode {
	width:800px;
	margin:0 auto 50px;
}
#app_mode h4 {
	font-size:24px;
	font-weight:normal;
	margin-bottom:25px;
}
#app_mode h4 span {
	color:#5bc4e7;
}

/* app_mode_detail */
.app_mode_detail {
	width:399px;
/*	border-top:1px solid #444444;*/
	margin:0 auto;
	padding:5px 20px;
	float:left;
}
.app_mode_detail_fast {
	border-right:1px solid #444;
}
.app_mode_detail h5 {
	font-size:24px;
	font-weight:normal;
	margin-bottom:20px;
}
.app_mode_detail img {
	margin-bottom:20px;
}
.app_mode_detail .app_mode_txt1 {
	color:#5bc4e7;
	font-size:20px;
	margin-bottom:20px;
}
.app_mode_detail .app_mode_txt2 {
	font-size:12px;
	margin-bottom:10px;
}
.app_mode_detail ul li {
	font-size:9px;
}
.app_mode_detail ul li::before {
	display:inline-block;
	content: url(../images/icon_att.png);
	-webkit-transform: scale(0.5);
	-moz-transform: scale(0.5);
	transform: scale(0.5);
	margin-left: 3px;
	position: relative;
	top:4px;
}

/* リンク
---------------------------------------------------- */
.linkBoxColor{
	background:#fff;
/*	border-top:5px solid #2f2f2f;*/
}
#linkBox{
	width:1000px;
	margin:auto;
	padding: 100px 0;
	color:#2f2f2f;
	visibility: hidden;
}
#linkBox h3{
	margin-bottom:75px;
	text-align: center;
}
#linkBox .linkDetail{
	width:1000px;
	margin:50px auto 0px auto;
}
#linkBox .linkDetail01{
	width:1000px;
	margin:0px auto;
}
.link01 img,
.link02 img,
.link03 img,
.link04 img,
.link05 img{
	margin-bottom:10px;
}
.link01,
.link02,
.link03,
.link04,
.link05{
	width:200px;
	height:160px;
	font-size: 77%;
	float:left;
	text-align: center;
	position: relative;
	border-right: 1px dotted #ccc;
}
.link01{
	border-left: 1px dotted #ccc;
}
.link01 a,
.link02 a,
.link03 a,
.link04 a,
.link05 a{
	display:block;
	width:100%;
	height:100%;
	position: absolute;
	top:0;
	left:0;
	text-indent: -9999px;
}
.viewBtn{
	margin-top: 35px;
}
.link01:hover,
.link02:hover,
.link03:hover,
.link04:hover,
.link05:hover{
	opacity: 0.5;
}

/* 20170206 v-alert banner */
.bnr_valert_top {
    width: 100%;
    min-width: 1000px;
    overflow: hidden;
}
.bnr_valert_top_image {
    position: relative;
    left: 50%; /* 画像の左端が画面中央にくる */
    margin-left: -700px; /* 画像幅1600pxの半分だけ左に移動する */
}