@charset "utf-8";

/* CSS Document */

/************************************
						共 通 項 目
************************************/
body { background-color: #000; color: #FEFEFE;}

.read-more { height: 50px; display: flex; align-items: center; justify-content: center; position: relative; border-radius: 25px; border: solid 2px #DEAF42; color: #DEAF42; transition: .4s; background-color: transparent; outline: 0;}
.read-more:hover { background-color: #DEAF42; color: #FEFEFE;}
.read-more p {font-size: initial; font-weight: 700;}
.read-more a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px;}

/***********************************
						ヘ ッ ダ ー
***********************************/
.header {padding: 0.75rem 0; font-size: 0; display: flex; align-items: center; justify-content: space-between;}
.header img { width: 100%; }

.header .symbols { display: flex; align-items: center; justify-content: flex-start;  }
.header .symbols .logo {width: 9.0rem; }
.header .symbols .dealer { width: 17.0rem; padding:0 1.0rem;}

.header .sns_btn { display: flex; align-items: center; justify-content: flex-end; width: 20.0rem; }
	@media(min-width:992px){
		.header .symbols { width: 65%;}
        .header .symbols .logo {width: 11.0rem; }
		.header .sns_btn { width: 35%;}
	}
.header .sns_btn li { padding:0 0.25rem; }
.header .sns_btn li img { border-radius: 50%;}

.header .sns_btn li .acc { background-color: #FF5978;}
.header .sns_btn li .twt { background-color: #1DA1F2;}
.header .sns_btn li .fb { background-color: #1877F2;}
.header .sns_btn li .youtube { background-color: #FF0000;}
.header .sns_btn li .line { background-color: #00B900;}
.header .sns_btn li .x { background-color: #000000; border: solid 2px #333;}


/***********************************
					ナ ビ ゲ ー シ ョ ン
***********************************/
.navigation { width: 100%; margin: 0; padding: 0; background-color: #333; color: #CCC; position: relative; font-family: Verdana, "メイリオ" "sans-serif";}
.navigation .gnav { width: 100%; margin: 0; padding: 0; box-sizing: border-box; font-size: 0; }
.navigation .gnav li { width: 20%; margin: 0; padding: 0.5rem; display: inline-block; text-align: center; height: 4.0rem; font-size: 0.6rem;  transition: all 0.3s ease 0.25s;}
.navigation .gnav li a { color: #CCC;}
.navigation .gnav li:hover, .navigation .gnav li a:hover  { color:#DEAF42; cursor: pointer; }
.navigation .gnav li span { font-size: 0;}
.navigation .gnav li img { height: 70%; padding-bottom: 0.25rem; /*border-bottom: solid 2px #DEAF42;*/ }
.navigation .gnav li.blank { position: relative; }
.navigation .gnav li.blank > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; display: block; text-indent: -9999px;}
	
	@media(min-width:992px){
		.navigation .gnav li { font-size: 0.85rem; line-height: 1.5rem; height: 2.5rem; text-align: left; padding: 0.5rem 0;}
		.navigation .gnav li img { /*height: calc(100% - 1.0rem);*/ display:none;}
		.navigation .gnav li::before { content: ""; width: 2px; height:1.35rem; background-color:#DEAF42; vertical-align: middle; display: inline-block; margin-right: 0.75rem; border-radius: 1px;}
		.navigation .gnav li span {font-size: 0.85rem;}
		.navigation .gnav li > p { position: relative; display: inline;}
		.navigation .gnav li > p::after { position: absolute; top: 50%; right: -1.25rem; content: ""; transform: translateY(-40%); width: 0; height: 0; border-style: solid; border-width: 0.6rem 0.35rem 0 0.35rem; border-color: #CCC transparent transparent transparent; transition: all 0.3s ease 0.25s;}
		.navigation .gnav li.blank > p::after {border-width: 0.35rem 0 0.35rem 0.575rem; border-color: transparent transparent transparent #CCC;}
		.navigation .gnav li:hover > p::after {border-color: #DEAF42 transparent transparent transparent;}
		.navigation .gnav li.blank:hover > p::after {border-color: transparent transparent transparent #DEAF42;}
	}

.navigation .gnav li div.subnav { position: absolute; top: 4.0rem; left: 0; z-index: 99999; width: 100%; margin: 0 auto; padding: 2.0rem 0; background-color: #222; text-align: left; font-size: 1.0rem;}
	@media(min-width:992px){
		.navigation .gnav li div.subnav { top: 2.5rem; font-size: 0.85rem; font-weight: 500;}
	}
.navigation .gnav li div.subnav div.btn { text-align: center; padding: 0.5rem; color: #CCC; transition: 0.6s; position: relative;}
.navigation .gnav li div.subnav div.btn p { background: url("../img/nav/btnbg.jpg") center/cover repeat-y; border-radius: 0.5rem; line-height: 5.0rem; }
.navigation .gnav li div.subnav div.btn img { display: block; width: 100%; height: 100%; margin: auto; border: solid 0.1rem #222; transition: 0.6s; border-radius: 0.5rem;}
.navigation .gnav li div.subnav div.btn:hover { color:#DEAF42; }
.navigation .gnav li div.subnav div.btn:hover img { border: solid 0.1rem #DEAF42; }
.navigation .gnav li div.subnav div.btn a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; display: block; text-indent: -9999px;}


/*メニュー表示・非表示*/
.navigation .gnav li .subnav { display: none;}
	@media(min-width:992px){
		.navigation .gnav li .subnav { opacity:0; visibility:hidden; transition: all 0.05s ease 0.0s; display: inherit;}
		.navigation .gnav > li:hover .subnav { opacity:1.0; visibility:visible; transition: all 0.3s ease 0.25s; }
	}


/***********************************
					   お 知 ら せ
***********************************/
.osirase { padding-top: 1.0rem; padding-bottom: 1.0rem; }
.info { align-items: center; padding: 0.75rem; border: solid 1px #FEFEFE;}
.info div:first-child p { width: 100%; height: 100%; font-weight: 700; font-size: 1.2rem; display: flex; align-items: center; justify-content: center; margin-bottom: 0.5rem;}
.info div:last-child p { font-size: 0.8rem; font-weight: 500; } 
.info div:last-child p span { color: #FF0000;}
	@media(min-width:768px){
		.info { padding-left: 0; padding-right: 0;}
		.info div:first-child p {font-size: 1.6rem; margin-bottom: 0; }
		.info div:last-child p { font-size: 1.0rem; } 
	}

.info2 { display: flex; align-items: center;}
.info2 div:first-child p { font-size: 0.9rem; font-weight: 400;}
.info2 div:first-child p span { font-size: 1.2rem; font-weight: 700; color: #F8B62D;}

.info2 ul { margin: 0; padding: 0; width: 100%; height: 100%; display: flex; flex-wrap: wrap;}
.info2 ul li { display: flex; width: 100%;}
.info2 ul li p { width: 50%; border: solid 1px #000; font-size: 1.0rem; font-weight: 400; color: #FEFEFE; padding: 1.0rem; text-align: center;}
.info2 ul li p span { color: #F8B62D; font-weight: 500; }
.info2 ul li p:first-child { background-color: #333;}
.info2 ul li p:last-child { background-color: #444;}
	@media(min-width:992px){
		.info2 ul li { flex-direction: column; width: 25%;}
		.info2 ul li p { width: 100%; text-align: left; padding: 0.5rem;}
	}
    
.info3 h2 {border: solid 1px #F8B62D; text-align: center; color: #F8B62D; font-size: 1.4rem; line-height: 1.4rem; padding: 0.7rem 0; transition: .4s;}
.info3 h2:hover {opacity: 0.8;}

/***********************************
					    ス ラ イ ダ ー
***********************************/
.sld { margin: 1.0rem auto; padding:0; font-size:0.8rem; }




/***********************************
					   コ ン テ ン ツ
***********************************/
.content { padding-top: 2.0rem; padding-bottom: 2.0rem;}
h2 { font-weight:bold; font-size:1.2rem; color:#C9CACA; text-align:center; line-height:1.0em;  }
h2 span { font-size:0.7rem; }

/***トピックス***/
.topics { display: flex; flex-wrap: wrap; margin-top: 1.0rem; }
.topics li { width: 50%; margin: 0; padding:1.25rem 0.75rem; display: flex; flex-direction: column; position: relative;}
.topics li img { width: 100%; transition: 0.3s; min-height: 1px; height: auto;}
.topics li .caption { padding:0.5rem 0; font-size:0.8rem; font-weight:400; min-height:5.0rem; color: #FEFEFE; transition: 0.3s; }
.topics li .misc { display:block; margin-top: auto; padding-bottom:0.25rem; border-bottom: solid 1px #222;}
.topics li .date { font-size:0.8rem; font-weight:700; color:#999; padding-left: 0.25rem; float: left;}
.topics li .detail { color:#FF9E00 ; font-size:0.8rem; padding-right: 0.25rem; float: right;}
.topics li a { position:absolute; top:0; left:0; width:100%; height:100%; text-indent:-9999px; }
	@media(min-width:992px){
		.topics li { width: 33.33333333333%;}
	}
.topics li:hover .caption { color: #FF9E00;}
.topics li:hover img { opacity: 0.8;}


.bnr li { width: 50%; display: inline-block; padding: 0.25rem; box-sizing: border-box;}
.bnr li img { width: 100%; height: auto;}
	@media(min-width:992px){
		.bnr { margin-top: 2.25rem;}
		.bnr li { width: 100%; padding: 0; margin-bottom: 0.5rem;}
	}


/***********************************
					   店 舗 情 報
***********************************/
.shop { background-color: #333; padding: 0; color:#FEFEFE;}
.shop h3, #access h3 { font-weight:bold; background-color:#706EB2; text-indent: 1.0rem; font-size: 1.0rem; line-height: 1.4rem; border-radius: 0.7rem; margin-bottom: 0.25rem; }

.shop .shopinfo { margin-top:2.0rem; }
.shopinfo p, #access p { font-size:0.9rem; padding-left:1.0em; margin-bottom: 0.5rem; line-height: 1.4rem; }

.shopinfo p a { color:#FEFEFE; }
.shopinfo p a:hover { text-decoration:underline; }

.shopinfo a img { width: 100%; padding: 0.25rem;}
.shopinfo a img:hover { opacity:0.8; }

.shopinfo .timeline { font-size: 0px; height: calc(100% - 2.4rem); width: calc(100% - 1.0rem); margin: 0.5rem auto; /*background-color: #FFF;*/}
.shopinfo .timeline a, .shopinfo .timeline .twitter-timeline-rendered, .shopinfo .timeline iframe  { width: 100%; height: 100%!important;}

.slick2 li > p { position: relative; display: block; border: solid 1px #FFF;}
.slick2 li > p a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px;}
.slick2 li > p img { width: 100%; padding: 0.25rem;}
.slick2 li > p::hover {cursor: pointer;}

#access { background-color: #222; color: #FEFEFE;}
#access h4 { font-size: 1.2rem; font-weight: 400; padding-left: 1.0rem;}


#access .parking { color:#FF9E00; padding-left: 2.5rem; text-indent: -1.5rem; }
#access .tower { text-align: center;}
#access .tower img { width: 50%; max-width: 800px;}
    @media(min-width:576px){
        #access .tower img {width: 100%;}
    }
#access p a, #access p a:visited { color: #FEFEFE; border-bottom: dashed 1px #FEFEFE; transition: 0.4s;}
#access p a:hover {color:#09F;}