@charset "utf-8";

#slide_wrapper .mainTitle{
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	height: 600px;
}
@media only screen and (max-width:1200px){
}
#slide_wrapper .slide1{background-image: url(/public/img/slide/tiger-thai-massage01.webp)}
#slide_wrapper .slide2{background-image: url(/public/img/slide/tiger-thai-massage02.webp)}
#slide_wrapper .slide3{background-image: url(/public/img/slide/tiger-thai-massage03.webp)}

#mainvisual .logoTop{
	position: absolute;
	width: 100%;
	text-align: center;
	margin-top: 100px;
	z-index: 1;
}
#mainvisual .logoTop img{
	max-width: 350px;
}

h1{
	text-align: center;
	color: #fbe7a3;
	font-size: 26px;
	font-weight:normal;
	padding: 10px 0;
}

#gotoEng{
	text-align: center;
	width: 90%;
	max-width: 300px;
	margin: 0 auto 20px;
}
#gotoEng a div{
	padding: 10px 20px;
	border: 1px solid #bd937f;
	max-width: 350px;
	margin: 0 auto;
	transition: all 0.3s ease-in-out 0s;
}
#gotoEng a:hover div{
	background-color: #bd937f;
	transition: all 0.3s ease-in-out 0s;
}
#gotoEng a div span{
	color: #bd937f;
    padding-left: 40px;
    background-image: url(/public/img/icon/en.svg);
    background-repeat: no-repeat;
    background-size: 20px auto;
	background-position: left center;
	transition: all 0.3s ease-in-out 0s;
}
#gotoEng a:hover div span{
	color: #FFF;
	transition: all 0.3s ease-in-out 0s;
}

section{
	padding: 100px 0;
}




/*
.reserveWrapper{
	width: 90%;
	max-width: 600px;
	margin: 0 auto;
}
.reserveWrapper a div{
	text-align: center;
	padding: 10px;
	background-color: #bd937f;
	color: #FFF;
	font-size: 26px;
	font-weight: bold;
	border: 2px solid #bd937f;
	outline-offset: -1px;
    box-sizing: border-box;
	transition: all 0.3s ease-in-out 0s;
}
.reserveWrapper a:hover div{
	color: #bd937f;
	background-color: #FFF;
	transition: all 0.1s ease-in-out 0s;
}
.reserveWrapper a div span{	
	background-image: url(/public/img/icon/reservation.svg);
	background-repeat: no-repeat;
	background-size: 30px auto;
	background-position: left center;
	padding-left: 40px;
	transition: all 0.3s ease-in-out 0s;
}

.reserveWrapper a:hover div span{
	background-image: url(/public/img/icon/reservation-br.svg);
	transition: all 0.3s ease-in-out 0s;
}

*/

.twoCol{
	width: 100%;
	margin: 0 auto;	
    display: flex;
	justify-content: space-between;
}
.twoCol .colL{
	width: 50%;	
}
.twoCol .colR{
	width: 50%;
	padding: 0 5%;
}
.sub-aboutUs{
	max-width: 900px;
	margin: 30px auto 0;
	width: 90%;
}
#signature .twoCol .colL{
	width: 50%;	
}
#signature .twoCol .colR{
	width: 45%;
}
.twoCol img{
	width: 90%;
}

.btnTwo{
	width: 100%;
	margin: 30px auto 0 auto;	
    display: flex;	
	justify-content: space-between;
}
.btnTwo .btnL{
	width: 48%;
}
.btnTwo .btnR{
	width: 48%;
}
.btnTwo a div{
	width: 100%;
	padding: 10px;
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	color: #bd937f;
	border: 2px solid #bd937f;
}
.btnTwo a div{
	background-repeat: no-repeat;
	background-size: 30px auto;
	background-position: 17% center;
	transition: all 0.3s ease-in-out 0s;	
}
.btnTwo a:hover div{
	background-color: #bd937f;
	color: #FFF;
}
.btnTwo a div.btnMenu{	
	background-image: url(/public/img/icon/title02-btn.svg);
}
.btnTwo a div.btnStaff{
	background-image: url(/public/img/icon/title03-btn.svg);	
}
.btnTwo a:hover div.btnMenu{	
	background-image: url(/public/img/icon/title02-btn-w.svg);
}
.btnTwo a:hover div.btnStaff{
	background-image: url(/public/img/icon/title03-btn-w.svg);	
}

