@charset "utf-8";

/* 初期設定リセット */
  
*{margin: 0;padding: 0}
  
a { color: #333; text-decoration : none}
ul.lsnone, ol.lsnone { list-style : none}
ul {padding: 0; margin: 10px 20px;line-height: 1;}
img {
vertical-align : middle;
max-width : 100%;
}

p { color: #333; font-family: "メイリオ","Meiryo";}

/* 基本設定 */

@-o-viewport {
width : 320px;
zoom:1.0}

html {
font-family : verdana, sans-serif;
line-height : 1.5;
}

h1,h2,h3,h4,h5,h6 { margin-bottom : 24px}
h1 {font-size: 42px; line-height: 1}
h2 {font-size : 36px;line-height : 1.25}
h3{font-size : 30px;line-height : 1.25}
hgroup h2,h4,h5,h6 {font-size : 16px;line-height : 1.25}

.mg24 {margin : 24px;}

/* ヘッダー */
header {
padding: 0 0 5px 10px;
border-bottom: 5px solid #d6d6d6;
position: relative;
text-align: center;
}

/* ロゴ・サイトタイトル */
.logo {
font-size: 30px; 
margin: 0;
display: block;
}

.logo a {color: #000;}

/* 電話番号など */
.tel {
font-size: 24px; 
margin: 0;
display: block;
}

/* ヘッダー見出し */
.headline {
background: #55c2c2;
padding: 0 0 20px;
}

/* ヘッダー画像 */
.photo {margin: 15px auto 0;text-align: center;}

/* 問い合わせボタン */
#title .order a, #hb .order a {
display: block;
margin: 15px  auto;
padding: 15px 0;
width: 310px;
text-align: center;
-moz-border-radius: 15px 15px 15px 15px;
-webkit-border-radius: 15px 15px 15px 15px;
border-radius: 15px 15px 15px 15px;
background: #ff9900;
font-size: 24px;
color: #fff;
}

#title .order a:hover, #hb .order a:hover {background: #ffcc00;}

/* ページタイトル */
#title h1 {
margin-bottom : 24px;
padding: 24px 0;
margin : 0 auto;
color: #fff;
line-height: 1.25;
width : 90%;
}

/* ページタイトル2 */
#title h2 {
color: #fff;
margin : 0 auto;
font-size : 28px;
line-height: 1.25;
font-weight: normal;
width : 90%;
}

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

/* メインコンテンツ */
#main {
width : 90%;
margin : 0 auto;
padding: 20px 0;
font-size : 22px;
}

/* コンテンツ内 画像 シャドウ無し */
#contents img.snone {box-shadow : none;}

/* コンテンツ見出し */
h3 {
margin: 24px 0;
padding: 12px 0 12px 10px;
text-align: left;
border-left: 5px solid #25b0c1;
color: #094164;
}

/* コンテンツ見出し2 */
.header {
font-weight: bold;
text-align: left;
color: #cc0000;
margin-bottom : 12px;
font-size : 24px;
}

/* コンテンツ要素 */
#contents p { 
font-size : 0.7em;
margin-bottom : 12px;
text-align : left;
}

#contents li { 
margin-bottom : 12px;
text-align : left;
}

#contents img { 
margin : 12px 0 12px; 
box-shadow : 0 0 6px #ccc;
}

.more {
background: #ff9900;
color: #fff;
display: inline;
padding: 2px 5px;
margin: 10px;
float: right;
font-size: 14px;
}

.snone {box-shadow: none;}

#contents .order img {box-shadow: none;}

