@charset "utf-8";
/*===========================
add
===========================*/

/* 基本カラー  */

.fcBasic {
	color:#113783;
}

.fcBasic2 {
	color:#ef454e;
}




/*---------------*/
/***** Roxy *****/
/*---------------*/

/* Common style */
.grid figure {
	position: relative;
	overflow: hidden;
	background: #3085a3;
	text-align: center;
	cursor: pointer;
}

.grid figure img {
	position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
}

.grid figure figcaption {
	box-sizing: border-box;
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/*---------------*/
/***** Roxy *****/
/*---------------*/

/* Common style */
.grid figure {
	position: relative;
	overflow: hidden;
	background: #3085a3;
	text-align: center;
	cursor: pointer;
}

.grid figure img {
	position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
}

.grid figure figcaption {
	box-sizing: border-box;
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/* Roxy  */


.f-roxy {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.f-roxy1-3 {
	box-sizing: border-box;
	width: 33.3%;
}

figure.effect-roxy {
	background:rgba(255,255,255,1);
}

figure.effect-roxy figcaption::before {
	position: absolute;
	top: 30px;
	right: 20px;
	bottom: 30px;
	left: 30px;
	/*
	border: 1px solid #d3d3d3;
	*/
	border-left:2px solid #d3d3d3;
	border-bottom:2px solid #d3d3d3;
	/*
	background:rgba(234,234,234,.8);
	*/
	content: '';
	opacity: 1;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-20px,0,0);
	transform: translate3d(0px,0,0);
}
figure.effect-roxy figcaption::after{
    content: '';
    /*絶対配置で矢印の位置を決める*/
  position: absolute;
    bottom:35px;
    right:20px;
    /*矢印の形状*/    
    width: 14px;
    height:1px;
    transform: rotate(35deg);
    /*アニメーションの指定*/
  background:#fff;
    /*アニメーションの指定*/
    transition: all .3s;
	z-index: 5;
	
}
figure.effect-roxy:hover figcaption::before {
	background:rgba(234,234,234,.8);
}

figure.effect-roxy figcaption {
	padding: 0;
	text-align: center;
}

figure.effect-roxy figcaption p {
	padding:0;
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	height:100%;
	position:relative;

}
figure.effect-roxy {
	position:relative;    
}
figure.effect-roxy:before {
  position: absolute; 
  bottom:34px;
  right:42px;
  font-family: 'Noto Serif Japanese';
  font-size:0.9em;
  opacity:1;
  z-index:9;
  color:#fff;
	-webkit-font-smoothing: antialiased;
	transform: rotate(0.03deg);
    -moz-transform: rotate(0.03deg);
    -ms-transform: rotate(0.03deg);
    -o-transform: rotate(0.03deg);
    -webkit-transform: rotate(0.03deg);
	font-weight: 400;
	line-height: 1.6;
	text-shadow: 0 0 1px #333, 0 0 2px #333, 0 0 4px #333, 0 0 6px #333, 0 0 8px #333, 0 0 10px #333, 0 0 12px #333;

}
figure.effect-roxy.efry-01:before {
    content: 'アクセス \A access';
    white-space: pre;
}
figure.effect-roxy.efry-02:before {
  content: 'お部屋 \A guest room';
    white-space: pre;
}
figure.effect-roxy.efry-03:before {
  content: 'お風呂  \A bath';
      white-space: pre;
}
figure.effect-roxy.efry-04:before {
  content: 'お食事処 \A restaurant';
      white-space: pre;
}
figure.effect-roxy.efry-05:before {
  content: '宿泊料金 \A room charge';
      white-space: pre;
}
figure.effect-roxy.efry-06:before {
  content: 'ご予約 \A reservation';
      white-space: pre;
}

figure.effect-roxy:hover::before {
  content:'';
}

figure.effect-roxy figcaption p img{
	height:auto;
	width:60%;
}

figure.effect-roxy h2 {
	padding: 30% 0 10px 0;
}

figure.effect-roxy p {
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-10px,0,0);
	transform: translate3d(-10px,0,0);
}

figure.effect-roxy:hover img {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect-roxy:hover figcaption::before,
figure.effect-roxy:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}




figure {
    margin: 0;
}
.grid a {
	display:block;
}

.figure {
	display:inline-block
}
.figure-img {
margin-bottom:.5rem;
	line-height:1
}
.figure-caption {
	font-size:90%;
	color:#868e96
}

@media screen and (max-width: 768px) {
	figure.effect-roxy.efry-01:before {
  content: '';
}
figure.effect-roxy.efry-02:before {
  content: '';
}
figure.effect-roxy.efry-03:before {
  content: '';
}
figure.effect-roxy.efry-04:before {
  content: '';
}
figure.effect-roxy.efry-05:before {
  content: '';
}
figure.effect-roxy.efry-06:before {
  content: '';
}
	/* figure.effect-roxy figcaption {
		padding: 2em 3em;
		text-align: left;
	} */
	figure.effect-roxy figcaption::after{
    width: 0px;
    height:0px;
	
}


	figure.effect-roxy figcaption p{
		padding-top:0px;
	}

	figure.effect-roxy img {
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
	}

	figure.effect-roxy figcaption::before,
	figure.effect-roxy p {
		opacity: 1;
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
	}
	figure.effect-roxy figcaption::before {
    position: absolute;
    top: 30px;
    right: 30px;
    bottom: 30px;
    left: 30px;
    border: 1px solid #d3d3d3; 
    background: rgba(234,234,234,.8);
    content: '';
    opacity: 1;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(-20px,0,0);
    transform: translate3d(0px,0,0);
}

}


@media screen and (max-width: 600px) {
	
	/* figure.effect-roxy figcaption {
		padding: 3em;
		text-align: left;
	} */

	/* figure.effect-roxy figcaption p{
		padding-top:50px;
	} */
	.f-roxy1-3 {
		box-sizing: border-box;
		width: 100%;
	}
}

.productImg {
	box-sizing: border-box;
	width:50%;
	margin:0 auto 5px auto;
}

.productC {
	text-align:center;
	font-size:1.1em;
	color:#FB6D31;
	margin-bottom:5px;
	font-weight:bold;
}

@media screen and (max-width: 600px) {
	
.productImg {
	width:70%;
}

}

/* index */

.box-8 {
    background-color: #f7b434;
    border: 1px solid #e29a27;
    box-shadow: 1px 1px 0 rgba(255, 255, 255, .4) inset,
                0 0 4px rgba(255, 255, 255, .8) inset,
                2px 2px 2px rgba(0, 0, 0, .4);
    color: #fff;
    margin: 0;
    padding: 1em;
}
.box-8 p {
	font-size: 1.3em;
	text-align:center;
}

.txtPlus {
	font-size:3em;
	text-align:center;
	font-weight:bold
}


/* 画像とテキストを交互に表示画像バージョン */


.contents-wrap {
	display: -webkit-box; /*Android4.3*/
	display: -moz-box;    /*Firefox21*/
	display: -ms-flexbox; /*IE10*/
	display: -webkit-flex; /*PC-Safari,iOS8.4*/
	display: flex;
	-webkit-box-pack: justify; /*Android4.3*/
	-moz-box-pack: justify;    /*Firefox21*/
	-ms-flex-pack: justify;    /*IE10*/
	-webkit-justify-content: space-between; /*PC-Safari,iOS8.4*/
	justify-content: space-between;
    background-color: rgba(252, 252, 252, 0.92);
}
.contents-wrap:nth-child(odd) {
	-ms-flex-direction:row-reverse; /*IE10*/
	-webkit-flex-direction:row-reverse; /*old webkit browser*/
	flex-direction:row-reverse;
}
.contents-text {
	width: 50%; /*flex: 2;*/
    /* flex: 2; */
    padding: 28px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #333;	
}
.contents-img {
	width: 50%; /*flex: 1;*/
}
.contents-text h3 {/* 要調整 */
	font-size: 2em;
	line-height: 1.3em;
	text-align: center;
	margin-bottom: .5em;
	color:var(--color-main-d);
	text-align:left;
	text-shadow:none;
	font-weight:bold;
}
.contents-text h3::after {/* 要調整 */
 content: none;
}
.contents-text-catch {
    margin: 0 auto 20px;
    text-align: center;
    display: inline-block;
    font-size: 1.5rem;
    line-height: 1.125em;
    font-family: 'Noto Sans Japanese';
    font-weight: 400;
    border-bottom: 4px solid #62c0b5;
    padding-bottom: 8px;
}
.contents-img img {
	display: block;
	width: auto;
	max-width: 100%;
	border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}
@media screen and (max-width: 768px) {
.contents-wrap, .contents-wrap:nth-child(odd) {
	-ms-flex-direction:row-reverse; /*IE10*/
	-webkit-flex-direction:row-reverse; /*old webkit browser*/
	flex-direction: column-reverse;
	padding: 20px 0 0;
}
.contents-wrap:last-child{
	padding-bottom: 20px;	
}
.contents-text, .contents-img {
	width: 100%; /*flex: 1;*/
	margin-bottom:50px;
}
.contents-text{
	padding:0 20px;
	margin-bottom:20px;
}
.contents-text h3 {
	font-size: 1.3em;
}
}

/* txt */
.txt2 {
   font-size:1.2rem;
   font-weight:800;
}
.txtbold {
   font-weight:bold;
}
.tx-center {
   text-align:center
}
.tx-left {
   text-align:left;
}
.tx-right {
   text-align:right;
}
.tx_marker {
   background:linear-gradient(transparent 75%, #fff799 75%);
   font-weight:bold;
   display:inline;
}
/* color */

.red {
	color: #bc2d2d;
}
.green {
	color: #3b7a28;
}
.brown {
	color: #a67435;
}
.blue {
	color: #325f99;
}
.catchcopy {
    font-size: 2rem;
    font-family: 'Noto Sans Japanese';
    font-weight: 400;
    line-height: 1.3em;
    color: #E0625E;
}
.catchcopy2 {
    font-size: 2.2rem;
    font-family: 'Noto Sans Japanese';
    font-weight: 600;
    line-height: 1.3em;
    color: #E0625E;
}
.col_red {
	color:#F33;
}
.col_green {
	color: #1a9651 !important;
}
.col_blue {
	color: #06C;
}
.col_orange {
	color: #F06000;
}
.tx-60p  {
	font-size:60% !important;
	letter-spacing:normal;
}
.tx-70p  {
	font-size:70% !important;
	letter-spacing:normal;
}	
.tx-80p  {
	font-size:80% !important;
	letter-spacing:normal;
}
.tx-90p  {
	font-size:90% !important;
	letter-spacing:normal;
}
.tx100p    {
	font-size:100% !important;
	letter-spacing:normal;
}
.tx-110p {
    font-size: 110% !important;
	letter-spacing:normal;
}
.tx-120p    {
	font-size:120% !important;
	letter-spacing:normal;
}
.tx-130p    {
	font-size:130% !important;
	letter-spacing:normal;
}
.tx-140p    {
	font-size:140% !important;
	letter-spacing:normal;
	line-height:1.4em;
}
.tx-150p    {
	font-size:150% !important;
	letter-spacing:normal;
}
.tx-160p    {
	font-size:160% !important;
	letter-spacing:normal;
}
.tx-170p    {
	font-size:170% !important;
	letter-spacing:normal;
}
.tx-180p    {
	font-size:180% !important;
	letter-spacing:normal;
}
.tx-230p    {
	font-size:230% !important;
	letter-spacing:normal;
}
.tx-300p    {
	font-size:300% !important;
	letter-spacing:normal;
}
.mar0 {
    margin:0 auto;
}
.txsize1 {
   font-size:1.2rem;
   font-weight:800;
   color:#F33;
   text-align:center;
}
.txtstyle1 {
	font-size: 1.16em;
	font-weight: bold;
}
.txtstyle2 {
	font-size: 1.24em;
	font-weight: bold;
}
.ex {
    padding-left:1em;
    text-indent:-1em;
}

@media only screen and (max-width: 768px) {
.tx-230p {
    font-size: 120% !important;
    letter-spacing: normal;
}
.tx-180p {
    font-size: 110% !important;
    letter-spacing: normal;
}	


}


@media only screen and (max-width: 600px) {
.line-h2 {
    line-height: 1.5;
}
.tx-230p {
    font-size: 130% !important;
    letter-spacing: normal;
}
.tx-180p,.tx-170p {
    font-size: 120% !important;
    letter-spacing: normal;
}
.tx-160p,.tx-150p {
    font-size: 110% !important;
    letter-spacing: normal;
}
.tx-140p,.tx-130p,.tx-120p,.tx-110p {
    font-size: 100% !important;
    letter-spacing: normal;
}
}
.flex {
    display: flex;
    justify-content: space-between;
    align-items: start;
    flex-wrap: wrap;
}
.flex-2col {
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:5%;
}
.flex-2col > li{
  width:47.5%;
  margin:2% 0% 0 0%; 
}
.flex-2col > li:nth-of-type(odd){
  width:47.5%;
  margin:2% 0% 0 0%; 
}
.flex-2col > li:nth-of-type(even){
  width:47.5%;
  margin:2% 0 0 0%;
}
.flex-2col-start {
  display:flex;
  justify-content:start;
  align-items:start;
  flex-wrap:wrap;
  gap:5%;
}
.flex-2col-start > li{
  width:47.5%;
  margin:2% 0 0 0%; 
}
.flex-2col-start > li:nth-of-type(odd){
  width:47.5%;
  margin:2% 0% 0 0%; 
}
.flex-2col-start > li:nth-of-type(even){
  width:47.5%;
  margin:2% 0% 0 0%; 
}
.flex-list2 {
  width:17.5% !important;
  margin:0 0 0 0% !important;  
}
.flex-list3 {
  width:27.5% !important;
  margin:0 0 0 0% !important;   
}
.flex-list4 {
  width:37.5% !important;
  margin:0 0 0 0% !important;  
}
.flex-list5 {
  width:47.5% !important;
  margin:0% 1% 0 0% !important;  
}
.flex-list6 {
  width:57.5% !important;
  margin:0 0 0 0% !important;   
}
.flex-list7 {
  width:67.5% !important;
  margin:0 0 0 0% !important;  
}
.flex-list8 {
  width:77.5% !important;
  margin:0 0 0 0% !important;  
}
.flex-list9 {
  width:87.5% !important;
  margin:0 0 0 0% !important;  
}
.flex-3col {
  display:flex;
  justify-content:start;
  align-items:start;
  flex-wrap:wrap;
  gap:5%;
}
.flex-3col > li{
  width:30%;
  margin:2% 0 0 0%;
}
.flex-reverse {
	flex-direction: row-reverse;
}
@media only screen and (max-width: 768px) {
.flex-2col > li,.flex-2col-start > li{
  width:100% !important;
  margin:2% auto 8% !important; 
}
.flex-3col > li{
  width:100%;
  margin:2% auto 8% !important; 
}
.flex-list2,.flex-list3,.flex-list4,.flex-list5,.flex-list6,.flex-list7,.flex-list8,.flex-list9 {
  width:100% !important;
  margin:2% auto 8% !important;  
}

}
.box-sd {
    padding: 2rem 2rem 1.6rem;
    background-color: #fff;
    border: 1px solid #999;
    box-sizing: border-box;
}
.box-sd02 {
    padding: 3rem;
    background-color: #fff;
    border: 1px solid #999;
    box-sizing: border-box;
	box-shadow: 0px 1px 3px 0px rgb(0 0 0 / 10%), 0px 3px 15px 0px rgb(0 0 0 / 8%), 0px 5px 28px 0px rgb(0 0 0 / 6%);
}
.box-sd03 {
    padding: 3rem 3rem 2rem 3rem;
    background-color: #f2f2f2;
    color: #333;
    border: 0px solid #999;
    box-shadow: 0px 1px 3px 0px rgb(0 0 0 / 10%), 0px 3px 15px 0px rgb(0 0 0 / 8%), 0px 5px 28px 0px rgb(0 0 0 / 6%);
    box-sizing: border-box;
}

@media only screen and (max-width: 768px) {
.box-sd,.box-sd02,.box-sd03 {
    padding: 1.2rem;
    box-sizing: border-box;
}

}
.wrap-h2 {
  width:96%;
  margin:3% auto 6%;
}
.wrap-h3 {
  width:96%;
  margin:3% auto 6%;
}
.wrap-h4 {
  width:96%;
  margin:3% auto 6%;
}
@media only screen and (max-width: 768px) {
.wrap-h2 {
  width:100%;
  margin:3% auto;
}
.wrap-h3 {
  width:100%;
  margin:3% auto;
}
.wrap-h4 {
  width:100%;
  margin:3% auto;
}
}

.btn-b a {
    text-decoration: none;
    text-align: center;
    color: #06C !important;
    position: relative;
    display: inline-block;
    padding: 0.2em 1.8em 0.2em 1em;
    line-height: 30px;
    background: #fff;
	border:1px solid #06C;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    transition: all .3s;
    -webkit-transition: all .3s;
	width:auto;
    -webkit-transition: all .3s;
}
.btn-b a::after {
	position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    right: 2%;
    box-sizing: border-box;
    width: 4px;
    height: 4px;
    border: 4px solid transparent;
}
.btn-b a::after {
    border-left: 4px solid #06C;
}
.btn-b a:hover {
    opacity:0.7;
}

ul.circle {
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;	
}
ul.circle > li {
    padding: 0 0 0.5em 1.2em;
    margin-bottom: 0.7em;
    border-bottom: 1px dashed #CCC;
    width:98%;
    margin-right:0%;
    position: relative;
}
ul.circle > li:last-child {
	margin-bottom:0px;
}
ul.circle > li:before {
    position: absolute;
    content: "";
    width: 6px;
    height: 6px;
    background-color: #222;
    border-radius: 50%;
    left: 0.5em;
    margin-top: 0.8em;
}

ul.circle-2col {
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;	
}
ul.circle-2col > li {
    padding: 0 0 0.5em 1.2em;
    margin-bottom: 0.9em;
    border-bottom: 1px dashed #CCC;
    width:43%;
	font-size:1.0em;
	font-weight: 600;
    margin-right:2%;
    position: relative;
}
ul.circle-2col > li.line {
	margin-bottom:0px;
}


ul.circle-2col > li.long {
    width:70%;
}
ul.circle-2col > li:before {
    position: absolute;
    content: "";
    width: 6px;
    height: 6px;
    background-color: #222;
    border-radius: 50%;
    left: 0.5em;
    margin-top: 0.8em;
}

ul.circle-3col {
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;	
}
ul.circle-3col > li {
    padding: 0 0 0.5em 1.2em;
    margin-bottom: 0.7em;
    border-bottom: 1px dashed #CCC;
    width:28%;
    margin-right:2%;
    position: relative;
}
ul.circle-3col > li.long {
    width:70%;
}
ul.circle-3col > li:before {
    position: absolute;
    content: "";
    width: 6px;
    height: 6px;
    background-color: #222;
    border-radius: 50%;
    left: 0.5em;
    margin-top: 0.9em;
}
ul.circle-4col {
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;	
}
ul.circle-4col > li {
    padding: 0 0 0.5em 1.2em;
    margin-bottom: 0.7em;
    border-bottom: 1px dashed #CCC;
    width:auto;
    margin-right:2%;
    position: relative;
}
ul.circle-4col > li:before {
    position: absolute;
    content: "";
    width: 6px;
    height: 6px;
    background-color: #222;
    border-radius: 50%;
    left: 0.5em;
    margin-top: 0.9em;
}

@media only screen and (max-width: 768px) {
  ul.circle-2col > li,ul.circle-2col > li.long,ul.circle-3col > li,ul.circle-4col > li {
    width:98%;
	margin-right:0%;
}
ul.circle-2col > li.line.line2 {
	margin-bottom:0.9em;
}
}
.h2-ttl {
   font-size:2.3em;
   margin-bottom:0px;
   line-height:1.4;
   font-weight: 600;
}
.h2-ttl.h2-ttl02 {
   font-size:2.0rem;
   line-height:1.6em;
   margin-bottom:0.5em;
}
.sub-ttl {
   font-size:1.1rem;

   color:var(--color-main-l);
   text-align:center;
   margin-bottom:30px;
}


.center-l {
    overflow: hidden;
    text-align: center;
    margin-bottom: 30px;
}
.center-l span {
  position: relative;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 1em;
  text-align: left;
}
.center-l span::before,
.center-l span::after {
  position: absolute;
  top: 50%;
  content: '';
  width: 400%;
  height: 1px;
  background-color: #005bac;
}
.center-l span::before {
  right: 100%;
}
.center-l span::after {
  left: 100%;
}
.head-border {
    display: flex;
    align-items: center;
}
.head-border:before,
.head-border:after {
    content: "";
    height: 1px;
    flex-grow: 1;
    background-color: #666;
}
 
.head-border:before {
    margin-right: 2rem;
}
 
.head-border:after {
    margin-left: 2rem;
}
@media only screen and (max-width: 768px) {
.h2-ttl {
   font-size:1.6em;
   line-height:1.2em;
   margin-bottom:0.1em;
}
.h2-ttl.h2-tll-add {
    font-size:1.3em;
}
.h2-ttl.h2-ttl02 {
   font-size:1.3rem;
   line-height:1.6em;
   margin-bottom:0.5em;
}
.center-l {
    margin-bottom: 10px;
}
.sub-ttl {
   font-size:0.9rem;
	margin-bottom: 20px;
}
 .center-l span {
	text-align: center;
    margin: 0 2.5em;
    padding: 0 0.2em;
}
	.center-l span::before,
.center-l span::after {
  width: 50%;
}
.center-l span::before {
  right: 100%;
}
.center-l span::after {
  left: 100%;
}
	.head-border:before {
    margin-right: 1rem;
}
 
.head-border:after {
    margin-left: 1rem;
}
}


.img-border {
  display: inline-block;
  padding: 1px;
  background: #fff;
	box-shadow: 1px 0px 5px #bbbbbb;
}

.wide-container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
@media only screen and (max-width: 767px) {
  .wide-container {
    width: 98%;
	box-sizing:border-box;
	  padding-right: 5px;
    padding-left: 5px;
    margin-right: auto;
    margin-left: auto;
}
}
.feature-txt {
	padding: 4.6rem 4.6rem 5rem 4.6rem;
    background-color: rgba(244,244,244,0.9);
	color:#333;
    border: 0px solid #999;
	box-shadow: 
		0px 1px 3px 0px rgba(0, 0, 0, .1), 
		0px 3px 15px 0px rgba(0, 0, 0, .08), 
		0px 5px 28px 0px rgba(0, 0, 0, .06);
    box-sizing: border-box;
	width:500px;
	height:auto;
	word-break: break-word;
	position:relative;
	z-index:100;

}
.feature-txt-center {
	padding: 5rem 5rem 6rem 5rem;
    background-color: rgba(244,244,244,0.8);
	color:#333;
    border: 0px solid #999;
	box-shadow: 
		0px 1px 3px 0px rgba(0, 0, 0, .1), 
		0px 3px 15px 0px rgba(0, 0, 0, .08), 
		0px 5px 28px 0px rgba(0, 0, 0, .06);
    box-sizing: border-box;
	width: 100%;
	height:auto;
	word-break: break-word;
	position:relative;
	z-index:100;
}
.feature-txt-center .p-ttl {
	font-size:1.6em;
}
.feature-txt.rgt {
   position:relative;
   left:-5vw;
   margin-top:-5%;
}
.feature-txt.lft {
   position:relative;
   right:-5vw;
   margin-top:-5%;
}

.feature-txt h3 {
	    margin-bottom: 1em;
		font-size: 250%;
	    text-align: left !important;
		font-family: 'Noto Serif JP', serif;
		line-height:1.4;
	    position: relative;
	    font-weight: 600;
}
.feature-txt h3:after {
    content: '';
    position: absolute;
    bottom: -10px;
    display: inline-block;
    width: 140px;
    height: 2px;
    left: 70px;
    transform: translateX(-50%);
    background-color: #acacac;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
}
.Feature-Num {
    font-size: 70px;
    letter-spacing: 0;
    line-height: 1.4;
    margin-bottom: 6%;
    font-family: 'Noto Serif JP', serif;
    color: #004ba2;
    font-weight: 900;
    text-align: left !important;
}
.wrap-block-01 {
	    margin-top: 102px;
	margin-bottom: 52px;
	position: relative;
}

.wrap-block-01::before {
	top: -70px;
    height: calc(100% + 270px);
	width: 51.2%;
    right: 0;
    content: '';
    position: absolute;
    background-color: #fff;
    z-index: -1;
}

.wrap-block-02 {
	margin-top: 152px;
	margin-bottom: 152px;
	position: relative;
}
.wrap-block-02::before {
	    top: -152px;
    height: calc(100% + 152px);
	width: 51.2%;
    right: 0;
    content: '';
    position: absolute;
    background-color: #f7f4f4;
    z-index: -1;
}
.wrap-block-03 {
	margin-bottom: 152px;
	position: relative;
}
.wrap-block-03::before {
	    top: -308px;
    bottom: -96px;
    width: 100%;
    height: calc(100% + 404px);
    right: 0;
    content: '';
    position: absolute;
    background-color: #f7f4f4;
    z-index: -1;
}
.wrap-block-04 {
	margin-bottom: 52px;
    padding-bottom: 52px;
	position: relative;
}
.wrap-block-04::before {
	top: -152px;
    height: calc(100% + 52px);
	width:51.2%;
    content: '';
    position: absolute;
    background-color: #f7f4f4;
    z-index: -1;
}
.wrap-block-05 {
	margin-bottom: 152px;

	position: relative;
}
.wrap-block-05::before {
	top: -152px;
    height: calc(100% + 278px);
	width:51.2%;
    content: '';
    position: absolute;
    background-color: #f7f4f4;
	z-index: -1;
}
.feature-wrap {
	    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
	justify-content:center;
	-webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
	    margin-left: auto;
    margin-right: auto;
	max-width: 1670px;
	width: 90%;
	margin-bottom: 152px;
}
.feature-wrap.dw {
	 margin-bottom: 50px;
}
.feature-wrap-reverse {
    flex-direction: row-reverse;
}
.feature-img {
	overflow: hidden;
	position: relative;
	width:auto;
    height: 530px;
	display: flex;
    justify-content: center;
    align-items: center;
}
.feature-img02 {
	overflow: hidden;
	position: relative;
	width:auto;
    height: 530px;
	display: flex;
    justify-content: center;
    align-items: center;
}
.feature-img:before {
	transform: translateX(-100%);
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f8f8f8;
    transition: all .4s ease-out;
}
.feature-img.rgt {
	right:-10vw;
	top:-10%;
}
.feature-img.lft {
	left:-10vw;
	top:-10%;
}
.img-frame {
    width:707px;
	height:530px;
    object-fit: cover;
}
@media only screen and (max-width: 767px) {
.wrap-block-01 {
	margin-bottom: 32px;
		    margin-top: 0px;
}
.wrap-block-01::before {
	top: -30px;
	height: calc(100% + 62px);
}
.wrap-block-02 {
    margin-top: 0px;
	margin-bottom: 32px;
}
.wrap-block-02::before {
	top: -30px;
    height: calc(100% + 60px);
}
.wrap-block-03 {
	margin-bottom: 32px;
}
.wrap-block-03::before {
    top: -30px;
    bottom: 0px;
    width: 100%;
    height: calc(100% + 60px);
    right: 0;
    content: '';
    position: absolute;
    background-color: #f7f4f4;
    z-index: -1;
}
.wrap-block-04 {
	margin-bottom: 12px;
	padding-bottom: 0px;
}
.wrap-block-04::before {
	top: -32px;
    height: calc(100% + 20px);
}
.wrap-block-05 {
	margin-bottom: 32px;
}
.wrap-block-05::before {
	top: -32px;
    height: calc(100% + 60px);
}
.feature-wrap {
    flex-wrap:wrap;
	max-width: 100%;
	    width: 98%;
		    margin-bottom: 20px;
}
.feature-img {
    width: 100%;
    height: auto;
}
.feature-txt {
	padding: 2rem 2rem 3rem 2rem;
	width: 100%;
	word-break: break-word;
		margin-bottom:20px;
}
.feature-txt.rgt {
   position:relative;
   left:0px;
   margin-top:0%;
}
.feature-txt.lft {
   position:relative;
   right:0px;
   margin-top:0%;
}
.Feature-Num {
    font-size: 35px;
    line-height: 1.3;
    margin-bottom: 4%;
}
.feature-txt h3 {
    margin-bottom: 1.0em;
    font-size: 140%;
    line-height: 1.2;
	padding-left:0px;
}
.feature-wrap.dw {
	margin-bottom: 40px;
}
.img-frame {
    width:100%;
	height:100%;
    object-fit: cover;
}
}
.wd-f {
	width:60%;
	margin:auto;
}
.res-mt-f {
	margin-top: 30px !important;
}
@media only screen and (max-width: 767px) {
.wd-f {
	width:100%;
	margin:auto;
}
.res-mt-f {
	margin-top: 20px !important;
}
}
.wd40{
   width:40% !important;
   margin:auto;
}
.wd50 {
  width:50% !important;
  margin:0 auto;
}
.wd60 {
  width:60% !important;
  margin:0 auto;
}
.wd70 {
  width:70% !important;
  margin:0 auto;
}
.wd80 {
  width:80% !important;
  margin:0 auto;
}
.wd85 {
  width:85% !important;
  margin:0 auto;
}
.wd90 {
  width:90% !important;
  margin:0 auto;
}
.wd95 {
  width:95% !important;
  margin:0 auto;
}

@media only screen and (max-width: 768px) {
.wd40,.wd50,.wd60,.wd70,.wd80,.wd85,.wd90,.wd95{
   width:100% !important;
   margin:auto;
}
}
.h3-ttl {
	font-size: 1.6em;
	line-height:1.3em;
	text-align:left !important;
	position: relative;
	text-align: center;
	margin-bottom:0.5em;
	padding-left:10px;
	text-shadow: 0 0 2px #fff, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #fff,0 0 10px #fff,0 0 12px #fff, 0 0 14px #fff;
}

.h3-ttl:after {
	content: '';
	position: absolute;
	bottom: 0px;
	display: inline-block;
	width: 20px;
	height: 1px;
    top: 20px;
    left: -20px;
	transform: translateX(-50%);
	    background: #58574c;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;


}
.h3-ttl02 {
	font-size: 1.6em;
	line-height:1.3em;
	text-align:left !important;
	position: relative;
	text-align: center;
	margin-bottom:0.5em;
	padding-left:30px;
	text-shadow: 0 0 2px #fff, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #fff,0 0 10px #fff,0 0 12px #fff, 0 0 14px #fff;
}

.h3-ttl02:after {
	content: '';
	position: absolute;
	bottom: 0px;
	display: inline-block;
	width: 20px;
	height: 1px;
    top: 20px;
    left: 10px;
	transform: translateX(-50%);
	    background: #58574c;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;


}

@media screen and (max-width: 768px) {
	
.h3-ttl {
	font-size: 1.2em;
    padding-left: 30px;
}
.h3-ttl:after {
    left: 10px;
	top: 15px;
}	
}
.tx-flex {
    text-align:center;
}
@media only screen and (max-width: 768px) {
.tx-flex {
    text-align:left;
}
}
dl.dl-flex {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  box-sizing:border-box;
}
dl.dl-flex dt {
  flex-basis: 40%;
  text-align: center;
  padding:0.5em;
  background: #f4f3f2;
  box-sizing:border-box;
}
dl.dl-flex dd {
  flex-basis: 60%;
  text-align: center;
    padding:0.5em;
	background: #f9f9f9;
	  box-sizing:border-box;
  
}
dl.dl-flex-02 {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items:stretch;
  width: 100%;
  box-sizing:border-box;
}
dl.dl-flex-02 dt {
  flex-basis: 40%;
  text-align: center;

  padding:0.5em;
  background: #f4f3f2;
  box-sizing:border-box;
	

}
.h3-tbl {
	font-size: 1.3em;
    line-height: 1.3em;
    text-align: center;
	font-weight: 400; 
    position: relative;
    text-align: center;
    margin-bottom: 0.0em;
    padding-bottom: 0.0em;
    text-shadow: 0 0 2px #fff, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #fff, 0 0 10px #fff, 0 0 12px #fff, 0 0 14px #fff;
}
.h3-tbl:after {
  content:'';
  position: absolute;
    bottom: -0px;
    display: inline-block;
    width: 0px;
    height: 0px;
    left: 0%;
    transform: translateX(-50%);
    background-color: #acacac;
    border-radius: 8px;
    -webkit-border-radius: 8px;
}
dl.dl-flex-02 dd {
  flex-basis: 60%;
  text-align: left;
  padding:0.5em;
  background: #fff;
  box-sizing:border-box;
  display:flex;
  align-items:center;


}
ul.u-flex {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  box-sizing:border-box;
}
ul.u-flex li {
  flex-basis: 50%;
  text-align: center;
  padding:0.2em;
	  box-sizing:border-box;
}
.tbl-1 {
		background: #fff;
		border-spacing: 0px;
}
.tbl-1 th {
	width:40%;
}
.tbl-1 tr:nth-of-type(1) th,.tbl-1 tr:nth-of-type(1) td {
	  border-top: 1px solid #e1dede !important;
}
	
.tbl-1 th,.tbl-1 td {
  border-top: 1px solid #fff !important;
  text-align: center;
}
.tbl-1 th {
  border-left: 1px solid #e1dede;
  border-bottom: 1px solid #e1dede;
}
.tbl-1 td {
  border-left: 1px solid #e1dede;

  border-bottom: 1px solid #e1dede;
  text-align: center;
}
.tbl-1 td:last-child {
	  border-right: 1px solid #e1dede; 
}
.tbl-2 th {
	width:30%;
}
.tbl-4 th {
	background: #f1f0f0;
}
.tbl-4 .th-01 {
	width:30% !important;

}
.tbl-4 .th-02 {
	width:10% !important;
}
.tbl-4 .th-03 {
	width:60% !important;
	border-right: 1px solid #e1dede;
}
.td-01 {
	background:#f9f9f9;
}
.tbl-5 th {
	width:30%;
	background: #d3d3d3;
}
@media screen and (max-width: 768px) {
.h3-tbl {
	font-size: 1.1em;
    line-height: 1.3em;
}
ul.u-flex li {
    flex-basis: 50%;
    text-align: left;
    padding: 0.2em;
    box-sizing: border-box;
}
.tbl-1 tr:nth-of-type(1) td {
	  border-top: none !important;
}
.tbl-1 th {
	  border-bottom: 1px dotted #e1dede !important;
}
.tbl-1 td {
	  font-size:16px;
}
.tbl-1 th {
    border-right: 1px solid #e1dede;
}
.tbl-4 .th-01 {
	width:20% !important;
	border-right:none;

}
.tbl-4 .th-02 {
	width:15% !important;
	border-right:none;
}
.tbl-4 .th-03 {
	width:65% !important;
}
 dl.dl-flex {
   flex-flow: column;
 }
 ul.u-flex li {
  flex-basis: 100%;
}
 .tbl-1 th,.tbl-2 th {
	width:100%;
}
}
/*===========================
anchor
===========================*/


#anchor01 {
	margin-top:-110px;
	padding-top:110px;
}

#anchor02 {
	margin-top:-95px;
	padding-top:95px;
}

