@charset "utf-8";


body{
	background-color:#ffffff;
	font-family:sans-serif;
        }
        
body:before{
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-1;
  width:100%;
  height:100vh;
  background:url(images/bg_main.jpg) top repeat-x;
  background-size:cover;
}

.bg_west{color:#ffffff;
	background:#f3981c;}
	
.bg_shibiraki{color:#ffffff;
	background:#794acc;}


/* div ******************************************************************************************/       

        .white{
	        background-color:#ffffff;
        }
        
        .center{
	        text-align:center;
        }        
        
        .staff p{
	        padding:0 2em;
        }
        
        .schedule{
        	width:90%;
	        text-align:center;
        }
        
.map{
position:relative;
width:100%;
height:0;
padding-top:50%;
text-align:center;
}
.map iframe{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
  margin-left: auto!important;
  margin-right: auto!important;
  text-align:center;
}

.bottom{
	margin-top:50px;
}

.bottom p{
		font-size:1.4rem;
	line-height:140%;
}

        .mid{
	        font-size:2.5rem;
	        font-weight:bold;
	        color:#ffffff;
	        padding:0.2rem 3rem;
        }	
        

/* 店舗紹介 ******************************************************************************************/  

.store{
	margin-top:30px;
	margin-bottom:30px;
}

.storename{
	font-size:2.4rem;
	line-height:1.2;
	font-family: 'M PLUS 1', sans-serif;
	font-weight:bold;
}

.storeservise{
font-size:1.6rem;
	background-color:#baec99;
	margin-top:10px;	
	padding:5px;	
}

.taikenservise{
font-size:2rem;
font-weight:bold;
	background-color:#ffe1e8;
	margin-top:10px;
	padding:5px;
}

.taikensmall{
	font-size:65%;
	font-weight:normal;
}

.storeinfo{
	font-size:1.4rem;
}

.storeicon{
	height:25px;
	border: none;
	vertical-align: middle;
	padding:5px;
}

.storeicon2{
	height:20px;
	border: none;
	vertical-align: middle;
	padding:5px;
}

.westservise{
font-size:2rem;
font-weight:bold;
	background-color:#f7d592;
	margin-top:10px;	
	padding:5px;
}


.shibirakiservise{
font-size:2rem;
font-weight:bold;
	background-color:#c7bfe8;
	margin-top:10px;	
	padding:5px;
}

.storephoto{
	margin-top:10px;	
}


/* table ******************************************************************************************/       

.sc table{
	width:100%;
	text-align:center;
	padding-left:50px;
}

table{
  border-collapse: collapse;
  padding:0 2em;
}

table tr{
  border-bottom: solid 2px white;
}

table tr:last-child{
  border-bottom: none;
}

table th{
  position: relative;
  width:20%;
  text-align: left;
  background-color: #1aa9cb;
  color: white;
  text-align: center;
  padding: 2rem;
}

.hon{
	  background-color: #fe4c10;
}

.online{
	  background-color: #f8355c;
}

table th:after{
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  top:calc(50% - 10px);
  right:-10px;
  border-left: 10px solid #666666;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}

table td{
  text-align: left;
  background-color: #eee;
  padding: 1rem 1rem 1rem 2rem;
}


/* button ******************************************************************************************/       

.button_apply {
  display       : inline-block;
  border-radius : 5%;          /* 角丸       */
  font-size     : 2rem;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 1rem 2rem;   /* 余白       */
  background    : #33a34d;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 2em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 3px 3px 2px #666666;  /* 影の設定 */
  border        : none;    /* 枠の指定 */
}
.button_apply:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #ffffff;     /* 文字色     */
  background    : #64d47e;     /* 背景色     */
}

.button_login {
  display       : inline-block;
  border-radius : 5%;          /* 角丸       */
  font-size     : 1.5rem;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 1rem 1rem;   /* 余白       */
  background    : #f8355c;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 2em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 3px 3px 2px #666666;  /* 影の設定 */
  border        : none;    /* 枠の指定 */
}
.button_login:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #ffffff;     /* 背景色     */
  background    : #ffa6bb;     /* 文字色     */
}

/* toparrow ******************************************************************************************/ 

html {
    scroll-behavior: smooth;
}
.pagetop {
    height: 50px;
    width: 50px;
    position: fixed;
    right: 30px;
    bottom: 30px;
    background: #f8355c;
    border: none;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.pagetop__arrow {
    height: 10px;
    width: 10px;
    border-top: 3px solid #ffffff;
    border-right: 3px solid #ffffff;
    transform: translateY(20%) rotate(-45deg);
}

/** PC *****************************************************************************/
@media screen and (min-width: 768px) {

}

/** PC & tablet ********************************************************************/
@media screen and (min-width: 480px) {

	
	p{
        font-size:1.6rem;
	        line-height:180%;
        }
	
}

/** tablet *************************************************************************/
@media screen and (max-width: 767px) {

}

/** smartphone *********************************************************************/
@media screen and (max-width: 479px) {

		
        p{
        font-size:1rem;
	        line-height:170%;
	        font-size:1.4rem;	        
        }
        
                h3{
	        font-size:2rem;
        }	
        
                .big{
	        font-size:140%;
	        font-weight:bold;
	        padding:0.5rem;
        }     
        
        .button_apply {
  display       : inline-block;
  border-radius : 5%;          /* 角丸       */
  font-size     : 18px;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 0.3rem;   /* 余白       */
  background    : #33a34d;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 2em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 3px 3px 2px #666666;  /* 影の設定 */
  border        : none;    /* 枠の指定 */
}
.button_apply:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #ffffff;     /* 背景色     */
  background    : #f8355c;     /* 文字色     */
}

.map{
position:relative;
width:100%;
height:0;
padding-top:100%;
text-align:center;
}
	
}