@charset "utf-8";

#main { width:1100px; margin:10px auto; }
#main .sp { display:none!important; }

/*----------------------�X�}�z��-----------------------*/
@media screen and (max-width: 768px) {
#main .pc { display:none!important; }
}

/*----------------------top�֖߂�----------------------*/
#return_top { text-align:center; margin:10px; }
#return_top a { background: url("https://image.stworld.jp/images/common/tri01.gif") no-repeat scroll left 5px rgba(0, 0, 0, 0); line-height: 1em; padding-left: 10px; }



/*------------------------------------------------------------
  body
------------------------------------------------------------*/
#main {
	width: 100%;
	color: #111;
	font-size: 15px;
	font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	line-height: 1.5em;
	margin: 0 auto 50px;
}
#main a {
	text-decoration: none;
}
#main a:hover {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha(opacity=80)";
}
#main img {
	width: 100%;
}
#main h3,
#main h4,
#main h5,
#main h3 span,
#main h4 span,
#main h5 span {
	font-weight: bold;
}
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}
.hide {
  height: 0;
  margin: 0 auto;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}
.pc-no01 {
  display: none;
}
.fl01 {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}
.fl02 {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
.fl03 {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
}
.deco .box {
	background: #fff;
	box-sizing: border-box;
	border: 4px solid #002d9f;
	box-shadow: 10px 10px #e8eeff;
}

@media screen and (max-width: 768px) {
	#main{
		width: 100%;
		font-size: 13px;
	}
	.pc-no01 {
		display: block;
	}
	.sp-no01 {
		display: none;
	}
	.fl01 {
		display: block;
		-webkit-justify-content: inherit;
		justify-content: inherit;
	}
	.fl02 {
		display: block;
		-webkit-justify-content: inherit;
		justify-content: inherit;
		-webkit-flex-wrap: inherit;
		flex-wrap: inherit;
	}
	.fl03 {
		display: block;
		-webkit-justify-content: inherit;
		justify-content: inherit;
	}
	.deco .box {
		border: 2px solid #002d9f;
		box-shadow: 6px 6px #e8eeff;
	}
	
}


/*------------------------------------------------------------
  color
------------------------------------------------------------*/
.cl-bl01 {
	color: #002d9f;
}
.cl-bl02 {
	color: #8fe5d8;
}


/*------------------------------------------------------------
  background
------------------------------------------------------------*/
.bg-pk01 {
	background: #f76688;
}
.bg-or01 {
	background: #e89338;
}
.bg-bl01 {
	background: #71c4d3;
}
.bg-pl01 {
	background: #967ecd;
}


/*------------------------------------------------------------
  txt
------------------------------------------------------------*/
.txt {
	text-align: justify;
	font-size: 14px;
	line-height: 1.8em;
	letter-spacing: -0.03em;
}

@media screen and (max-width: 768px) {
	.txt{
		font-size: 13px;
		line-height: 1.5em;
	}
}


/*------------------------------------------------------------
  mv
------------------------------------------------------------*/
#main .mv {
	width: 100%;
	height: 720px;
	min-width: 1100px;
	box-sizing: border-box;
	padding: 110px 0;
	margin: auto;
	overflow: hidden;
}
#main .top .mv {
	background: url("../images/top-mv.jpg") center center no-repeat;
	background-size: cover;
}
#main .top .mv-ttl {
	background: url("../images/top-mvttl.png") center center no-repeat;
	background-size: 100% auto;
	width: 478px;
	height: 478px;
}

@media screen and (max-width: 768px) {
	#main .mv {
		height: 0;
		min-width: 100%;
		padding: 0 0;
		padding-top: 101.56%;
	}
	#main .top .mv {
		background: url("../images/sp-top-mv.jpg") center center no-repeat;
		background-size: 100% auto;
	}
	#main .top .mv-ttl {
		background: none;
		background-size: 100% auto;
		width: 100%;
		height: auto;
	}
}


/*------------------------------------------------------------
  main-txt
------------------------------------------------------------*/
.main-txt {
	width: 100%;
	min-width: 1100px;
	box-sizing: border-box;
	padding: 70px 0;
	margin: auto;
}
.main-txt .txt {
	text-align: center;
	font-size: 18px;
	line-height: 2em;
}

@media screen and (max-width: 768px) {
	.main-txt {
		min-width: 100%;
		padding: 25px 15px;
	}
	.main-txt .txt {
		text-align: justify;
		font-size: 14px;
		line-height: 1.8em;
	}
}


/*------------------------------------------------------------
  con
------------------------------------------------------------*/
.con {
	width: 100%;
	min-width: 1100px;
	box-sizing: border-box;
	margin: auto;
}
.con .inner {
	max-width: 1100px;
	margin: auto;
}

@media screen and (max-width: 768px) {
	.con {
		min-width: 100%;
	}
	.con .inner {
		max-width: 100%;
	}
}


/*------------------------------------------------------------
  ttl
------------------------------------------------------------*/
/*---------- ttl-box01 ----------*/
.ttl-box01 {
	background: url("../images/ttl-bg01-01.png") 0 0 repeat-x;
	background-size: 40px 144px;
}
.ttl-box01 h3 {
	background: url("../images/ttl-bg01.png") center 0 no-repeat;
	background-size: 1400px 144px;
	box-sizing: border-box;
	width: 1100px;
	height: 144px;
	margin: auto;
	color: #fff;
	text-align: center;
	font-size: 40px;
	padding-top: 50px;
}
.ttl-box01-01 h3 {
	line-height: 1.1em;
	padding-top: 15px;
}

/*---------- tl01 ----------*/
.tl01 {
	color: #002d9f;
	border-bottom: 2px solid #002d9f;
	padding-bottom: 10px;
}

/*---------- ttl-box02 ----------*/
.ttl-box02 {
	text-align: center;
}
.ttl-box02 .tl02 {
	display: inline-block;
	position: relative;
}
.ttl-box02 .tl02:before,
.ttl-box02 .tl02:after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 50%;	
}
.ttl-box02 .tl02:before {
	left: 0;
	-moz-transform: rotate(60deg);
	-webkit-transform: rotate(60deg);
	-ms-transform: rotate(60deg);
	transform: rotate(60deg);
}
.ttl-box02 .tl02:after {
	right: 0;
	-moz-transform: rotate(-60deg);
	-webkit-transform: rotate(-60deg);
	-ms-transform: rotate(-60deg);
	transform: rotate(-60deg);
}

