﻿@charset "utf-8";

/*----------------------------------------------------------------

layout Set

----------------------------------------------------------------*/

/* Header
----------------------------------------------- */
header {
width: 100%;
padding: 0 0 0;
z-index: 100;
background: url(../images/header_bg.png) repeat-x center top;
position: relative;
font-size: 0.6em;
line-height: 1.5;
overflow: hidden;
border-bottom: 4px solid #e5e5e5;
}
hgroup {
width: 100%;
margin: 0 auto;
padding: 0;
position: relative;
}
header h1{
padding: 3px 2%;
text-align: center;
color: #fff;
background: url(../images/header_bg.png) repeat center top;
}
header p{
margin-bottom: 0.8em;
}

/* ロゴ */
header .logo {
font-size: 1em; 
margin: 10px 0 ;
padding: 0;
height: 50px;
text-align: center;
}
header .logo a {color: #333;}

header .address{ text-align: center;}


/* 768px～ Header用メディアクエリ開始 */
@media screen and (min-width : 768px) {
header {
font-size: 0.75em;
}
header .itemleft{
float: left;
max-width: 35%;
margin-left: 1%;
}
/* ロゴ */
header .logo {
font-size: 1em; 
margin: 18px 0 ;
padding: 0 0 0 ;
max-width: 94%;
height: auto;
}
header .address{
clear: both;
float: left;
text-align: left;
margin: 0 0 1em 1%;
}
header .info{
display: inline-block;
margin: 0 0 1em 1em ;
}

/* ヘッダーレスポンス */
#headerResponse{
float: right;
width: 64%;
position: relative;
margin: 18px 0 10px;
}
#headerResponse ul {
margin: 0 0 0;
padding: 0;
text-align: right;
}
#headerResponse ul li{
margin: 0;
display: inline-block;
vertical-align: top;
}
#headerResponse ul li.tel{
margin: 0 1% 0 0;
max-width: 59%;
}
#headerResponse ul li.cal{
margin: 0 1% 0 0;
max-width: 38%;
}
#headerResponse p{
margin: 10px 2% 0 0;
text-align: right;
}
}
/* 1024px～ Header用メディアクエリ開始 */
@media screen and (min-width : 1024px) {
/* ヘッダー */
header {
}
hgroup {
width: 1000px;
margin: 0 auto;
}
header h1{
padding: 2px 0 3px;
text-align: left;
background: none;
width: 1000px;
margin: 0 auto;
}
header p{
margin-bottom: 0.8em;
}

header .itemleft{
float: left;
max-width: 100%;
margin-left: 0;
}
/* ロゴ */
header .logo {
max-width: 100%;
height: auto;
}
header .address{
margin: 0 0 1em 5px;
}
header .info{
float: right;
margin: 0 0 1em 0;
}

/* ヘッダーレスポンス */
#headerResponse{
width: auto;
margin: 18px 0 10px;
}
#headerResponse ul {
}
#headerResponse ul li{
}
#headerResponse ul li.tel{
margin: 0 10px 0 0;
max-width: 100%;
}
#headerResponse ul li.cal{
margin: 0 0 0 0;
max-width: 100%;
}
}
/* END Header
----------------------------------------------- */


/* ヘッダー（見出し・画像）枠 */
#headline {
width: 100%;
padding: 0 0 0;
margin: 0 auto 0;
text-align : center;
position: relative;
clear: both;
}
#headline #headcopy {
margin: 0;
padding: 0;
}
#headline #headcopy p{
margin-bottom: 1em;
}
#headline #headcopy .arrow,#read .arrow{
width: 40px;
}

#read {
width: 94%;
margin: 1em auto 0;
text-align: left;
}
#navbtn{
margin: 1em 0 1em;
text-align: center;
}
#navbtn li{
display: inline-block;
text-align: center;
margin: 0 1% 1em;
max-width: 45%;
}

/* コンテンツ枠 */
#contents {
width : 100%;
margin : 0 auto;
text-align : center;
}

#privacy{padding-top: 100px}

/* メインコンテンツ */
#main {
width : 100%;
}

#main #postscript {margin-top: 40px;margin-bottom: 40px;}

section{
width : 92%;
margin : 0 auto;
}

/* コンテンツ内スタイル */
#contents .readcopy {
font-size: 22px;
padding-bottom: 20px;
}


/* fixedコンタクト
----------------------------------*/
#fixed_contact {
position: fixed;
bottom: 0;
width: 100%;
height: 64px;
text-align: center;
padding:5px 0 3px;
background: rgba(246, 246, 246, 0.9);
z-index: 1000;
}
#fixed_contact p {
font-size: 11px;
}
#fixed_contact .tel{
font-size:1.5em;
color:#ff9f00;
line-height:1.2;
}
#fixed_contact .tel span{
padding:0;
font-size:1.5em;
}
#fixed_contact .tel a{ color:#ff9f00;}