#anchor03 {
	margin-top:-95px;
	padding-top:95px;
}
#charge,#reservation {
    margin-top: -125px;
    padding-top: 125px;
}
#partner {
    margin-top: -125px;
    padding-top: 125px;
}
.line-f {
	line-height: 1.2;
}
.p-ttl {
	font-size:1.1em;
	font-weight: 600;
	padding-bottom:0.2em;
	border-bottom:1px solid #333;
	margin-bottom:1em;
}
.sub-ttl-tr01,.sub-ttl-tr02,.sub-ttl-tr03,.sub-ttl-tr04,.sub-ttl-tr05,.sub-ttl-tr06 {
	position: relative;
}
.sub-ttl-tr01:before {
	content: "HIGHLIGHTS" counter(number);
    counter-increment: number 1;
    position: absolute;
    display: block;
    top: 1.8em;
    left: -14px;
    font-size: 0.6em;
    font-weight: 600;
    font-family: Overpass, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    color: rgb(166, 167, 167);
    transform: rotate(90deg);
    transform-origin: left top;
}
.sub-ttl-tr02:before {
	content: "HIGHLIGHTS" counter(number);
    counter-increment: number 2;
    position: absolute;
    display: block;
    top: 1.8em;
    left: -14px;
    font-size: 0.6em;
    font-weight: 600;
    font-family: Overpass, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    color: rgb(166, 167, 167);
    transform: rotate(90deg);
    transform-origin: left top;
}
.sub-ttl-tr03:before {
	content: "HIGHLIGHTS" counter(number);
    counter-increment: number 3;
    position: absolute;
    display: block;
    top: 1.8em;
    left: -14px;
    font-size: 0.6em;
    font-weight: 600;
    font-family: Overpass, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    color: rgb(166, 167, 167);
    transform: rotate(90deg);
    transform-origin: left top;
}
.sub-ttl-tr04:before {
	content: "HIGHLIGHTS" counter(number);
    counter-increment: number 4;
    position: absolute;
    display: block;
    top: 1.8em;
    left: -14px;
    font-size: 0.6em;
    font-weight: 600;
    font-family: Overpass, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    color: rgb(166, 167, 167);
    transform: rotate(90deg);
    transform-origin: left top;
}
.sub-ttl-tr05:before {
	content: "HIGHLIGHTS" counter(number);
    counter-increment: number 5;
    position: absolute;
    display: block;
    top: 1.8em;
    left: -14px;
    font-size: 0.6em;
    font-weight: 600;
    font-family: Overpass, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    color: rgb(166, 167, 167);
    transform: rotate(90deg);
    transform-origin: left top;
}
.sub-ttl-tr06:before {
	content: "HIGHLIGHTS" counter(number);
    counter-increment: number 6;
    position: absolute;
    display: block;
    top: 1.8em;
    left: -14px;
    font-size: 0.6em;
    font-weight: 600;
    font-family: Overpass, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    color: rgb(166, 167, 167);
    transform: rotate(90deg);
    transform-origin: left top;
}
.pc-disp {
    display:block;
}
.sp-disp {
    display:none; 
}
@media only screen and (max-width: 768px) {
.p-ttl {
	font-size:1.0em;
	font-weight: 500;
	padding-bottom:0.2em;
	padding-left:10px;
	margin-bottom:0.7em;
}
.pc-disp {
    display:none;
}
.sp-disp {
    display:block; 
}
}