@media screen and (max-width: 768px) {
	.ttl-box01 {
		background: none;
		background-size: 100% auto;
	}
	.ttl-box01 h3 {
		background: url("../images/ttl-bg01.png") center 0 no-repeat;
		background-size: auto 100%;
		width: 100%;
		height: auto;
		font-size: 5.2vw;
		padding-top: 20%;
		position: relative;
	}
	.ttl-box01-01 h3 {
		padding-top: 20%;
	}
	.ttl-box01 h3 span {
		position: absolute;
		top: 31%;
		left: 0;
		right: 0;
	}
	.ttl-box01 h3 span.ttl-ad {
		top: 10%;
		line-height: 1.2em;
	}
	.tl01 {
		padding-bottom: 5px;
	}
}


/*------------------------------------------------------------
  btn
------------------------------------------------------------*/
.btn-box .btn a {
	display: block;
	width: 100%;
	color: #fff;
	font-weight: bold;
	text-align: center;
	position: relative;
}
.btn-box .btn a:after {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 6px;
	height: 6px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	margin-top: -3px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.btn-pk a {
	background: #ff586b;
	border-bottom: 5px solid #d44051;
}
.btn-bl a {
	background: #002d9f;
	border-bottom: 5px solid #041d5b;
}
.btn-box .btn a span {
	font-weight: bold;
}

@media screen and (max-width: 768px) {
	.btn-box .btn a:after {
		right: 5%;
		width: 4px;
		height: 4px;
		margin-top: -2px;
	}
}


/*------------------------------------------------------------
  rec-tour
------------------------------------------------------------*/
.rec-tour .block {
	padding: 35px 0 100px;
}
.rec-tour li {
	width: 23%;
	padding-bottom: 110px;
	position: relative;
}
.rec-tour h4 {
	font-size: 18px;
	line-height: 1.5em;
	margin-top: 20px;
}
.rec-tour .txt {
	margin-top: 25px;
}
.rec-tour .price {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 60px;
	color: #dc0000;
	text-align: right;
	font-size: 20px;
	font-weight: bold;
}
.rec-tour .price span {
	font-size: 26px;
	font-weight: bold;
}

/*---------- btn-box ----------*/
.rec-tour .btn-box {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
}
.rec-tour .btn-box .btn a {
	font-size: 15px;
	line-height: 40px;
}

@media screen and (max-width: 768px) {
	.rec-tour .block {
		padding: 20px 15px 50px;
	}
	.rec-tour ul {
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.rec-tour li {
		width: 48%;
		padding-bottom: 0;
		margin-bottom: 30px;
	}
	.rec-tour li:last-child {
		margin-bottom: 0;
	}
	.rec-tour h4 {
		font-size: 16px;
		line-height: 1.3em;
		margin-top: 15px;
	}
	.rec-tour .txt {
		margin-top: 15px;
	}
	.rec-tour .price {
		position: static;
		left: inherit;
		right: inherit;
		bottom: inherit;
		font-size: 3.6vw;
		margin-top: 25px;
	}
	.rec-tour .price span {
		font-size: 4.6vw;
	}

	/*---------- btn-box ----------*/
	.rec-tour .btn-box {
		position: static;
		left: inherit;
		right: inherit;
		bottom: inherit;
		margin-top: 20px;
	}
	.rec-tour .btn-box .btn a {
		font-size: 13px;
	}
}


/*------------------------------------------------------------
  hotel-features
------------------------------------------------------------*/
.hotel-features .block {
	padding: 35px 0 100px;
}
.hotel-features .box {
	margin-bottom: 45px;
}
.hotel-features .box:last-child {
	margin-bottom: 0;
}
.hotel-features .box .left,
.hotel-features .box .right {
	width: 50%;
}
.hotel-features .box .left {
	color: #fff;
	box-sizing: border-box;
	padding: 30px 30px;
}
.hotel-features .box01 .left {
	background: url("../images/top-img01.jpg") center 0 no-repeat;
	background-size: 100% auto;
	height: 268px;
}
.hotel-features .box02 .left {
	background: url("../images/top-img03.jpg") center 0 no-repeat;
	background-size: 100% auto;
	height: 505px;
}
.hotel-features .box01 .right img {
	height: 268px;
}
/*
.hotel-features .box02 .right img {
	height: 505px;
}
*/
.hotel-features h4 {
	background: #fff;
	color: #636363;
	font-size: 23px;
	letter-spacing: -0.07em;
	line-height: 1.3em;
	padding: 10px 20px;
	margin-bottom: 30px;
	position: relative;
}
.hotel-features h4::after{
	content: "";
  display: inline-block;
  position: absolute;
  bottom: -10px; 
  left: 55px;
  border: 20px solid transparent;
  border-bottom: 14px solid #fff;
  -webkit-transform: rotate(30deg);
  transform: rotate(30deg);
}
.hotel-features .txt {
	font-size: 15px;
}
.order01 {
	order: 1;
}
.order02 {
	order: 2;
}

/*---------- g-map ----------*/
#g-map {
	width: 100%;
	height: 0;
	padding-bottom: 91.81%;
	overflow: hidden;
	position: relative;
}
#g-map .map-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*---------- list-box ----------*/
.list-box li {
	font-size: 15px;
	padding-left: 18px;
	margin-bottom: 5px;
	position: relative;
}
.list-box li:last-child {
	margin-bottom: 0;
}
.list-box li:before {
	content: "";
	position: absolute;
	top: 5px;
	left: 0;
	width: 12px;
	height: 12px;
	box-sizing: border-box;
	border-radius: 50%;
	border: 3px solid #fff;
}

/*---------- highlight ----------*/
.highlight dt {
	font-size: 21px;
	font-weight: bold;
	margin: 15px 0 10px;
}
.highlight dd {
	text-align: justify;
	border-bottom: 1px solid #fff;
	padding-bottom: 15px;
}
.highlight dd:last-child {
	border-bottom: none;
}

@media screen and (max-width: 768px) {
	.hotel-features .block {
		padding: 20px 0 30px;
	}
	.hotel-features .box {
		margin-bottom: 20px;
	}
	.hotel-features .box .left,
	.hotel-features .box .right {
		width: 100%;
	}
	.hotel-features .box .left {
		padding: 20px 15px;
	}
	.hotel-features .box01 .left {
		background: url("../images/top-img01.jpg") center 0 no-repeat;
		background-size: 100% 100%;
		height: auto;
	}
	.hotel-features .box02 .left {
		background: url("../images/top-img03.jpg") center 0 no-repeat;
		background-size: 100% 100%;
		height: auto;
	}
	.hotel-features .box01 .right img {
		height: auto;
	}
	/*
	.hotel-features .box02 .right img {
		height: auto;
	}
	*/
	.hotel-features h4 {
		font-size: 3.8vw;
		line-height: 1.2em;
		padding: 10px 15px;
		margin-bottom: 25px;
	}
	.hotel-features h4::after{
		bottom: -8px; 
		left: 45px;
		border: 18px solid transparent;
		border-bottom: 14px solid #fff;
	}
	.hotel-features .txt {
		font-size: 13px;
	}
	
	/*---------- g-map ----------*/
	
	/*---------- list-box ----------*/
	.list-box li {
		font-size: 13px;
	}
	.list-box li:before {
		top: 4px;
	}

	/*---------- highlight ----------*/
	.highlight dt {
		font-size: 17px;
	}
}


/*------------------------------------------------------------
  district
------------------------------------------------------------*/
.district .block {
	padding: 35px 0 100px;
}
.district .box {
	width: 48%;
	padding: 25px 25px;
	margin-bottom: 4%;
}
.district .box:nth-child(3n),
.district .box:nth-child(4n){
	margin-bottom: 0;
}
.district .left {
	width: 38%;
}
.district .right {
	width: 58%;
}
.district h4 {
	font-size: 26px;
}
.district .txt {
	margin-top: 15px;
}
.district .spot {
	margin-top: 15px;
}
.district .spot dl {
	display: table;
	width: 100%;
	box-sizing: border-box;
	border: 2px solid #8fe5d8;
}
.district .spot dt {
	display: table-cell;
	vertical-align: middle;
	background: #8fe5d8;
	width: 35%;
	height: 55px;
	box-sizing: border-box;
	text-align: center;
	font-size: 17px;
	position: relative;
}
.district .spot dt:after {
	display: block;
	content: '';
	position: absolute;
	top: 0;
	right: -10px;
	width: 0px;
	height: 0px;
	z-index: 1;
	border-style: solid;
	border-width: 0 0 55px 10px;
	border-color: #8fe5d8;
	border-bottom-color: transparent;
}
.district .spot dd {
	display: table-cell;
	vertical-align: middle;
	box-sizing: border-box;
	padding-left: 15px;
}
.district .spot dd ul {
	font-size: 0;
}
.district .spot dd li {
	display: inline-block;
	vertical-align: middle;
	box-sizing: border-box;
	font-size: 15px;
	margin-right: 10px;
}
.district .spot dd li:last-child {
	margin-right: 0;
}

/*---------- btn-box ----------*/
.district .btn-box {
	margin-top: 20px;
}
.district .btn-box .btn a {
	font-size: 18px;
	line-height: 60px;
}

@media screen and (max-width: 768px) {
	.district .block {
		padding: 20px 15px 50px;
	}
	.district .box {
		width: 100%;
		padding: 25px 15px 25px;
		margin-bottom: 30px;
	}
	.district .fl01 {
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
	}
	.district .box:nth-child(3n),
	.district .box:nth-child(4n){
		margin-bottom: 30px;
	}
	.district .box:last-child {
		margin-bottom: 0;
	}	
	.district .left {
		width: 33%;
	}
	.district .right {
		width: 64%;
	}
	.district h4 {
		font-size: 20px;
	}
	.district .txt {
		margin-top: 13px;
	}
	.district .spot {
		margin-top: 15px;
	}
	.district .spot dl {
		display: block;
	}
	.district .spot dt {
		display: block;
		vertical-align: inherit;
		width: 100%;
		height: 30px;
		line-height: 30px;
		font-size: 15px;
	}
	.district .spot dt:after {
		display: none;
	}
	.district .spot dd {
		display: block;
		vertical-align: inherit;
		padding-left: 0;
		padding: 10px 10px;
	}
	.district .spot dd li {
		font-size: 13px;
	}

	/*---------- btn-box ----------*/
	.district .btn-box {
		margin-top: 15px;
	}
	.district .btn-box .btn a {
		font-size: 13px;
		line-height: 1.3em;
		padding: 10px 0;
	}
}


/*------------------------------------------------------------
  purpose
------------------------------------------------------------*/
.purpose .block {
	padding: 35px 0 100px;
}
.purpose .box {
	width: 48%;
	padding-bottom: 150px;
	margin-bottom: 4%;
	position: relative;
}
.purpose .box:nth-child(5n),
.purpose .box:nth-child(6n){
	margin-bottom: 0;
}
.purpose .txt-box {
	background: #fff;
	box-sizing: border-box;
	padding: 30px 25px 0;
}
.purpose h4 {
	font-size: 30px;
	line-height: 1.3em;
	position: relative;
}
.purpose h4.icon:after {
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	width: 80px;
}
.purpose h4.icon01:after {
	background: url("../images/r-icon01.png") 0 0 no-repeat;
	background-size: 100% auto;
	height: 89px;
}
.purpose h4.icon02:after {
	background: url("../images/r-icon02.png") 0 0 no-repeat;
	background-size: 100% auto;
	height: 97px;
}
.purpose h4.icon03:after {
	background: url("../images/r-icon03.png") 0 0 no-repeat;
	background-size: 100% auto;
	height: 90px;
}
.purpose h4.icon04:after {
	background: url("../images/r-icon04.png") 0 0 no-repeat;
	background-size: 100% auto;
	height: 90px;
}
.purpose h4.icon05:after {
	background: url("../images/r-icon05.png") 0 0 no-repeat;
	background-size: 100% auto;
	height: 90px;
}
.purpose .txt {
	margin-top: 20px;
}

/*---------- btn-box ----------*/
.purpose .btn-box {
	position: absolute;
	left: 25px;
	right: 25px;
	bottom: 40px;
}
.purpose .btn-box .btn a {
	font-size: 20px;
	line-height: 1.3em;
	padding: 15px 0;
}

@media screen and (max-width: 768px) {
	.purpose .block {
		padding: 20px 15px 50px;
	}
	.purpose .box {
		width: 100%;
		padding-bottom: 0;
		margin-bottom: 30px;
		padding: 25px 15px 25px;
	}
	.purpose .box:nth-child(3n),
	.purpose .box:nth-child(4n){
		margin-bottom: 30px;
	}
	.purpose .box:last-child {
		margin-bottom: 0;
	}	
	.purpose .img-box {
		width: 33%;
		float: left;
	}
	.purpose .txt-box {
		padding: 0 0 0;
	}
	.purpose h4 {
		width: 64%;
		float: right;
		font-size: 4.5vw;
	}
	.purpose h4.icon:after {
		width: 40px;
	}
	.purpose h4.icon01:after {
		height: 49px;
	}
	.purpose h4.icon02:after {
		height: 57px;
	}
	.purpose h4.icon03:after {
		height: 50px;
	}
	.purpose h4.icon04:after {
		height: 50px;
	}
	.purpose .txt {
		margin-top: 15px;
	}

	/*---------- btn-box ----------*/
	.purpose .btn-box {
		position: static;
		left: inherit;
		right: inherit;
		bottom: inherit;
		margin-top: 15px;
	}
	.purpose .btn-box .btn a {
		font-size: 13px;
		padding: 10px 0;
	}
}


/*------------------------------------------------------------
  form-area
------------------------------------------------------------*/
.form-area {
	background: url("../images/bg01.jpg") center center no-repeat;
	background-size: cover;
	color: #fff;
	padding: 80px 0;
}
.form-area h3 {
	text-align: center;
	font-size: 40px;
}
.form-area h3 span {
	font-size: 25px;
}
.form-area .txt {
	text-align: center;
	font-weight: bold;
	line-height: 2em;
	margin-top: 25px;
}

/*---------- btn-box ----------*/
.form-area .btn-box {
	margin-top: 40px;
}
.form-area .btn-box li {
	width: 43%;
}
.form-area .btn-box li:nth-child(2n-1) {
	margin-right: 40px;
}
.form-area .btn-box .btn a {
	font-size: 20px;
	line-height: 1.3em;
	border: 2px solid #fff;
	padding: 15px 0;
}
.form-area .btn-box .btn a span {
	font-size: 16px;
}

@media screen and (max-width: 768px) {
	.form-area {
		background: url("../images/sp-bg01.jpg") center center no-repeat;
		background-size: cover;
		padding: 30px 15px;
	}
	.form-area h3 {
		font-size: 5.2vw;
		line-height: 1.3em;
	}
	.form-area h3 span {
		font-size: 3.5vw;
	}
	.form-area .txt {
		text-align: justify;
		line-height: 1.8em;
		margin-top: 20px;
	}

	/*---------- btn-box ----------*/
	.form-area .btn-box {
		margin-top: 20px;
	}
	.form-area .btn-box li {
		width: 100%;
	}
	.form-area .btn-box li:nth-child(2n-1) {
		margin-right: 0;
		margin-bottom: 10px;
	}
	.form-area .btn-box .btn a {
		font-size: 16px;
		padding: 12px 0;
	}
	.form-area .btn-box .btn a span {
		font-size: 13px;
	}
}


/*------------------------------------------------------------
  rec-info
------------------------------------------------------------*/
.rec-info {
	background: url("../images/bg02.jpg") center center no-repeat;
	background-size: cover;
	padding: 90px 0 80px;
}
.rec-info h3 {
	background: url("../images/ttl-bg02.png") center 0 no-repeat;
	background-size: 100% auto;
	box-sizing: border-box;
	width: 1100px;
	height: 136px;
	color: #002d9f;
	text-align: center;
	font-size: 42px;
	margin: auto;
	padding-top: 45px;
}

/*---------- btn-box ----------*/
.rec-info .btn-box {
	margin-top: 30px;
}
.rec-info .btn-box li {
	width: 32%;
	margin-bottom: 2%;
}
.rec-info .btn-box .btn a {
	font-size: 18px;
	line-height: 70px;
}

@media screen and (max-width: 768px) {
	.rec-info {
		padding: 40px 15px 50px;
	}
	.rec-info h3 {
		background: url("../images/ttl-bg02.png") center 0 no-repeat;
		background-size: auto 100%;
		width: 100%;
		height: auto;
		font-size: 5.2vw;
		padding-top: 20%;
		position: relative;
	}
	.rec-info h3 span {
		position: absolute;
		top: 28%;
		left: 0;
		right: 0;
	}

	/*---------- btn-box ----------*/
	.rec-info .btn-box {
		margin-top: 20px;
	}
	.rec-info .btn-box li {
		width: 100%;
		margin-bottom: 2%;
	}
	.rec-info .btn-box li:last-child {
		margin-bottom: 0;
	}
	.rec-info .btn-box .btn a {
		font-size: 15px;
		line-height: 45px;
	}
}










/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
  under
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/*------------------------------------------------------------
  mv
------------------------------------------------------------*/
.under .mv {
	width: 100%;
	height: 740px;
	min-width: 1100px;
	box-sizing: border-box;
	padding: 100px 0;
	margin: auto;
	overflow: hidden;
}
.under .mv-ttl {
	width: 478px;
	height: 529px;
}

/*---------- opera ----------*/
.under.opera .mv {
	background: url("../images/opera-mv.jpg") center center no-repeat;
	background-size: cover;
}
.under.opera .mv-ttl {
	background: url("../images/opera-mvttl.png") center center no-repeat;
	background-size: 100% auto;
}

/*---------- marais ----------*/
.under.marais .mv {
	background: url("../images/marais-mv.jpg") center center no-repeat;
	background-size: cover;
}
.under.marais .mv-ttl {
	background: url("../images/marais-mvttl.png") center center no-repeat;
	background-size: 100% auto;
}

/*---------- saint germain ----------*/
.under.sg .mv {
	background: url("../images/sg-mv.jpg") center center no-repeat;
	background-size: cover;
}
.under.sg .mv-ttl {
	background: url("../images/sg-mvttl.png") center center no-repeat;
	background-size: 100% auto;
}

/*---------- saint germain ----------*/
.under.sg .mv {
	background: url("../images/sg-mv.jpg") center center no-repeat;
	background-size: cover;
}
.under.sg .mv-ttl {
	background: url("../images/sg-mvttl.png") center center no-repeat;
	background-size: 100% auto;
}

/*---------- other ----------*/
.under.other .mv {
	background: url("../images/other-mv.jpg") center center no-repeat;
	background-size: cover;
}
.under.other .mv-ttl {
	background: url("../images/other-mvttl.png") center center no-repeat;
	background-size: 100% auto;
}

/*---------- woman ----------*/
.under.woman .mv {
	background: url("../images/woman-mv.jpg") center center no-repeat;
	background-size: cover;
}
.under.woman .mv-ttl {
	background: url("../images/woman-mvttl.png") center center no-repeat;
	background-size: 100% auto;
}

/*---------- honeymooner ----------*/
.under.hm .mv {
	background: url("../images/hm-mv.jpg") center center no-repeat;
	background-size: cover;
}
.under.hm .mv-ttl {
	background: url("../images/hm-mvttl.png") center center no-repeat;
	background-size: 100% auto;
}

/*---------- senior ----------*/
.under.senior .mv {
	background: url("../images/senior-mv.jpg") center center no-repeat;
	background-size: cover;
}
.under.senior .mv-ttl {
	background: url("../images/senior-mvttl.png") center center no-repeat;
	background-size: 100% auto;
}

/*---------- price ----------*/
.under.price .mv {
	background: url("../images/price-mv.jpg") center center no-repeat;
	background-size: cover;
}
.under.price .mv-ttl {
	background: url("../images/price-mvttl.png") center center no-repeat;
	background-size: 100% auto;
}

/*---------- palace ----------*/
.under.palace .mv {
	background: url("../images/palace-mv.jpg") center center no-repeat;
	background-size: cover;
}
.under.palace .mv-ttl {
	background: url("../images/palace-mvttl.png") center center no-repeat;
	background-size: 100% auto;
}

@media screen and (max-width: 768px) {
	.under .mv {
		height: 0;
		min-width: 100%;
		padding: 0 0;
		padding-top: 101.56%;
	}
	.under .mv-ttl {
		background: none;
		background-size: 100% auto;
		width: 100%;
		height: auto;
	}
	
	/*---------- opera ----------*/
	.under.opera .mv {
		background: url("../images/sp-opera-mv.jpg") center center no-repeat;
		background-size: 100% auto;
	}
	
	/*---------- marais ----------*/
	.under.marais .mv {
		background: url("../images/sp-marais-mv.jpg") center center no-repeat;
		background-size: 100% auto;
	}
	
	/*---------- saint germain ----------*/
	.under.sg .mv {
		background: url("../images/sp-sg-mv.jpg") center center no-repeat;
		background-size: 100% auto;
	}
	
	/*---------- other ----------*/
	.under.other .mv {
		background: url("../images/sp-other-mv.jpg") center center no-repeat;
		background-size: 100% auto;
	}
	
	/*---------- woman ----------*/
	.under.woman .mv {
		background: url("../images/sp-woman-mv.jpg") center center no-repeat;
		background-size: 100% auto;
	}
	
	/*---------- honeymooner ----------*/
	.under.hm .mv {
		background: url("../images/sp-hm-mv.jpg") center center no-repeat;
		background-size: 100% auto;
	}
	
	/*---------- senior ----------*/
	.under.senior .mv {
		background: url("../images/sp-senior-mv.jpg") center center no-repeat;
		background-size: 100% auto;
	}
	
	/*---------- price ----------*/
	.under.price .mv {
		background: url("../images/sp-price-mv.jpg") center center no-repeat;
		background-size: 100% auto;
	}
}


/*------------------------------------------------------------
  hotel-features
------------------------------------------------------------*/
.under .hotel-features .box01 .left {
	background: url("../images/under-img01.jpg") center 0 no-repeat;
	background-size: 100% auto;
	height: 300px;
}
.under .hotel-features .box02 .left {
	background: url("../images/under-img03.jpg") center 0 no-repeat;
	background-size: 100% auto;
	height: 270px;
}
/*
.under .hotel-features .box01 .right img {
	height: 300px;
}
*/
.under .hotel-features .box02 .right img {
	height: 270px;
}

/*---------- map-box ----------*/
.map-box {
	width: 100%;
	box-sizing: border-box;
}
.map-box .map {
	width: 100%;
	height: 0;
	padding-bottom: 54.54%;
	overflow: hidden;
	position: relative;
}
.map-box .map iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


@media screen and (max-width: 768px) {
	.under .hotel-features .box01 .left {
		background: url("../images/under-img01.jpg") center 0 no-repeat;
		background-size: 100% 100%;
		height: auto;
	}
	.under .hotel-features .box02 .left {
		background: url("../images/under-img03.jpg") center 0 no-repeat;
		background-size: 100% 100%;
		height: auto;
	}
	/*
	.under .hotel-features .box01 .right img {
		height: auto;
	}
	*/
	.under .hotel-features .box02 .right img {
		height: auto;
	}
	
	/*---------- map-box ----------*/
	.map-box .map {
		padding-bottom: 65%;
	}
}


/*------------------------------------------------------------
  ranking
------------------------------------------------------------*/
.ranking {
	background: url("../images/bg03.jpg") center 0 no-repeat;
	background-size: cover;
	padding: 80px 0;
}

/*---------- ttl-box02 ----------*/
.ranking .ttl-box02 .tl02 {
	color: #fff;
	font-size: 42px;
	line-height: 1.0em;
	padding: 0 65px;
}
.ranking .ttl-box02 .tl02:before,
.ranking .ttl-box02 .tl02:after {
	width: 50px;
	height: 2px;
	background-color: #fff;
}

/*---------- page-link ----------*/
.page-link {
	box-sizing: border-box;
	border: 3px solid #fff;
	padding: 35px 50px;
	margin-top: 40px;
}
.page-link li {
	display: table;
	background: #fff;
	width: 48%;
	box-sizing: border-box;
	line-height: 60px;
	margin-bottom: 20px;
	position: relative;
}
.page-link li:last-child {
	margin-bottom: 0;
}
.page-link li.r-no01 {
	border: 2px solid #dab239;
}
.page-link li.r-no02 {
	border: 2px solid #adadad;
}
.page-link li.r-no03 {
	border: 2px solid #d47247;
}
.page-link li.r-no04,
.page-link li.r-no05 {
	border: 2px solid #002d9f;
}

.page-link li p {
	display: table-cell;
	vertical-align: middle;
	width: 20%;
	color: #fff;
	text-align: center;
	font-size: 25px;
	font-weight: bold;
}
.page-link li p span {
	font-size: 18px;
	font-weight: bold;
}
.page-link li.r-no01 p {
	background: #dab239;
}
.page-link li.r-no02 p {
	background: #adadad;
}
.page-link li.r-no03 p {
	background: #d47247;
}
.page-link li.r-no04 p,
.page-link li.r-no05 p {
	background: #002d9f;
}

.page-link li a {
	display: table-cell;
	vertical-align: middle;
	font-size: 18px;
	font-weight: bold;
	padding-left: 15px;
	position: relative;
}
.page-link li a.fs13 {
	font-size: 13px;
}
.page-link li.r-no01 a {
	color: #dab239;
}
.page-link li.r-no02 a {
	color: #adadad;
}
.page-link li.r-no03 a {
	color: #d47247;
}
.page-link li.r-no04 a,
.page-link li.r-no05 a {
	color: #002d9f;
}
.page-link li a:after {
	display: block;
	content: "";
	width: 8px;
	height: 8px;
	margin-top: -6px;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
	position: absolute;
	top: 50%;
	right: 25px;
}
.page-link li.r-no01 a:after {
	border-top: solid 2px #dab239;
	border-right: solid 2px #dab239;
}
.page-link li.r-no02 a:after {
	border-top: solid 2px #adadad;
	border-right: solid 2px #adadad;
}
.page-link li.r-no03 a:after {
	border-top: solid 2px #d47247;
	border-right: solid 2px #d47247;
}
.page-link li.r-no04 a:after,
.page-link li.r-no05 a:after {
	border-top: solid 2px #002d9f;
	border-right: solid 2px #002d9f;
}

@media screen and (max-width: 768px) {
	.ranking {
		padding: 40px 15px;
	}

	/*---------- ttl-box02 ----------*/
	.ranking .ttl-box02 .tl02 {
		font-size: 5vw;
		line-height: 1.3em;
		padding: 0 13%;
	}
	.ranking .ttl-box02 .tl02:before,
	.ranking .ttl-box02 .tl02:after {
		width: 42px;
	}

	/*---------- page-link ----------*/
	.page-link {
		padding: 25px 15px;
		margin-top: 20px;
	}
	.page-link li {
		width: 100%;
		line-height: 1.3em;
		margin-bottom: 10px;
	}

	.page-link li p {
		width: 15%;
		font-size: 18px;
	}
	.page-link li p span {
		font-size: 13px;
	}

	.page-link li a {
		font-size: 3.2vw;
		line-height: 1.2em;
		padding: 12px 0;
		padding-left: 10px;
	}
	.page-link li a.fs13 {
		font-size: 3.2vw;
	}
	.page-link li a:after {
		width: 4px;
		height: 4px;
		margin-top: -2px;
		top: 50%;
		right: 5%;
	}
}


/*------------------------------------------------------------
  h-ranking
------------------------------------------------------------*/
.h-ranking .block {
	padding-top: 90px;
}

/*---------- ttl-wrap ----------*/
.h-ranking .ttl-wrap {
	display: table;
	background: url("../images/ttl-bg03.jpg") center 0 no-repeat;
	background-size: 100% auto;
	box-sizing: border-box;
	width: 100%;
	height: 140px;
	padding: 0 35px 0 85px;
	position: relative;
}
.h-ranking .ttl-wrap02 {
	background: url("../images/ttl-bg03-02.jpg") center 0 no-repeat;
	background-size: 100% auto;
	height: 170px;
}
.h-ranking .ttl-wrap:before {
	content: "";
	position: absolute;
	top: -64px;
	left: -50px;
	width: 132px;
	height: 128px;
}
.h-ranking #no01 .ttl-wrap:before {
	background: url("../images/no01.png") 0 0 no-repeat;
	background-size: 100% auto;
}
.h-ranking #no02 .ttl-wrap:before {
	background: url("../images/no02.png") 0 0 no-repeat;
	background-size: 100% auto;
}
.h-ranking #no03 .ttl-wrap:before {
	background: url("../images/no03.png") 0 0 no-repeat;
	background-size: 100% auto;
}
.h-ranking #no04 .ttl-wrap:before {
	background: url("../images/no04.png") 0 0 no-repeat;
	background-size: 100% auto;
}
.h-ranking #no05 .ttl-wrap:before {
	background: url("../images/no05.png") 0 0 no-repeat;
	background-size: 100% auto;
}
.h-ranking .ttl-wrap .h-name {
	display: table-cell;
	vertical-align: middle;
	color: #fff;
}
.h-ranking .ttl-wrap .h-name .h-eng {
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 15px;
}
.h-ranking .ttl-wrap .h-name h3 {
	font-size: 40px;
	letter-spacing: -0.08em;
	line-height: 1;
}
.h-ranking .ttl-wrap02 .h-name h3 {
	line-height: 1.2em;
}
.h-ranking .ttl-wrap .btn-box {
	display: table-cell;
	vertical-align: middle;
	width: 300px;
}
.h-ranking .ttl-wrap .btn-box .btn a {
	box-sizing: border-box;
	font-size: 16px;
	line-height: 1.3em;
	border: 2px solid #fff;
	padding: 15px 20px;
}
.h-ranking .ttl-wrap .btn-box .btn a.t-left {
	text-align: left;
}