#fixed_contact .telimg{
float: left;
width: 72%;
text-align: center;
padding: 0 1%;
height: 62px;
}
#fixed_contact .btn{
float: right;
width: 26%;
text-align: left;
height: 62px;
}

/* PageTOP */
#pagetop {
position: fixed;
bottom: 70px;
right: 10px;
text-align: right;
padding:5px 0;
z-index: 1000;
}
#pagetop a img {
vertical-align: bottom;
width: 50px;
}

/* フッター */
footer {
text-align : center;
padding : 12px 2% 120px;
margin: 40px 0 0;
}
footer p {
margin: 1em 0;
color : #444;
text-align : center;
}
footer p a {color: #444;}
footer p a:hover { color: #444; text-decoration: none;}

footer .copy {
margin: 12px 0 0;
}

/* fixed_line_pc
----------------------------------------------- */
#fixed_line_pc{
display: none;
}


/* response
----------------------------------------------- */
.response{
text-align: center;
margin: 30px 0;
}
.response p{
text-align: center;
}
.response .contact-btn{
width: 100%;
text-align: center;
margin:15px auto 0;
border-radius:10px;
font-weight: bold;
}
.contact-btn a{
width: 90%;
margin:0 auto;
padding:5% 1%;
display: block;
text-decoration: none;
color:#fff;
text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
}
.contact-btn a:hover{
color:#fff;
}
.contact-btn:hover{
opacity: 0.8;
}

.response .contact-btn.tel{
background: #fa9038;
border-bottom: 6px solid #cb6919;
}
.contact-btn.tel span{
display: inline-block;
}
.contact-btn.tel .telnum{
font-family:Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 2em;
color: #ff0;
background: url(../images/common/icon_tel03.png) no-repeat left center;
background-size: 36px;
padding: 0 0 0 40px;
text-decoration: none;
}
.contact-btn.tel .sm{
font-size: 0.9em;
line-height: 1.5;
}
.contact-btn.line{
background: #00b900;
border-bottom: 6px solid #009d00;
}

/* 768px～ メディアクエリ開始 */
@media screen and (min-width : 768px) {
  
#headline #headcopy .arrow,#read .arrow{
width: 60px;
}

#navbtn li{
margin: 0 5px 1em;
max-width: 23%;
}


/* fixed_line_pc
----------------------------------------------- */
#fixed_line_pc{
z-index: 100;
display: block;
position: fixed;
bottom: 110px;
right: 0px;
width: 70px;
opacity: 0.9;
}

/* PageTOP */
#pagetop {
bottom: 10px;
right: 10px;
}
#pagetop a img {
vertical-align: bottom;
width: 70px;
}

footer {
margin: 80px 0 0;
padding: 0 0 40px;
}
.footertel {display: none;}

}

/* 1024px～ メディアクエリ開始 */
@media screen and (min-width : 1024px) {

/* ヘッダー（見出し・画像）枠 */
#headline {
background-size: auto;
margin: 0 auto 50px;
background: url(../images/main_bg.jpg) repeat-x center top;
}
#headline.subpage {
background: url(../images/main_bg_sub.png) repeat-x center bottom f9f5e9;
}
#headline #headcopy {
margin: 0;
padding: 0;
}
#headline #headcopy p {
text-align : center;
position: relative;
}
#headline #headcopy p img {
}

#read {
width: 1000px;
margin: 40px auto 80px;
text-align: center;
}
#read .bnr {
margin: 70px auto 70px;
}
#navbtn{
margin: 1em 0 3em;
}
#navbtn li{
margin: 0 5px 1em;
}


.inner{
width: 780px;
margin: 0 auto;
}

/* メインコンテンツ */
#contents {
width: 100%;
}
#main {
margin: 0 auto;
}
section{
width: 780px;
margin: 0 auto 20px;
background: #fff;
font-size : 1em;
}
section p{
}


/* fixed_line_pc
----------------------------------------------- */
#fixed_line_pc{
bottom: auto;
top: 40px;
right: 0px;
width: auto;
opacity: 1.0;
}

/* PageTOP */
#pagetop {
bottom: 30px;
right: 30px;
}


/* response
----------------------------------------------- */
.response{
text-align: center;
margin: 30px 0;
font-size: 1.3em;
}
.response .contact-btn{
width: 720px;
margin:20px auto 0;
}
.response .contact-btn .sp{
display: none;
}
.contact-btn a{
width: 90%;
margin:0 auto;
padding:4% 1%;
display: block;
text-decoration: none;
color:#fff;
text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
}
.contact-btn.tel a:hover{
color:#fff;
}

.contact-btn.tel .telnum{
background-size: 44px;
padding: 0 0 0 52px;
font-size: 2.5em;
}



} /* 1024px～ メディアクエリ終了 */
