
body {
	padding-top: 0;
}

@media screen and (max-width: 767px)
{
	#index-header:before {
		opacity: 0;
		-webkit-transform: translate(0,-16px);
		transform: translate(0,-16px);
		-webkit-transition: .2s;
		transition: .2s;
		-webkit-transition-delay: .45s;
		transition-delay: .45s;
	}
	#index-header.open:before {
		opacity: 1;
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
	}

	#index-header #sp-nav-logo {
		pointer-events: none;
		opacity: 0;
		-webkit-transform: translate(0,-16px);
		transform: translate(0,-16px);
		-webkit-transition: .2s;
		transition: .2s;
		-webkit-transition-delay: .45s;
		transition-delay: .45s;
	}
	#index-header.open #sp-nav-logo {
		pointer-events: auto;
		opacity: 1;
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
	}
}

@media screen and (min-width: 768px)
{
	#index-header {
		position: absolute;
		height: auto;
		top: 42px;
	}
	#index-header:before {
		display: none;
	}
	#index-header #sp-nav-logo {
		display: none;
	}

	#index-header #gnav {
		position: relative;
		width: auto;
		padding: 0 60px;

		display: flex;
		justify-content: space-between;
	}
	#index-header #gnav a {
		display: inline-block;
		position: relative;
	}
	#index-header #gnav a:before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		margin: 0 auto;
		display: block;
		height: 100%;
		width: 100%;
		background-color: #000;
		z-index: -1;
		opacity: 0;
		transform: scale(1.05);
		transition: .4s;
	}
	#index-header #gnav a:hover:before {
		transform: scale(1);
		opacity: 1;
	}

	#index-header #gnav-main,
	#index-header #gnav-sub {
		display: flex;
		flex-direction: column;
		-webkit-writing-mode: vertical-rl;
		writing-mode: vertical-rl;
		text-orientation: upright;
		font-feature-settings: normal;
	}
	#index-header #gnav-main li,
	#index-header #gnav-sub li {
		border-top: none;
		background-color: rgba(0,0,0,0);
	}
	#index-header #gnav-main li {
		margin: 0 2px;
		font-size: 16px; font-size: 1.6rem;
		line-height: 24px; line-height: 2.4rem;
	}
	#index-header #gnav-main li a {
		padding: 10px;
	}
	#index-header #gnav-sub li {
		margin: 0 2px;
		font-size: 13px; font-size: 1.3rem;
		letter-spacing: 150%;
		line-height: 21px; line-height: 2.1rem;
	}
	#index-header #gnav-sub li a {
		padding: 10px 6px;
	}
}



#main {
	padding-top: 0;
}
@media screen and (min-width: 768px)
{
	#main {
		padding-top: 0;
	}
}




#mv {
	background-color: #000;
	position: relative;
	margin-bottom: 22px;
}
#slider {
	position: relative;
	z-index: 1;
}
#mv,
#slider,
.slide {
	width: 100%;
	height: 550px; height: 100vh;
	min-height: 320px;
	max-height: 960px;
}
.slide {
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
}
#slide-01 {
	background-image: url(../img/home/slide-01-sp.jpg);
}
#slide-02 {
	background-image: url(../img/home/slide-02-sp.jpg);
}
#slide-03 {
	background-image: url(../img/home/slide-03-sp.jpg);
}
#slide-04 {
	background-image: url(../img/home/slide-04-sp.jpg);
}
#slide-05 {
	background-image: url(../img/home/slide-05-sp.jpg);
}
#slide-06 {
	background-image: url(../img/home/slide-02-sp.spring.jpg);
}
#slide-07 {
	background-image: url(../img/home/slide-03-sp.spring.jpg);
}
#slide-08 {
	background-image: url(../img/home/slide-08-sp.jpg);
}
#slide-09 {
	background-image: url(../img/home/slide-09-sp.jpg);
}

#mv-logo {
	width: 102px;
	height: 247px;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	z-index: 2;
}

/* slick dots */