/*---------- box-inner ----------*/
.h-ranking .box-inner {
	background: #fff;
	box-sizing: border-box;
	padding: 30px 45px 70px;
}

/*---------- slider  ----------*/
#main .slider {
	width: 100%;
	height: 500px;
	max-height: 500px;
}
#main .slider .photo {
	margin: 0 5px;
	position: relative;
}
#main .slider img {
	width: 100%;
	height: 500px;
	max-height: 500px;
}
#main .slider .s-caption {
	position: absolute;
	bottom: 0;
	background: rgba(0,0,0,0.55);
	width: 100%;
	box-sizing: border-box;
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	padding: 20px 20px;
}
#main button {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
#main .slide-arrow {
  position: absolute;
	top: 50%;
	width: 44px;
	height: 44px;
	margin-top: -22px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	cursor: pointer;
	z-index: 999;
}
#main .prev-arrow {
	left: 40px;
	-webkit-transform: rotate(-135deg);
	transform: rotate(-135deg);
}
#main .next-arrow {
	right: 40px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

/*---------- area01 ----------*/
.h-ranking .area01 {
	margin-top: 35px;
}
.h-ranking .area01 .left,
.h-ranking .area01 .right {
	width: 48%;
}
.h-ranking .area01 h4 {
	color: #002d9f;
	text-align: center;
	font-size: 22px;
	line-height: 1.3em;
	border-top: 2px solid #002d9f;
	border-bottom: 2px solid #002d9f;
	padding: 15px 0;
}
.h-ranking .area01 .txt {
	margin-top: 15px;
}