.btnTwo a div.btnGift{	
	background-image: url(/public/img/icon/gift2.svg);
}
.btnTwo a div.btnReserve{
	background-image: url(/public/img/icon/reservation-br.svg);	
}
.btnTwo a:hover div.btnGift{	
	background-image: url(/public/img/icon/gift-w.svg);
}
.btnTwo a:hover div.btnReserve{
	background-image: url(/public/img/icon/reservation.svg);	
}
.btnTwo a div span{
	padding-left: 30px;
}

/* about-us */
#aboutUs h2,#signature h2{
	font-size: 26px;
	font-weight: bold;
	color: #fbe7a3;
	padding-top: 2px;
	margin-bottom: 20px;
	align-items: baseline;
	border-bottom: 1px dotted #fbe7a3;
}
#aboutUs h2 img,#signature h2 img{
	max-height: 30px;
	width: auto;
	margin-right: 5px;
}
#aboutUs p,#signature p{
	color:#fbe7a3;
}

/* shopInfo */
#shopInfo{
	background-color: #301215;
	background-image: url(/public/img/icon/thai-bg.svg);
	background-size: 70px auto;
}
#shopInfo h2{
	padding-bottom: 30px;
	font-size: 30px;
	font-weight: bold;
	text-align: center;
	background-image: url(/public/img/icon/thai-line.svg);
	background-repeat: no-repeat;
	background-size: 400px auto;
	background-position: bottom center;
	margin-bottom: 30px;
}
#shopInfo .shopSubTitle{
	width: 90%;
	max-width:1200px;
	margin: 0 auto 50px;	
}
#shopInfo .shopInfo-Wrapper{
	display: flex;
	flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
}
.shopContent{
	width: 45%;
	margin-bottom: 100px;
}
.shopContent h3{
	text-align: center;
	font-size: 24px;
	font-weight: bold;
	color: #fbe7a3;
	line-height: 1.2;
	margin-bottom: 30px;
}
.shopContent h3 span{
	display: block;
	font-size: 18px;
	font-weight: normal;
	color: #d8b97a;
}
.shopContent p.accessShop{
	text-align: center;
	color: #fbe7a3;
	padding: 10px 0;
}
.shopContent a:hover img{
	opacity: 0.8;
}
.shopContact{
	text-align: center;
	border-top: dotted 1px #fbe7a3;
	padding: 15px 0;
}
.shopContact .shopTimes{
	color:#d8b97a;
	font-size:20px; 
	font-weight: bold;
}
.shopContact .shopBtn{
	display: flex;	
    justify-content: space-between;
}
.shopContact .gotoShop,.shopContact .gotoMap{
	width: 48%;
}
.shopContact .gotoShop a div{	
    width: 100%;
    padding: 5px;
    text-align: center;
    font-size: 18px;
    color: #fbe7a3;
    background-color: #47281E;
    border: 1px solid #fbe7a3;
	margin: 15px 0;
	transition: all 0.3s ease-in-out 0s;
}
.shopContact .gotoShop a:hover div{	
    color: #301215;
    background-color:#fbe7a3;
	transition: all 0.3s ease-in-out 0s;
}