.btn-d a {
    z-index: 1;
    width: 40%;
    max-width: 300px;
    margin: auto;
    text-align: center;
    border: 1px solid;
    font-size: 90.75%;
    position: relative;
    display: block;
    max-width: 100%;
    text-decoration: none;
    color: #103306;
}
.btn-d a::before {
    right: 1vw;
    width: 6px;
    height: 6px;
    border-top: solid 1px;
    border-right: solid 1px;
    transform: rotate(45deg) translateY(-50%);
}
.btn-d a::after {
    right: 1vw;
    width: 1vw;
    height: 1px;
    border-bottom: 1px solid;
}
.btn-d a::before, .btn-d a::after, .btn-d a span::before {
    content: '';
    position: absolute;
    top: 50%;
}

.btn-d a, .btn-d span {
    position: relative;
    display: block;
}
.btn-d span {
    padding: 0.7em 1em 0.7em 0em;
    font-size: 1.1em;
    font-weight: bold;
}
.btn-d a span::before {
    right: 3vw;
    transform: translateY(-50%);
    width: 1px;
    height: calc(100% - 26px);
    border-right: 1px solid;
}

@media only screen and (max-width: 768px) {
.btn-d a {
    width: 100%;
    margin: auto;
    max-width: 100%;
    border: 1px solid;
    font-size: 90.75%;
    position: relative;
    display: block;
    max-width: 100%;
    text-decoration: none;
    color: #103306;
    line-height: 1.0;
}
.btn-d span {
    padding: 1em 2.5em 1em 0em;
    font-size: 1.0em;
    font-weight: bold;
}
.btn-d a span::before {
    right: 40px;
}
.btn-d a::after {
    right: 13px;
    width: 14px;
    height: 1px;
    border-bottom: 1px solid;
}
.btn-d a::before {
    right: 15px;

}
}
.pd-lf {
	padding-left:50px;
}
	.res-cp {
		line-height: 1.0;
		font-size:16px;
	}