/* h-info */
.h-info table {
	width: 100%;
	box-sizing: border-box;
}
.h-info tr {
	line-height: 34px;
}
.h-info th {
	vertical-align: middle;
	background: #e4ecff;
	width: 25%;
	border-bottom: 2px solid #fff;
	font-size: 16px;
	font-weight: bold;
	padding: 0 10px;
}
.h-info td {
	vertical-align: middle;
	padding: 0 20px;
}
.h-info td.rank {
	color: #f4d70c;
	font-size: 25px;
}
.h-info td.location {
	font-size: 18px;
	font-weight: bold;
	line-height: 1.3em;
}

/* facility */
.facility {
	margin-top: 15px;
}
.facility li {
	background: #6ad5c5;
	width: 33%;
	box-sizing: border-box;
	color: #fff;
	text-align: center;
	font-size: 15px;
	line-height: 30px;
	border-radius: 2px;
	padding: 5px 5px;
	position: relative;
}
.facility li span {
  display: block;
	font-weight: bold;
  border: 1px solid #fff;
	border-radius: 2px;
}

/* rec-icon */
.rec-icon {
	margin-top: 10px;
}
.rec-icon dl {
	display: table;
	width: 100%;
	box-sizing: border-box;
	border: 2px solid #e4ecff;
}
.rec-icon dt {
	display: table-cell;
	vertical-align: middle;
	background: #e4ecff;
	width: 35%;
	height: 70px;
	box-sizing: border-box;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
}
.rec-icon dd {
	display: table-cell;
	vertical-align: middle;
	box-sizing: border-box;
	padding: 10px 10px;
}
.rec-icon dd ul {
	display: table;
	border-collapse: separate;
  border-spacing: 8px 0;
	width: 100%;
	height: 50px;
}
.rec-icon dd li {
	display: table-cell;
	vertical-align: middle;
	box-sizing: border-box;
	width: 25%;
	border-radius: 4px;
	color: #fff;
	text-align: center;
	font-size: 13px;
	font-weight: bold;
	line-height: 1.3em;
	margin-right: 10px;
}