.slick-dots {
	position: absolute;
	right: 20px;
	bottom: 20px;
	display: flex;
	justify-content: flex-end;
}
.slick-dots li {
	position: relative;
    width: 6px;
    height: 6px;
    padding: 0;
    cursor: pointer;
	margin: 0 4px;
}
.slick-dots li button {
	font-size: 0;
	line-height: 0;
	display: block;
	width: 10px;
	height: 10px;
	padding: 0px;
	cursor: pointer;
	color: transparent;
	border: 0;
	outline: none;
	background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus {
	outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
	opacity: 1;
}
.slick-dots li button:before {
	content: "";
	display: block;
	width: 6px;
	height: 6px;
	background-color: rgba(255,255,255,0.3);
	border-radius: 6px;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-transition: .2s;
	transition: .2s;
}
.slick-dots li.slick-active button:before {
	background-color: rgba(255,255,255,1);
}

@media screen and (min-width: 768px)
{
	#mv {
		margin-bottom: 56px;
	}
	#mv,
	#slider,
	.slide {
		height: 900px; height: 100vh;
		min-height: 480px;
		max-height: 1440px;
	}
	#slide-01 {
		background-image: url(../img/home/slide-01.jpg);
	}
	#slide-02 {
		background-image: url(../img/home/slide-02.jpg);
	}
	#slide-03 {
		background-image: url(../img/home/slide-03.jpg);
	}
    #slide-04 {
        background-image: url(../img/home/slide-04.jpg);
    }
    #slide-05 {
        background-image: url(../img/home/slide-05.jpg);
    }
    #slide-06 {
        background-image: url(../img/home/slide-02.spring.jpg);
    }
    #slide-07 {
        background-image: url(../img/home/slide-03.spring.jpg);
    }
    #slide-08 {
        background-image: url(../img/home/slide-08.jpg);
    }
    #slide-09 {
        background-image: url(../img/home/slide-09.jpg);
    }

	#mv-logo {
		width: 124px;
		height: 300px;
	}

	.slick-dots {
		right: 40px;
		bottom: 44px;
	}
	.slick-dots li {
		width: 8px;
		height: 8px;
		margin: 0 5px;
	}
	.slick-dots li button:before {
		width: 8px;
		height: 8px;
		border-radius: 8px;
	}
}





#news {
}
#news-list {
	margin-top: -12px;
}
#news-list li {
	display: flex;
	border-bottom: solid 1px #d8d8d8;
	padding: 6px;
}
#news-list li > span {
	line-height: 18px; line-height: 1.8rem;
	white-space: nowrap;
}
#news-list li .news-update {
	font-size: 10px; font-size: 1.0rem;
	color: #a2804a;
	padding-right: 20px;
}
#news-list li .news-title {
	font-size: 12px; font-size: 1.2rem;
	letter-spacing: 1px; letter-spacing: 0.1rem;
	overflow: hidden;
	text-overflow: ellipsis;
}
#news-list li .news-title a {
	color: #333333;
	text-decoration: none;
}
#news-list li .news-title a:hover {
	color: #000;
}

#news-more {
	font-size: 10px; font-size: 1.0rem;
	line-height: 16px; line-height: 1.6rem;
	text-align: right;
	margin-top: 8px;
}
#news-more a {
	color: #333;
	text-decoration: none;
}
#news-more a:hover {
	color: #000;
}

@media screen and (min-width: 768px)
{
	#news {
	}
	#news-list {
		margin-top: -18px;
	}
	#news-list li {
		padding: 16px 18px;
	}
	#news-list li > span {
		line-height: 28px; line-height: 2.8rem;
	}
	#news-list li .news-update {
		font-size: 14px; font-size: 1.4rem;
		padding-right: 76px;
	}
	#news-list li .news-title {
		font-size: 16px; font-size: 1.6rem;
		letter-spacing: 1px; letter-spacing: 0.1rem;
	}

	#news-more {
		font-size: 13px; font-size: 1.3rem;
		line-height: 18px; line-height: 1.8rem;
		margin-top: 18px;
	}
}






#hotel-list {
	display: flex;
	flex-wrap: wrap;
	background-color: #333333;
}
#hotel-list li {
	width: 50%;
	height: 100px; height: 26.666vw;
	background-color: #d8d9d9;
}
#hotel-list li a {
	display: flex;
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	text-align: center;
	text-decoration: none;
	align-items: center;
	justify-content: center;
}
#hotel-list li a:before,
#hotel-list li a:after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	-webkit-transition: .2s;
	transition: .2s;
}
#hotel-list li a:before {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	-webkit-transform-origin: center;
	transform-origin: center;
}
#hotel-list li a:hover:before {
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}
#hotel-list li a:after {
	background-color: rgba(0,0,0,0.3);
}
#hotel-list li a:hover:after {
	background-color: rgba(0,0,0,0.6);
}
#hotel-list li a {
	display: flex;
	align-items: center;
	justify-content: center;
}
#hotel-list li .hotel-name {
	position: relative;
	z-index: 2;
	color: #fff;
	font-size: 13px; font-size: 1.3rem;
	line-height: 15px; line-height: 1.5rem;
	letter-spacing: 1px;
}

