/* ================
base
================ */
body {
	font-family: Helvetica Neue,Arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Meiryo,sans-serif;
	color: #333;
	margin: 0;
}

a {
	color: #333;
	text-decoration: none;
}

a:hover {
	opacity: .7;
}

h2 {
	font-family: 'Noto Serif JP', serif;
	font-weight: bold;
	text-align: center;
	font-size: 50px;
	margin: 0;
}

/* 汎用 */
.spOn {
    display: none;
}

.w1200 {
	max-width: 1200px;
	min-width: 768px;
	margin: 0 auto;
	padding: 0 40px 80px;
}

.widthControl {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 40px 80px;
}

.bgwhite {
	background: #fff;
}

/* ================
header
================ */
header {
	position: relative;
	z-index: 5;
}

header h1 {
	text-align: center;
	font-size: 12px;
	background: linear-gradient(90deg, #0c3aaf 0%, #09a0ff 50%, #0c3aaf 100%);
	color: #fff;
	margin: 0;
	padding: 5px 0;
}

header .fv {
	background: #fff;
}

header .fv img {
	object-fit: cover;
	width: 100%;
	height: 900px;
	vertical-align: bottom;
}

/* ================
.intro
================ */
.intro {
	position: relative;
	z-index: 5;
	height: 850px;
	background: url(images/bg_intro.jpg) ;
	background-size: cover;
	font-family: 'Noto Serif JP', serif;
	text-align: center;
	text-shadow: 1px 1px 0 #fff,-1px 1px 0 #fff,1px -1px 0 #fff,-1px -1px 0 #fff;
}

.intro div {
	padding: 0;
}

.intro h2 {
	padding: 40px 0;
}

.intro p {
	margin: 0 auto;
	font-size: 20px;
	line-height: 45px;
}

video {
	position: fixed;
	z-index: -1;
	width: 100%;
	height: auto;
	top: 0;
}

/* ================
.shopList
================ */
.shopList {
	position: relative;
	z-index: 5;
	background: linear-gradient(0deg, rgba(255,255,255,0) 60%, rgba(255,255,255,1) 100%);
}

.shopList h2 {
	position: relative;
	margin: 0;
	padding: 20px 0 30px;
}

.shopList h2:after {
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translate(-50%, 0);
	content: "───────";
}

.shopList p {
	margin: 0;
	padding: 20px 0 40px;
	text-align: center;
}

.shopList ul {
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-content: flex-start;
	margin: 0;
}

.shopList li {
	width: 200px;
	margin: 0 10px 20px 10px;
}

.shopList ul span {
	display: block;
	text-align: center;
	font-family: 'Noto Serif JP', serif;
	font-weight: bold;
	color: #333;
}

.shopList img {
	border-radius: 20px;
}

/* ================
.todayGirls
================ */
.todayGirls {
	position: relative;
	z-index: 5;
	padding-top: 40px;
	padding-bottom: 80px;
}

.todayGirls p {
	margin: -20px 0 0;
	padding: 20px 0 40px;
	text-align: center;
}

.todayGirls > div {
	width: 100%;
	margin: 0 auto;
}

.todayGirls .pltgwg {
	position: relative;
	margin-bottom: 40px;
	width: 100%;
	height: 308px;
	-webkit-overflow-scrolling: touch;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.4) 0%, rgba(9, 160, 255, 1) 100%);
	z-index: 5;
}

.todayGirls .pltgwg::after {
	content: "";
	background-color: #fff;
	display: block;
	height: 5px;
	width: 100%;
	position: absolute;
	bottom: -5px;

}

.todayGirls h3 {
	padding: 10px 0;
	background: linear-gradient(90deg, rgba(9, 160, 255, 1) 0%, rgba(12, 58, 175, 1) 100%);
	margin: 0;
	font-family: 'Noto Serif JP', serif;
	color: #fff;
	text-align: center;
}

.todayGirls iframe {
	width: 100%;
	height: 100%;
	border: none;
}

/* ================
.girlsPost
================ */
.girlsPost {
	position: relative;
	z-index: 5;
	padding-bottom: 80px;
}

.girlsPost h3 {
	padding: 10px 0;
	background: linear-gradient(90deg, #f78361 0%, #f54b64 100%);
	margin: 0 0 -20px 0;
	font-family: 'Noto Serif JP', serif;
	color: #fff;
	text-align: center;
	z-index: 999;
	position: relative;
}

.girlsPost p {
	margin: 0;
	padding: 20px 0 40px;
	text-align: center;
}

.hcgpwg {
	margin-bottom: 50px;
	text-align: center;
}

.hcgpwg a {
	color: #f88094;
	background: #fff;
	border: solid 1px #f88094;
	position: relative;
	transition: all 0.3s ease-in-out;
	display: inline-block;
	padding: 10px 20px;
	font-family: 'Noto Serif JP', serif;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
}

.hcgpwg a:before,
.hcgpwg a:after {
	content: '';
	display: block;
	position: absolute;
	border-color: #f88094;
	box-sizing: border-box;
	border-style: solid;
	width: 1em;
	height: 1em;
	transition: all 0.5s ease-in-out;
}

.hcgpwg a:before {
	top: -6px;
	left: -6px;
	border-width: 1px 0 0 1px;
	z-index: 5;
}

.hcgpwg a:after {
	bottom: -6px;
	right: -6px;
	border-width: 0 1px 1px 0;
}

.hcgpwg a:hover:before,
.hcgpwg a:hover:after {
	width: calc(100% + 12px);
	height: calc(100% + 12px);
	border-color: #f54b64;
}

.hcgpwg a:hover {
	color: #fff;
	background-color: #f54b64;
	border-color: #f54b64;
	opacity: 1;
}

.map_illustration {
	margin-bottom: 20px;
}

/* ================
footer
================ */
footer {
	position: relative;
	z-index: 5;
	text-align: center;
	padding: 20px 0;
}

/* スマホ */
@media (max-width: 768px){
    /* 汎用 */
    .spOn {
        display: block;
    }
    .spOff {
        display: none;
    }
	.widthControl {
		width: 100%;
		max-width: 1200px;
		margin: 0 auto;
		padding: 0 10px 40px;
	}
	/* ================
	header
	================ */
	header .fv img {
		width: 100%;
		height: auto;
	}
	/* ================
	base
	================ */
	h2 {
		font-size: 30px;
	}
	/* ================
	.intro
	================ */
	.intro {
		height: auto;
		background: url(images/bg_intro.jpg) center center no-repeat;
		text-shadow: #fff 1px 1px 0;
	}

	.intro h2 {
		padding: 20px 0;
	}

	.intro p {
		font-size: 16px;
		line-height: 30px;
		text-align: left;
		padding: 0 10px 40px;
	}

	video {
		display: none;
	}

	/* ================
	.shopList
	================ */
	.shopList h2 {
		padding: 30px 0 30px;
		font-size: 25px;
	}

	.shopList h2:after {
		bottom: 10px;
		content: "──────────";
	}

	.shopList p {
		padding: 10px 0 30px;
		text-align: left;
	}

	.shopList li {
		width: 157px;
	}

	/* ================
	.todayGirls
	================ */
	.todayGirls p {
		padding: 20px 0 20px;
		text-align: left;
	}

	.todayGirls .pltgwg {
		margin-bottom: 20px;
		height: 349px;
	}

	/* ================
	.girlsPost
	================ */
	.girlsPost {
		padding-bottom: 40px;
	}

	.girlsPost p {
		padding: 20px 0 20px;
		text-align: left;
	}

	.hcgpwg {
		margin-bottom: 40px;
	}
}