/*---------- area02 ----------*/
.h-ranking .area02 {
	margin-top: 40px;
}
/* reviews */
.reviews dl {
	display: table;
	width: 100%;
}
.reviews dt {
	display: table-cell;
	vertical-align: middle;
	background: #e4ecff;
	width: 12%;
	text-align: center;
	font-size: 17px;
	font-weight: bold;
}
.reviews dd {
	margin-left: 30px;
}
.reviews dd li {
	border-bottom: 2px dotted #a9a9a6;
	text-align: justify;
	font-size: 14px;
	padding: 20px 0;
}
.reviews dd li:last-child{
	border-bottom: none;
}

/*---------- area03 ----------*/
.h-ranking .area03 {
	margin-top: 45px;
}

/* ttl-box02 */
.h-ranking .area03 .ttl-box02 .tl02 {
	color: #ff586b;
	font-size: 26px;
	padding: 0 30px;
}
.h-ranking .area03 .ttl-box02 .tl02:before,
.h-ranking .area03 .ttl-box02 .tl02:after {
	width: 30px;
	height: 2px;
	background-color: #ff586b;
}

/* btn-box */
.h-ranking .area03 .btn-box {
	width: 714px;
	margin: 15px auto 0;
}
.h-ranking .area03 .btn-box .btn a {
	border-radius: 4px;
	font-size: 25px;
	line-height: 90px;
}
.h-ranking .area03 .btn-box .btn a:after {
	right: 40px;
	width: 12px;
	height: 12px;
	margin-top: -6px;
}
.h-ranking .area03 .btn-box .btn span {
	font-weight: bold;
}
.h-ranking .area03 .btn-box .btn span.fs01 {
	font-size: 46px;
}
.h-ranking .area03 .btn-box .btn span.fs02 {
	font-size: 29px;
}

