@charset "utf-8";
/* CSS Document */
.none{display:none;}
.hidden{
text-indent:100%;
white-space:nowrap;
overflow:hidden;
border:none;}
img{max-width:100%;}

p.kyuujin{display:none;}

.content{
width:960px;
margin:0 auto;}

.slide_nav{display:none;}

/*ヘッダー*/
header{
background:-webkit-linear-gradient(bottom,#f8f8f8 0%,#FFF 30%,#FFF 100%);
background:-moz-linear-gradient(bottom,#f8f8f8 0%,#FFF 100%);
background:-ms-linear-gradient(bottom,#f8f8f8 0%,#FFF 100%);
}

header .content{
position:relative;
background:#FFF;}
h1{
text-align:center;
font-size:40px;
height:58px;
padding:10px 0 0 10px;}
p.hidden{height:1px;}
p.h1_top{
position:absolute;
top:5px;
left:0;}
p.h1_bottom{
width:150px;
padding-left:0px;
text-align:center;
margin:0 auto;
font-size:25px;
letter-spacing:2px;}
.h1_right{
position:absolute;
top:5px;
right:0;
font-size:16px;}
p.tel{
position:absolute;
top:30px;
right:0;
font-size:33px;
font-weight:bold;}
p.tel img{
max-width:100%;
width:28px;
vertical-align:top;}
p.tel a{
color:#f00;}
p.tel_bottom{
position:absolute;
top:60px;
right:0;
font-size:16px;}
p.fixed{
position:fixed;
top:120px;
right:15px;
z-index:999999;}


nav ul{
overflow:hidden;
margin-top:10px;
background:#f8f8f8;}
nav ul li{
float:left;
width:120px;
font-size:17px;
text-align:center;
border-left:solid 1px #AAA;
box-sizing:border-box;}
nav ul li:first-child{
border-left:none;}
nav ul li a{
display:block;
padding:12px 0 7px;
color:#7C3600;
border-bottom:5px solid transparent;}
nav ul li.now{
padding:12px 0 7px;
color:#7C3600;
border-bottom:5px solid #FF6666;}
nav ul li a:hover{
border-bottom:5px solid #F9C1C1;}

/*フッター*/
footer{
overflow:hidden;
background:-webkit-linear-gradient(bottom,#AAAAAA 0%,#FFF 60%,#AAA 100%);
background:-moz-linear-gradient(bottom,#AAAAAA 0%,#FFF 60%,#AAA 100%);
background:-ms-linear-gradient(bottom,#AAAAAA 0%,#FFF 60%,#AAA 100%);}

footer .content{
padding:20px 5px;
height:200px;}

footer p.banner{
float:left;
width:200px;
margin-left:50px;
line-height:1.5;}
footer p.first{
margin-left:0;}

#wrap02{
overflow:hidden;
float:left;
width:236px;
margin-left:50px;}
p.inner_top{
margin-bottom:10px;
font-size:15px;
line-height:1.2;}
p.inner_bottom{
text-align:right;}

iframe{
width:200px;
height:200px;
margin:0;
padding:0;}

#footer_sp{
display:none;}
/*===タブレット用===*/
@media screen and (max-width:959px){
.content{
width:100%;}

p.h1_top{
position:absolute;
width:230px;
top:5px;
left:5px;}

.h1_right{
font-size:14px;
right:5px;}
p.tel{
font-size:25px;
right:5px;}
p.tel_bottom{
right:5px;}
p.fixed{
top:170px;}

nav ul li{
width:25%;}
nav ul li:first-child,li:nth-child(5){
border-left:none;}
li:nth-child(5),li:nth-child(6),li:nth-child(7),li:nth-child(8){
border-top:solid 1px #AAA;}

footer .content{
width:630px;
margin:0 auto;}

footer p.banner{
width:200px;
margin-left:33px;}
footer p.first{
margin-left:0;}

#wrap02{
width:200px;
margin-left:33px;}
p.inner_top{
font-size:16px;
margin-bottom:10px;}
p.inner_bottom{
font-size:15px;
text-align:right;}

p.iframe{
display:none;}
}

/*===スマホ用===*/
@media screen and (max-width:699px){

p.kyuujin{
display:block;
position:absolute;
top:20px;
right:60px;
width:55px;}

tooter{
width:100%;
height:auto;}
footer .content{
display:none;}
h1{
text-align:left;
font-size:33px;
height:30px;}
h1 img{
width:45px;
max-width:100%;}
p.h1_bottom{
margin:0;
font-size:20px;
padding:10px 0 0 45px;
letter-spacing:1px;}
p.h1_top{
display:none;}
.h1_right{
display:none;}
p.tel{
display:none;}
p.tel_bottom{
display:none;}

p.fixed{
display:none;}

#footer_sp{
display:block;
text-align:center;
padding:10px 0 10px 0;}
#footer_sp p span{
font-size:20px;}



/*ハンバーガーメニュー*/
.btn {
display:block;
width:50px;
height: 50px;
border-radius: 10px;
background: #FFB5E5;
opacity:0.5;
position:relative;
position: fixed;
top:20px;
right:5px;
z-index:9999;}
.btn a {
display: block;
width: 50px;
height: 50px;}

.btn-icon {
display: block;
position: absolute;
top: 50%;
left: 50%;/*大体の位置を％で*/
width: 40px;
height: 3px;
margin: -1px 0 0 -20px;/*細かい調整はmarginで*/
background: #E71112;
transition: .2s;}

.btn-icon:before, .btn-icon:after {/*前後に同じものを作る*/
display: block;
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 40px;
height: 3px;
margin-left: -20px;
background: #E71112;
transition: .3s;}
.btn-icon:before {
margin-top: -15px;}
.btn-icon:after {
margin-top: 12px;}

/*クリックしたら追加されるスタイル*/
span.close {background: transparent;}/*透明*/
span.close:before, span.close:after {margin-top: 0;}
span.close:before {
-webkit-ransform: rotate(-45deg);
-moz-ransform: rotate(-45deg);
transform: rotate(-45deg);}/*回転*/
span.close:after {
-webkit-ransform: rotate(-135deg);
-moz-ransform: rotate(-135deg);
transform: rotate(-135deg);}

/*スライドで出てくるメニュー*/
.slide_nav {
background: #FFF;
opacity:0.8;
width: 50%;
height:100%;
display: none;
position: fixed;
top:0;
right:0;
z-index:9998;}

.slide_nav ul{
margin-top:120px;}
.slide_nav ul li{
width:100%;
height:40px;
font-weight:bold;
text-align:center;
border-bottom:1px solid #9E0C0D;}
.slide_nav ul li a{
display:block;
line-height:40px;
color:#E71112;}
.slide_nav ul li a:hover{
background:#9E0C0D;
color:#FFF;}
.slide_nav ul li.now_sp{
line-height:40px;
color:#E71112;
background:#F9BCBC;}

nav{display:none;}
}