.shopContact .gotoMap a div{	
    width: 100%;
    padding: 5px;
    text-align: center;
    font-size: 18px;
    color: #fbe7a3;
    background-color: #47281E;
    border: 1px solid #fbe7a3;
	margin: 15px 0;
	transition: all 0.3s ease-in-out 0s;
}
.shopContact .gotoMap a:hover div{	
    color: #301215;
    background-color:#fbe7a3;
	transition: all 0.3s ease-in-out 0s;
}
.shopContact .reserveBtn a div{
    width: 100%;
    padding: 10px;
    text-align: center;
    font-size: 18px;
	line-height: 1.5;
	color:#301215;
	background: linear-gradient(110deg,#b3894f,#d8b97a,#fbe7a3,#fbe7a3,#d8b97a,#b3894f);
    border: 1px solid #fbe7a3;	
	transition: all 0.3s ease-in-out 0s;
}
.shopContact .reserveBtn a:hover div{
    color:#fbe7a3;
    background: #301215;
	transition: all 0.3s ease-in-out 0s;
}
.shopContact .reserveBtn a div span{
	display: block;
	font-size: 15px;
}
.shopContact .telShop{
	margin-top: 10px;
}
.shopContact .telShop a span{
	color:#d8b97a;
	font-size:26px;
	font-weight: bold;
	padding-left: 35px;
	background-image: url(/public/img/icon/tel-gray.svg);
	background-repeat: no-repeat;
	background-size: 25px auto;
	background-position: left center;
}
.shopContact .telShop a:hover span{
	/*color:#fbe7a3;*/
	color:#fff;
	background-image: url(/public/img/icon/tel-w.svg);
}

/* Promotion */
#promotion h2{
	padding-top: 40px;
	font-size: 30px;
	font-weight: bold;
	color: #fbe7a3;
	text-align: center;
	background-image: url(/public/img/icon/title02.svg);
	background-repeat: no-repeat;
	background-size: 50px auto;
	background-position: center top;
	margin-bottom: 50px;
}
#promotion .promotion-Wrapper{
	display: flex;
	flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
	width: 90%;
	max-width: 1000px;
	margin: 0 auto;
}
.promoContent{
	width: 45%;
	margin-bottom: 100px;
}
.promoContent h3{
	margin: 10px 0;
	font-size: 30px;
	text-align: center;
	color: #fbe7a3;
}
.promoContent h3::before,.promoContent h3::after{
	content: " ";
	padding: 0 15px;
	background-image: url(/public/img/icon/title01.svg);
	background-repeat: no-repeat;
	background-size: 30px auto;
	background-position: left center;
	
}
.promoContent h3::before{
	margin-right: 10px;
}
.promoContent h3::after{
	margin-left: 10px;
}
.promoContent p{
	color: #bd937f;
	border-top: 1px dotted #fbe7a3;
	padding: 10px 0 20px 0;
}
/*
#promotion .reserveWrapper{
	width: 100%;
}

/* gift */
#gift{
	background-image: url(/public/img/top/bg-gift.webp);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
#gift .colR{
	padding: 20px;
	background-color: rgba(0,0,0,0.5);
}
#gift h2{
	font-size: 26px;
	font-weight: bold;
	color: #FFF;
	padding-top: 2px;
	padding-left: 45px;
	margin-bottom: 20px;
	background-image: url(/public/img/icon/title01-w.svg);
	background-repeat: no-repeat;
	background-size: 35px auto;
	background-position: left 5px;
    display: flex;
	align-items: baseline;
	border-bottom: 1px dotted #FFF;
	filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 1));
	text-shadow: 1px 1px 2px #000, 0 0 1em #000, 0 0 0.2em #000;
}
#gift h2 img{
	max-height: 30px;
	width: auto;
	margin-right: 5px;
}
#gift li{
	line-height: 2.5;
	font-size: 24px;
}
#gift li a{
	color:#FFF;
	/*filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 1));
	text-shadow: 1px 1px 2px #000, 0 0 1em #000, 0 0 0.2em #000;*/
	transition: all 0.3s ease-in-out 0s;
}
#gift li a div{
	padding-left: 50px;
	background-repeat: no-repeat;
	background-size: 35px auto;
	background-position: 5px center;
	transition: all 0.3s ease-in-out 0s;
}
#gift li a:hover{
	text-shadow: none;
	transition: all 0.3s ease-in-out 0s;
}
#gift li a:hover div{
	background-color: #bd937f;
	transition: all 0.3s ease-in-out 0s;
}
#gift li.gift-icon1 a div{background-image: url(/public/img/icon/gift-icon1.svg);}
#gift li.gift-icon2 a div{background-image: url(/public/img/icon/gift-icon2.svg);}
#gift li.gift-icon3 a div{background-image: url(/public/img/icon/gift-icon3.svg);}
#gift li.gift-icon4 a div{background-image: url(/public/img/icon/gift-icon4.svg);}
#gift li.gift-icon5 a div{background-image: url(/public/img/icon/gift-icon5.svg);}