@media screen and (max-width: 768px) {
	.h-ranking {
		padding: 0 15px;
	}
	.h-ranking .block {
		padding-top: 70px;
	}

	/*---------- ttl-wrap ----------*/
	.h-ranking .ttl-wrap {
		display: block;
		background: url("../images/ttl-bg03.jpg") center 0 no-repeat;
		background-size: auto 100%;
		height: auto;
		padding: 20px 15px 15px 15px;
	}
	.h-ranking .ttl-wrap02 {
		background: url("../images/ttl-bg03.jpg") center 0 no-repeat;
		background-size: auto 100%;
		height: auto;
	}
	.h-ranking .ttl-wrap:before {
		top: -45px;
		left: -15px;
	}
	.h-ranking #no01 .ttl-wrap:before {
		background: url("../images/no01.png") 0 0 no-repeat;
		background-size: 50% auto;
	}
	.h-ranking #no02 .ttl-wrap:before {
		background: url("../images/no02.png") 0 0 no-repeat;
		background-size: 50% auto;
	}
	.h-ranking #no03 .ttl-wrap:before {
		background: url("../images/no03.png") 0 0 no-repeat;
		background-size: 50% auto;
	}
	.h-ranking #no04 .ttl-wrap:before {
		background: url("../images/no04.png") 0 0 no-repeat;
		background-size: 50% auto;
	}
	.h-ranking #no05 .ttl-wrap:before {
		background: url("../images/no05.png") 0 0 no-repeat;
		background-size: 50% auto;
	}
	
	.h-ranking .ttl-wrap .h-name {
		display: block;
		vertical-align: inherit;
	}
	.h-ranking .ttl-wrap .h-name .h-eng {
		font-size: 3vw;
		margin-bottom: 5px;
	}
	.h-ranking .ttl-wrap .h-name h3 {
		font-size: 5.2vw;
		line-height: 1.2em;
	}
	.h-ranking .sp-btn .btn-box {
		display: block;
		vertical-align: inherit;
		width: 100%;
	}
	.h-ranking .sp-btn .btn-box .btn a {
		color: #002d9f;
		font-size: 13px;
		border: 2px solid #002d9f;
		padding: 10px 0;
	}
	.h-ranking .sp-btn .btn-box .btn a:after {
		border-top: solid 2px #002d9f;
		border-right: solid 2px #002d9f;
	}
	.h-ranking .sp-btn .btn-box .btn a.t-left {
		text-align: center;
	}
	
	/*---------- box-inner ----------*/
	.h-ranking .box-inner {
		padding: 20px 15px 30px;
	}

	/*---------- slider  ----------*/
	#main .slider {
		height: auto;
		max-height: auto;
		margin-top: 20px;
	}
	#main .slider .photo {
		margin: 0 0;
	}
	#main .slider img {
		height: auto;
		max-height: auto;
	}
	#main .slider .s-caption {
		font-size: 13px;
		padding: 10px 10px;
	}
	#main .slide-arrow {
		width: 20px;
		height: 20px;
		margin-top: -10px;
	}
	#main .prev-arrow {
		left: 10px;
	}
	#main .next-arrow {
		right: 10px;
	}

	/*---------- area01 ----------*/
	.h-ranking .area01 {
		margin-top: 30px;
	}
	.h-ranking .area01 .left,
	.h-ranking .area01 .right {
		width: 100%;
	}
	.h-ranking .area01 .right {
		margin-top: 20px;
	}
	.h-ranking .area01 h4 {
		font-size: 4.5vw;
		padding: 10px 0;
	}
	.h-ranking .area01 .txt {
		margin-top: 10px;
	}

	/* h-info */
	.h-info th {
		width: 28%;
		font-size: 3vw;
		padding: 0 0;
	}
	.h-info td {
		padding: 0 10px;
	}
	.h-info td.rank {
		font-size: 16px;
	}
	.h-info td.location {
		font-size: 13px;
		line-height: 1.3em;
	}

	/* facility */
	.facility ul {
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.facility li {
		width: 49%;
		font-size: 13px;
		line-height: 25px;
		margin-bottom: 2%;
	}

	/* rec-icon */
	.rec-icon dl {
		display: block;
	}
	.rec-icon dt {
		display: block;
		vertical-align: inherit;
		width: 100%;
		height: 35px;
		line-height: 35px;
		font-size: 15px;
	}
	.rec-icon dd {
		display: block;
		vertical-align: inherit;
		padding: 10px 5px;
	}
	.rec-icon dd ul {
		border-spacing: 5px 0;
		height: 40px;
		text-align: center;
	}
	.rec-icon dd li {
		font-size: 10px;
	}

	/*---------- area02 ----------*/
	.h-ranking .area02 {
		margin-top: 30px;
	}
	/* reviews */
	.reviews dl {
		display: block;
	}
	.reviews dt {
		display: block;
		vertical-align: inherit;
		width: 100%;
		font-size: 15px;
		line-height: 35px;
	}
	.reviews dd {
		margin-left: 0;
	}
	.reviews dd li {
		font-size: 13px;
		padding: 15px 0;
	}

	/*---------- area03 ----------*/
	.h-ranking .area03 {
		margin-top: 20px;
	}

	/* ttl-box02 */
	.h-ranking .area03 .ttl-box02 .tl02 {
		font-size: 17px;
		line-height: 1.3em;
		padding: 0 10%;
	}

	/* btn-box */
	.h-ranking .area03 .btn-box {
		width: 100%;
		margin: 10px auto 0;
	}
	.h-ranking .area03 .btn-box .btn a {
		font-size: 18px;
		line-height: 1.5em;
		padding: 10px 0;
	}
	.h-ranking .area03 .btn-box .btn a:after {
		right: 5%;
		width: 6px;
		height: 6px;
		margin-top: -3px;
	}
	.h-ranking .area03 .btn-box .btn span.fs01 {
		font-size: 28px;
	}
	.h-ranking .area03 .btn-box .btn span.fs02 {
		font-size: 20px;
	}
}