@media only screen and (max-width: 768px) {
	p,ul li,table td,ul li,ol li {
		font-size:16px;
		line-height: 1.8;
		font-weight:500 !important;
	}
	table th {
		font-size:16px;
	}
	table th,table td {
		padding:0.5em !important;
	}
	.pd-lf {
    padding-left: 30px;
}
	.res-cp {
		line-height: 1.0;
		font-size:16px;
	}
}
.box-wrap {
    background: #fff;
    box-sizing: border-box;
}
.box-ttl {
	text-align:center !important;
	background: #edeff1;
	padding:0.6em 0.6em 0.6em;
	margin-bottom:0px !important;
	display:flex;
	align-items:center;
	justify-content:center;
}
.box-ttl:after {
	content: '';
    position: absolute;
    bottom: 0px;
    display: inline-block;
    width: 0px;
    height: 0px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #acacac;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
}
.box-wrap div.box-cnt {
	width:100%;
	margin:0px auto 0em;
	padding:1.2em 1.8em 1.8em 1.8em;
	box-sizing:border-box;
	background:#fbfbfb;
}
.wrap-d {
   overflow-x: hidden;
}
.dp-n {
	display:none !important;
}
.img-res {
	width:80%;
	height:auto;
}
.img-res-01 {
	width:30%;
	height:auto;
}
.room-img {
	margin-bottom: 1rem;
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 100%;
    overflow: hidden;
    display: block;
}
.room-img img {
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.room-img-02 {
  width: 100%;
  height: 325px;
  object-fit: cover;
}
.room-img-03 {
  width: auto;
  height: 400px;
  object-fit: cover;
}
@media only screen and (max-width: 768px) {
.room-img-03 {
  width: 80%;
  height: auto;
}

}

.frap-3 {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.frap-3 > div {
	width:32%;
}
.frap-4 {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.frap-4 > div {
	width:23%;
}
.room01 {
	background: url("../img/content/room-001.jpg");
	background-size:cover;
	background-position: center;
	height: 400px;
}
.room02 {
	background: url("../img/content/room-002.jpg");
	background-size:cover;
	background-position: center;
	height: 400px;
}
.room03 {
	background: url("../img/content/room-003.jpg");
	background-size:cover;
	background-position: center;
	height: 400px;
}
.room04 {
	background: url("../img/content/room-004.jpg");
	background-size:cover;
	background-position: center;
	height: 400px;
}
.room05 {
	background: url("../img/content/room-005.jpg");
	background-size:cover;
	background-position: center;
	height: 400px;
}
.room06 {
	background: url("../img/content/room-006.jpg");
	background-size:cover;
	background-position: center;
	height: 400px;
}
.room07 {
	background: url("../img/content/room-007.jpg");
	background-size:cover;
	background-position: center;
	height: 400px;
}
.p-sub {
	font-family: var(--font-mincho-2);
	color:var(--color-main-f);
	font-size: 1.3em;
	line-height:1.3em;
	margin-bottom:0.1em;
	text-align: left;
}
@media only screen and (max-width: 768px) {
.frap-3 > div,.frap-4 > div {
	width:100%;
}
.frap-3 > div:nth-of-type(1),.frap-3 > div:nth-of-type(2),.frap-4 > div:nth-of-type(1),.frap-4 > div:nth-of-type(2),.frap-4 > div:nth-of-type(3) {
	margin-bottom:20px;
}
.p-sub {
	font-size: 1.0em;
	line-height:1.0em;
	margin-bottom:0.1em;
	text-align: center;
}

}
.arrow-lnk {
  position: relative;
    /*形状*/
    display: inline-block;
  padding: 0px;
    color: #333;
    text-decoration: none;
    outline: none;
}

/*矢印と下線の形状*/
.arrow-lnk::before{
    content: '';
    /*絶対配置で下線の位置を決める*/
  position: absolute;
    bottom:20px;
    right:10%;
    /*下線の形状*/    
    width: 35%;
    height: 3px;
  background:#fff;
    /*アニメーションの指定*/
    transition: all .3s;
	z-index: 3;
}

.arrow-lnk::after{
    content: '';
    /*絶対配置で矢印の位置を決める*/
    position: absolute;
    bottom:25px;
    right:32px;
    /*矢印の形状*/    
    width: 15px;
    height:3px;
    transform: rotate(35deg);
    /*アニメーションの指定*/
  background:#fff;
    /*アニメーションの指定*/
    transition: all .3s;
	z-index: 5;
	
}
/*hoverした際の移動*/
.arrow-lnk:hover::before{
    bottom:0px;
    right:0%;
	width: 0%;
    height: 0px;
}

.arrow-lnk:hover::after{
    bottom:0px;
    right:0%;
	width: 0%;
    height: 0px;
	    transition: all .1s;
}
.arrow-lnk3 {
	position: absolute;
	right:10px;
	bottom:10px;
	z-index: 5;
}
.fa-solid, .fas {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
}
.fa-chevron-circle-up:before {
	color: var(--color-main) !important;
}
.fa-phone-alt:before {
    color:#333;
}
ol.num_order {
 padding-left:20px;
}
ol.num_order li {
    padding: 5px 0 4px 0;
    list-style-type: decimal;
}
.room-name {
	    line-height: 1.5;
}
.room-name span {
	display:block;
	font-size:80%;
}
@media only screen and (max-width: 768px) {
.table-scroll {
    overflow-x: auto;
    width: 100%;
    border-right: 5px solid #ccc;
}
.table-scroll::-webkit-scrollbar {
    height: 5px;
}
.table-scroll::-webkit-scrollbar-track {
    border-radius: 5px;
    background:#CCC;
}
.table-scroll::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background:#999;
}
.table-scroll table {
    table-layout: fixed;
    min-width: 100%;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    margin-bottom:0px;
}
.table-scroll table th {
    width:200px !important;
    min-width: 250px;
    display:table-cell;
    padding:2%;
    font-size:15px;
    border: 1px #ccc solid;
}
.table-scroll table td {
    width: 90px;
    min-width: 130px;
    display:table-cell;
    font-size:15px;
    word-wrap: break-word;
    white-space:normal;
}
.table-scroll table th.th-01 {
    width:100px !important;
    min-width: 100px;
}
.table-scroll table th.th-02 {
    width:30px !important;
    min-width: 30px;
}
.table-scroll table th.th-03 {
    width:300px !important;
    min-width: 300px;
	}
.table-scroll table td.td-01 {
    width: 90px;
    min-width: 130px;
    display:table-cell;
    font-size:15px;
    word-wrap: break-word;
    white-space:normal;
}

}