@media only screen and (max-width:450px){
	section{
		padding: 30px 0;
	}
	.twoCol,.btnTwo{
		display: block;
	}
	.btnTwo a div{
		font-size: 18px;
		background-position: 25% center;
	}
	.btnTwo .btnL{
		margin-bottom: 20px;
	}
	.twoCol .colL,.twoCol .colR,.btnTwo .btnL,.btnTwo .btnR{
		width: 100%;
	}
	.twoCol img{
		width: 100%;
	}
	
	#mainvisual{
		padding-top: 60px;
	}
	#slide_wrapper .mainTitle{
		height: 300px;
	}
	#mainvisual .logoTop{
		margin-top: 15%;
	}
	#mainvisual .logoTop img{
		width: 40%;
		margin: 0 auto;
	}
	h1{
		font-size: 18px;
	}
	h1 span{display: inline-block;}
	/*
	#reserve{
		padding: 30px 0;
	}
	.reserveWrapper a div{
		font-size: 18px;
	}
	.reserveWrapper a div span{
		background-size:20px auto;
	}
	*/
	#aboutUs{padding-top: 0;}
	#aboutUs h2, #signature h2,#gift h2{
		/*display: block;*/
	}
	#aboutUs h2, #signature h2{
		text-align: left;
		margin-top: 10px;
		font-size: 20px;
		background-size: 25px auto;
		padding-left: 30px;
	}
	#aboutUs h2 img, #signature h2 img{
		max-height: 20px;
		vertical-align:inherit;
	}
	#shopInfo h2{
		font-size:20px;
		padding-top: 35px;
		padding-bottom: 25px;
		background-size:70% auto;
		margin-bottom: 20px;
	}
	#promotion h2{
		font-size:20px;
		padding-top: 35px;
		background-size:45px auto;
		margin-bottom: 30px;
	}
	#shopInfo .shopInfo-Wrapper{
		display: block;
	}
	.shopContent{
		width: 100%;
		padding: 10px 0;
		margin-bottom: 50px;
	}
	.shopContent h3{
		font-size: 18px;
		margin-bottom: 10px;
	}
	.shopContent h3 span{
		font-size: 15px;
	}
	.shopContact{
		padding: 10px 0;
	}
	.shopContact .shopTimes{
		font-size: 18px;
	}	
	.shopContact .gotoShop a div,.shopContact .gotoMap a div{
		font-size: 16px;
		margin: 10px 0;
	}
	.shopContact .reserveBtn a div{
		font-size: 18px;
	}
	
	.shopContact .reserveBtn a div span{
		font-size: 14px;
	}
	.telShop{
		margin-top: 10px;
	}
	.shopContact .telShop a span{
		font-size: 18px;
		padding: 10px 0 10px 35px;
	}
	.shopContact .shopBtn{
		display: block;
	}
	.shopContact .gotoShop, .shopContact .gotoMap{
		width: 100%;
	}
	#promotion .promotion-Wrapper{
		display: block;
	}
	.promoContent{
		width: 100%;
	}
	.promoContent h3{
		font-size: 20px;
	}
	.promoContent h3::before, .promoContent h3::after{
		background-size:20px auto;
		padding: 0 10px;
	}
	#gift h2 img, #signature h2 img{
		max-height: 20px;
		vertical-align:inherit;
	}
	#gift h2{
		margin-top: 10px;
		font-size: 20px;
		background-size: 25px auto;
		padding-left: 30px;	
	}
	#gift li{
		line-height: 1.5;
		font-size: 16px;
		margin-bottom: 20px;
	}
	#gift .colR{
		margin-top: 20px;
	}
	#signature .twoCol .colL,#signature .twoCol .colR{
		width: 100%;
	}
	#signature .twoCol{
		display: flex;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-flex-direction: column-reverse;
        flex-direction: column-reverse;
	}
}