@charset "utf-8";

/* mobile----------------------------------------------------*/
@media screen and (max-width: 480px) {

.pc{display: none;}

header{width: 100%; margin: 0 auto 20px;}
h1{ display: none;}
.logo{ width: 40%; margin: 10px auto;}
.logo img{width: 100%;}
.add{ width: 100%; text-align: center;}
.tel{ font-size: 18px;font-weight: bold; color: #ff6633;}
#wrapper{ width: 96%; margin: 0 auto 20px auto;}

.bt{ font-size: 130%;font-weight: bold;}
.title_back { margin: 0px; width: 100%; height: 160px;
	background-image:url(bg.jpg);background-repeat: repeat;border-bottom: thin solid #333;}

.title{ text-align: center;
    padding-top: 40px;
    font-size: 260%;
    font-weight: bold;
     font-family:serif;
}

.sab_title { text-align: center;}



.movie{ width: 96%; height: auto; margin: 0 auto 20px auto;}
.movie img{width: 100%;}


.yoyaku{ width: 96%; height: auto; margin: 40px auto;}
.yoyaku img{width: 100%;}

.btn{ width: 96%; padding: 10px; text-align: center;
 background-color: orange;color: #fff;font-size: 16px;margin: 20px auto;}

.btn a{ color: #fff; text-decoration:none}

.btn a:hover{ color: #fff; font-weight: bold; text-decoration:line-through;}

    
footer{ display: none;}
.footer2{text-align: center; margin: 20px auto; color: #888;}

/* トップにもどるボタン -----------------*/
#page-top {position: fixed;bottom: 20px;right: 20px;transition: 0.6s}
#page-top a:hover {opacity: 0.5;}


}/* Tablet---------------------------------------------------*/
@media (min-width: 481px) and (max-width: 768px) {

.sp{display: none;}

header{width: 100%; height: 120px; margin: 0 auto;}
h1{ font-size: 90%;}
.logo{ width: 237px; height: 89px; float: left;}
.add{ width: 300px; height: 100px; text-align: right; float: right;}
.tel{ font-size: 32px;font-weight: bold; color: #ff6633;}
#wrapper{ width: 1080px; margin: 0 auto 20px auto; padding: auto 40px;}



/* トップにもどるボタン -----------------*/
#page-top {position: fixed;bottom: 20px;right: 20px;transition: 0.6s}
#page-top a:hover {opacity: 0.5;}
}/* PC-------------------------------------------------------*/
@media screen and (min-width: 769px) {

.sp {display: none;}
.navToggle {display: none;}

header{width: 1080px; height: 120px; margin: 0 auto;}
h1{ font-size: 90%;}
.logo{ width: 237px; height: 89px; float: left;}
.add{ width: 300px; height: 100px; text-align: right; float: right;}
.tel{ font-size: 32px;font-weight: bold; color: #ff6633;}
#wrapper{ width: 1080px; margin: 0 auto 20px auto; padding: auto 40px;}

nav.pc{ width: 100%; height: 70px; border-bottom: thin solid #333; border-top: thin solid #333; margin: 10px auto 0px auto;}
nav.pc ul{ padding-top: 10px; width: 1080px; margin: 0 auto; list-style: none;font-family:serif;display: flex;justify-content: space-between;}
nav.pc li{ text-align: center; width: 16%;}
nav.pc a { color: #333; text-decoration:none;}
nav.pc a:link { color: #333; text-decoration:none;}
nav.pc a:hover { color: orange; }

.bt{ font-size: 130%;font-weight: bold;}
.title_back { margin: 0px; width: 100%; height: 160px;background-image:url(bg.jpg);background-repeat: repeat;border-bottom: thin solid #333;}

.title{ text-align: center;
    padding-top: 40px;
    font-size: 260%;
    font-weight: bold;
     font-family:serif;
}

.sab_title { text-align: center;}

.movie{ width: 1000px; height: 300px; margin: 0 auto 20px auto;}

.yoyaku{ width: 500px; height: auto; margin: 40px auto;}

.btn{ width: 540px; padding: 10px; text-align: center;
 background-color: orange;color: #fff;font-size: 16px;margin: 20px auto;}

.btn a{ color: #fff; text-decoration:none}

.btn a:hover{ color: #fff; font-weight: bold; text-decoration:line-through;}

footer{ width: 100%; height: 20px;color: #fff; text-align: center; padding: 10px; background-color: #663300; margin: 20px 0;}
small{text-align: center;}
.footer2{text-align: center; margin: 20px auto; color: #888;}
/* トップにもどるボタン -----------------*/
#page-top {position: fixed;bottom: 20px;right: 20px;transition: 0.6s}
#page-top a:hover {opacity: 0.5;}
	
}