/*------------------------------------------------------------
  rec-ranking
------------------------------------------------------------*/
.rec-ranking {
	background: url("../images/bg04.jpg") center center no-repeat;
	background-size: cover;
	padding: 0 0 70px;
	margin-top: 200px;
}
.rec-ranking h3 {
	width: 198px;
	margin: auto;
}
.rec-ranking h3 img {
	margin: -97px auto 0;
	position: relative;
}
.rec-ranking h4 {
	background: url("../images/ttl-bg04.png") center 0 no-repeat;
	background-size: 100% auto;
	box-sizing: border-box;
	width: 1100px;
	height: 92px;
	color: #002d9f;
	text-align: center;
	font-size: 28px;
	margin: auto;
	padding-top: 24px;
}
.rec-ranking .box {
	margin-top: 40px;
}

/*---------- btn-box ----------*/
.rec-ranking .btn-box {
	margin-top: 15px;
}
.rec-ranking .btn-box li {
	width: 24%;
	margin-bottom: 1%;
}
.rec-ranking .btn-box .btn a {
	font-size: 18px;
	padding: 15px 0;
}
.rec-ranking .btn-box .btn a span {
	font-size: 14px;
}
.rec-ranking .btn-box .btn a:after {
	width: 8px;
	height: 8px;
	margin-top: -4px;
}