/* フッター */
footer {
color : white;
text-align : center;
padding : 24px 0;
margin: 0;
background : #2a7c9b;
}
footer p {color: #fff;}
footer a {color: #fff;}

/* テーブル */
table {margin:0 auto;}
th, td {border: 1px solid #ccc;}

.bdn th, .bdn td {border: none;}

/* ボックス */
.box {
margin: 0 0px 20px;
padding: 10px;
border: 3px solid #25b0c1;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border-radius: 10px 10px 10px 10px;
}

/* 見出し付きボックス */
.pbox {
margin: 0 0px 20px;
padding: 10px;
border: 3px solid #ff9900;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border-radius: 10px 10px 10px 10px;
text-align: left;
}

/* ボックス見出し */
.ptitle {
-moz-border-radius: 10px 10px 0px 0px;
-webkit-border-radius: 10px 10px 0px 0px;
border-radius: 10px 10px 0px 0px;
background: #ff9900;
color: #fff;
text-align: left;
font-size: 18px;
margin: 20px 0 0 0;
padding: 5px 10px;
font-weight: bold;
}

/* フッター問い合わせ */
#hbottom {
background:  #25b0c1;
padding: 5px 0;
margin: 0;
border-top: 10px solid #2a7c9b;
color: #fff;
clear: both;
}

.pc {display: none;}

/* サイドバー見出し */
.sideheader {
padding: 10px 0;
margin: 0 auto;
-moz-border-radius: 0 0 0 0;
-webkit-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
background: #2a7c9b;
color: #fff;
}

/* サイドバーメニューリスト */
#side ul {margin: 0 ;padding: 0; list-style: none;}

#side li {margin: 0;}

#side li a {
display: block;
padding: 15px 0 15px 15px;
margin: 0;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-left: 1px solid #ccc;
font-size: 14px;
background: #fefefe;
}

#side li a:hover {
background: #eee;
}

/* パンくず */
.bread {
text-align: left;
margin: 5px 0;
font-size: 12px;
}

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

/* ヘッダー */
header {
padding: 5px 0;
border-bottom: 10px solid #d6d6d6;
text-align: left;
}

/* ロゴ・サイトタイトル */
.logo {
font-size: 24px; 
margin: 0 0 0 20px;
display: inline-block;
*float:left;
}

/* 電話番号など */
.tel {
font-size: 24px; 
margin: 0 20px 0 0;
display: inline-block;
float: right;
}

/* ヘッダー見出し */
.headline {padding:0 0 30px;}

/* コンテンツ要素 */
#contents p {font-size : 1em; text-align: left}
.header {text-align: left}
h3 {text-align: left}
#hb {padding: 20px 0;}
.sp {display: none;}
.pc {display: inline-block;}

} /* 768px～1023px メディアクエリー終了 */

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

/* 基本設定 */
#title, #contents {width: 900px; margin: 0 auto;}

/* ヘッダー */
header {
text-align : left;
margin: 0;
padding: 15px;
position: relative;
}

/* ヘッダー（見出し・画像）背景 */
#header {
background: #55c2c2;
border-bottom: 10px solid #2a7c9b;
}

/* ヘッダー内部 */
hgroup {width: 1000px; margin: 0 auto;}

/* コンテンツ枠 */
#contents {
width: 1000px;
margin: 0 auto;
}

#contents:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/* ヘッダー（見出し・画像）枠 */
#title {
width: 1000px;
height: 330px;
padding: 0;
margin: 0 auto;
text-align : left;
position: relative;
}

/* ヘッダー問い合わせ */
#title .order a {
position: absolute; left: 60px; bottom: 20px;
width: 400px;
}

/* ヘッダー見出し枠 */
.headline {
width: 540px;
background: #55c2c2;
}

/* ヘッダー見出し */
#title .headline h1 {padding: 40px 0 20px;}
#title .headline h2 {padding: 0;font-size : 24px;}

/* ヘッダー画像 */
.photo {
height: 330px;
position: absolute; top: 0px; right: 0px;
text-align: center;
background: #fff;
margin: 0;
}

/* メインコンテンツ */
#main
{
width: 740px;
margin: 0 auto;
padding: 10px 0;
background: #fff;
font-size : 1em;
float: left;
}

/* コンテンツ画像 */
#contents .photo img {padding: 0; margin: 0;}

/* サイドバーメニューリスト */
#side
{
width: 240px;
margin: 30px auto 0;
padding: 0;
background: #fff;
font-size : 1em;
float: right;
}

#menu1, #menu2 {
width: 250px;
margin: 0 0 20px;
}

/* サイドバーメニュー見出し */
.sideheader {
padding: 10px 0;
margin: 0;
-moz-border-radius: 10px 10px 0 0;
-webkit-border-radius: 10px 10px 0 0;
border-radius: 10px 10px 0 0;
}

#side li a {
margin: 0;
}

/* フッター問い合わせ背景 */
#hbottom {
background: #25b0c1;
padding: 0;
margin: 0;
border-top: 7px solid #2a7c9b;
}

/* フッター問い合わせ */
#hb {
width: 1000px;
height: 100px;
margin: 0 auto;
padding: 10px 0;
position: relative;
}

#hb .order a {width: 400px;}

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