@charset "UTF-8";

/*

styles_dist.cssは、TailwindCSSのビルドしたファイルのため
TailwindCSS以外のCSSは、styles_others.cssに記述する。

*/

img{width: 100%;}

/* footer button */
.footer-btn{
	position: fixed;
    bottom: 30px;
    right: 20px;
    z-index: 1;
}

.btn-reserve img{
    width: 320px;
}

.btn-reserve{
    display: inline-block;
    touch-action: manipulation;
    cursor: pointer;
}

/* RWD Image Maps(Chrome) */
.imgmap{
    width: 100%;
    height: auto;
}

/* tel */
area[href^="tel:"]{
    cursor: default;
}

/* SNS button */
.sns_btn ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 0 60px;
}

.sns_btn ul li {
    width: 100%;
}

.sns_btn ul li.btn_tw {
    background: #55acee;
}

.sns_btn ul li.btn_fb {
    background: #3b5998;
}

.sns_btn ul li.btn_ig {
    position: relative;
    background: -webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
    background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
    overflow: hidden;
}

.sns_btn ul li.btn_ig:before{
    content: '';
    position: absolute;
    top: 7px;
    left: -85px;
    width: 200px;
    height: 120px;
    background: -webkit-radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
    background: radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
}

.sns_btn ul li.btn_ln {
    background: #06c755;
}

.sns_btn ul li.btn_ln img {
    width: 1.5em;
    margin: 0 auto;
}

.sns_btn ul li a {
    display: block;
    color: #fff;
    padding: .3em 0 .2em;
    text-align: center;
    font-size: 1.3em;
    z-index: 2;
    position: relative;
}


@media only screen and (max-width: 767px){
    
    .footer-btn{
        bottom: 0;
        right: 0;
        width: 100%;
        z-index: 1;
        text-align: center;
        background-color: rgba(255,255,255,0.8);
    }
    
    .btn-reserve img{
        width: 90%;
        margin: 0 auto;
    }
    
    .btn-reserve{
        width: 100%;
        margin: 10px 0 5px;
    }
    
    area[href^="tel:"]{
        cursor: pointer;
    }
   
    
}