@media screen and (max-width: 768px) {
	.rec-ranking {
		padding: 0 15px 40px;
		margin-top: 100px;
	}
	.rec-ranking h3 {
		width: 30%;
	}
	.rec-ranking h3 img {
		margin: -40% auto 0;
	}
	.rec-ranking h4 {
		background: url("../images/ttl-bg04.png") center 0 no-repeat;
		background-size: auto 100%;
		width: 100%;
		height: auto;
		font-size: 4.5vw;
		padding-top: 18%;
		position: relative;
	}
	.rec-ranking h4 span {
		position: absolute;
		top: 23%;
		left: 0;
		right: 0;
	}
	.rec-ranking .box {
		margin-top: 25px;
	}

	/*---------- btn-box ----------*/
	.rec-ranking .btn-box {
		margin-top: 15px;
	}
	.rec-ranking .btn-box ul {
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.rec-ranking .btn-box li {
		width: 49%;
		margin-bottom: 2%;
	}
	.rec-ranking .btn-box .btn a {
		font-size: 3vw;
		padding: 10px 0;
	}
	.rec-ranking .btn-box .btn a span {
		font-size: 2.8vw;
	}
	.rec-ranking .btn-box .btn a:after {
		width: 4px;
		height: 4px;
		margin-top: -2px;
	}
}

/*------------------------------------------------------------
  to-top
------------------------------------------------------------*/
.to-top {
	padding: 25px 0;
}
.to-top p {
	text-align: center;
	font-size: 17px;
	font-weight: bold;
	line-height: 1.8em;
}
.to-top p a {
	display: inline-block;
}

@media screen and (max-width: 768px) {
	.to-top {
		padding: 20px 15px;
	}
	.to-top p {

		font-size: 16px;
		line-height: 1.6em;
	}
}


/*------------------------------------------------------------
  p-top
------------------------------------------------------------*/
.page_top {
  width: 60px;
  height: 60px;
  position: fixed;
  right: 30px;
  bottom: 30px;
  z-index: 9999;
}
.page_top a {
	display: block;
	width: 100%;
	height: 100%;
	background: #002d9f;
	border: solid 1px #fff;
	color: #fff;
	position: relative;
}
.page_top a::before {
	display: block;
	content: '';
	width: 12px;
	height: 12px;
	margin: -4px 0 0 -6px;
	border-top: 2px solid #fff;
	border-left: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);	
	position: absolute;
	top: 50%;
	left: 50%;
}

@media screen and (max-width: 640px) {
	.page_top {
		width: 45px;
		height: 45px;
		right: 15px;
		bottom: 50px;
	}
	.page_top a::before {
		width: 8px;
		height: 8px;
		margin: -4px 0 0 -4px;
	}
}





/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
  スライドショー  slick
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.slick-list
{	
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}
.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
	
		max-width: 100%;
    height: auto;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}