#hotel-soho:before {
	background-image: url(../img/home/hotel-soho-sp.jpg);
}
#hotel-daichu:before {
	background-image: url(../img/home/hotel-daichu-sp.jpg);
}
#hotel-momonohana:before {
	background-image: url(../img/home/hotel-momonohana-sp.jpg);
}
#hotel-sanjiro:before {
	background-image: url(../img/home/hotel-sanjiro-sp.jpg);
}
#hotel-daikon:before {
	background-image: url(../img/home/hotel-daikon-sp.jpg);
}
#hotel-yutomori:before {
	background-image: url(../img/home/hotel-yutomori-sp.jpg);
}
#hotel-yutomori:before {
	background-image: url(../img/home/hotel-yutomori-sp.jpg);
}
#hotel-zaoroyal:before {
	background-image: url(../img/home/hotel-zaoroyal-sp.jpg);
}
#hotel-genbei:before {
	background-image: url(../img/home/hotel-genbei-sp.jpg);
}
#hotel-tamaya:before {
	background-image: url(../img/home/hotel-tamaya-sp.jpg);
}
#hotel-adumaya:before {
	background-image: url(../img/home/hotel-adumaya-sp.jpg);
}
#hotel-sansatei:before {
	background-image: url(../img/home/hotel-sansatei-sp.jpg);
}
#hotel-genkiso:before {
	background-image: url(../img/home/hotel-genkiso-sp.jpg);
}
#hotel-chikusenso:before {
	background-image: url(../img/home/hotel-chikusenso-sp.jpg);
}


@media screen and (min-width: 768px)
{
	#hotel-list li {
		width: 240px; width: calc(100% / 4);
		min-width: 180px;
		height: 320px;
	}
	#hotel-list li a {
		display: block;
		position: relative;
	}
	#hotel-list li .hotel-name {
		font-size: 23px; font-size: 2.3rem;
		line-height: 30px; line-height: 3.0rem;
		letter-spacing: 1px; letter-spacing: 0.1rem;
		-webkit-writing-mode: vertical-rl;
		writing-mode: vertical-rl;
		text-orientation: upright;
		font-feature-settings: normal;
		text-align: left;
		margin-top: 70px;
	}

	#hotel-soho:before {
		background-image: url(../img/home/hotel-soho.jpg);
	}
	#hotel-daichu:before {
		background-image: url(../img/home/hotel-daichu.jpg);
	}
	#hotel-momonohana:before {
		background-image: url(../img/home/hotel-momonohana.jpg);
	}
	#hotel-sanjiro:before {
		background-image: url(../img/home/hotel-sanjiro.jpg);
	}
	#hotel-daikon:before {
		background-image: url(../img/home/hotel-daikon.jpg);
	}
	#hotel-yutomori:before {
		background-image: url(../img/home/hotel-yutomori.jpg);
	}
	#hotel-yutomori:before {
		background-image: url(../img/home/hotel-yutomori.jpg);
	}
	#hotel-zaoroyal:before {
		background-image: url(../img/home/hotel-zaoroyal.jpg);
	}
	#hotel-genbei:before {
		background-image: url(../img/home/hotel-genbei.jpg);
	}
	#hotel-tamaya:before {
		background-image: url(../img/home/hotel-tamaya.jpg);
	}
	#hotel-adumaya:before {
		background-image: url(../img/home/hotel-adumaya.jpg);
	}
	#hotel-sansatei:before {
		background-image: url(../img/home/hotel-sansatei.jpg);
	}
	#hotel-genkiso:before {
		background-image: url(../img/home/hotel-genkiso.jpg);
	}
	#hotel-chikusenso:before {
		background-image: url(../img/home/hotel-chikusenso.jpg);
	}
}
@media screen and (min-width: 920px)
{
	#hotel-list li {
		width: calc(100% / 5);
	}
}
@media screen and (min-width: 1100px) and (max-width: 1279px)
{
	#hotel-list li {
		width: calc(100% / 6);
	}
	#hotel-list li:nth-child(6),
	#hotel-list li:nth-child(12) {
		width: auto;
		flex-grow: 1;
	}
}
@media screen and (min-width: 1280px)
{
	#hotel-list li {
		width: calc(100% / 7);
	}
	#hotel-list li:nth-child(7),
	#hotel-list li:nth-child(14) {
		width: auto;
		flex-grow: 1;
	}
}

