@charset "utf-8";
/* CSS Document */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers 
*/
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
display: block;
}
body {font-family:ヒラギノ角ゴシック Pro, 'Hiragino Kaku Gothic Pro',游ゴシック体, 'Yu Gothic', YuGothic,  メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
line-height:1;
margin:0;}

blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}




/*---------------------------------------------------------------------*/
/*---------------------------    header   -----------------------------*/
/*---------------------------------------------------------------------*/


@media screen and (min-width: 480px){


header {  background:url(../img/mainvisual.png) no-repeat center top; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height:320px;
margin-left:auto;
margin-right:auto;
}

div.topmessage {background:#FFF;
height:25px;}

div.topmessage p {font-size:80%;
width:960px;
margin-left:auto;
margin-right:auto;
line-height:25px;}


div.title {width:960px;
margin-left:auto;
margin-right:auto;
padding-top:30px;
padding-bottom:30px;}
  
 h1 {overflow:hidden;
text-indent: 100%;
white-space: nowrap;
background:url(../img/header_logo.png) no-repeat;
background-position:left top;
width:284px;
height:66px;}

header nav {background-color:#000000;}


header ul {overflow:hidden;
list-style:none;
width:956px;
margin-left:auto;
margin-right:auto;
padding-left:2px;
}
header li {float:left;
border-left:1px solid #FFF;
height:50px;}
li:last-child {border-right:1px solid #FFF;}



header ul li a {color:#FFFFFF;
text-decoration:none;
display:block;
height:100%;
    line-height: 50px;
    padding-left: 53px;
    padding-right: 53px;}
header ul li a:hover {
background-color:#333333;}

header input {display:none;}
header label {display:none;}
#ham-menu {display:none;}
}


@media screen and (max-width: 479px){
header nav  {display:none;}

header {  background:url(../img/mainvisual.png) no-repeat center top; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height:170px;
margin-left:auto;
margin-right:auto;
}

div.topmessage {background:#FFF;
height:25px;
display:none;}

div.topmessage p {font-size:80%;
width:960px;
margin-left:auto;
margin-right:auto;
line-height:25px;
}


div.title {
padding-top:10px;
padding-bottom:10px;}
  
 h1 {overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: url(../img/header_logo.png) no-repeat;
    background-position: 20px top;
    background-size: contain;
    /* width: 284px; */
    height: 40px;}

header nav {background-color:#000000;}


header ul {overflow:hidden;
list-style:none;
margin-left:auto;
margin-right:auto;
padding-left:2px;
}
header li {

height:50px;}




header ul li a {color:#FFFFFF;
text-decoration:none;
display:block;
height:100%;
    line-height: 45px;
    padding-left: 53px;
    padding-right: 53px;}
header ul li a:hover {
background-color:#333333;}





#ham-menu ul {padding: 0px; /* 左の余白（箇条書きの「・」）削除 */}

#ham-menu a {display:block;
text-align: center;
text-decoration:none;
color:#FFF;
font-size:90%;
font-weight:bold;
padding:10px 0px 10px 0px;}

#ham-menu li {    list-style: none;
    border-bottom: 1px solid #CCC;
    padding-bottom: 10px;
    /* margin-bottom: 10px; */
    letter-spacing: 2px;}


#ham-menu li:last-child {border-bottom:none;}

 /*
header li:last-child  {width:166px;} 
 
header li+ li {
  border-left: 0;
  border-right: 2px solid #333;
}
*/


#ham-menu {
    background-color:#2B2B2B; /*メニュー背景色*/
    box-sizing: border-box;
    height: 100%;
    padding: 5px 10px; /*メニュー内左右上下余白*/
    position: fixed;
    right: -200px; /*メニュー横幅 width と合わせる*/
    top: 0;
    transition: transform 0.3s linear 0s; /*0.3s はアニメーションにかかる時間*/
    width: 200px; /*メニュー横幅*/
    z-index: 1000;
}

#menu-background {
    background-color: #333; /*黒背景*/
    display: block;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    transition: all 0.1s linear 0s; /*0.3s はアニメーションにかかる時間*/
    width: 100%;
    z-index: -1;
}

#menu-icon {
    background-color:#2B2B2B; /*アイコン部分背景色*/
    border-radius: 0 0 0 0px; /*左下角丸*/
    color:#FFFFFF; /*アイコン（フォント）色*/
    cursor: pointer;
    display: block;
    font-size: 50px; /*アイコン（フォント）サイズ*/
    height: 50px; /*アイコン縦高さ*/
    line-height: 40px; /*縦位置中央化*/
	position: fixed;
    z-index: 1;
	margin-top:0;
    right: 0;
    text-align: center;
    top: 0;
    width: 50px; /*アイコン横幅*/
    transition: all 0.3s linear 0s; /*0.3s はアニメーションにかかる時間*/
}

#menu-cb {
    display: none; /*チェックボックス本体は消しておく*/
}

#menu-cb:checked ~ #ham-menu,
#menu-cb:checked ~ #menu-icon {
    transform: translate(-200px); /*メニュー本体横幅 width と合わせる*/
}

#menu-cb:checked ~ #menu-background {
    opacity: 0.5;
    z-index: 999;
}





}






/*---------------------------------------------------------------------*/
/*---------------------------    footer   -----------------------------*/
/*---------------------------------------------------------------------*/

@media screen and (min-width: 480px){
footer {background-color:dimgray;
padding-top:30px;}


footer nav {width:960px;
margin-left:auto;
margin-right:auto;
padding-bottom:40px;
overflow:hidden;
}

footer div.leftbox {width:400px;
float:left;}

footer p {padding-left:75px;

color:#FFFFFF;
font-size:14px;
line-height:20px;
background:url(../img/footer_logo.png) no-repeat;
margin-bottom:10px;}

footer p span {font-size:16px;}

small {font-size:13px;
color:#FFF;
display:block;}

footer div.rightbox {width:400px;
float:right;
overflow:hidden;
padding-top:5px;}

footer a {display:block;
overflow:hidden;
text-indent: 100%;
white-space: nowrap;
width:182px;
height:57px;
float:left;
margin-top:10px;}


footer a.link1 {background:url(../img/link1.jpg);
margin-right:20px;}
footer a.link2 {background:url(../img/link2.jpg);}

footer a:hover {opacity:0.7;
}

}
@media screen and (max-width: 479px){
footer {background-color:dimgray;
padding-top:30px;}


footer nav {
margin-left:auto;
margin-right:auto;
padding-bottom:40px;
overflow:hidden;
}

footer div.leftbox {
}

footer p {    /* padding-left: 75px; */
    color: #FFFFFF;
    font-size: 14px;
    line-height: 22px;
    /* background: url(../img/footer_logo.jpg) no-repeat; */
    text-align: center;}

footer p span {font-size:16px;}

small {font-size:13px;
color:#FFF;
display:block;
line-height: 22px;
text-align:center;}

footer div.rightbox {
overflow:hidden;
padding-top:5px;}

footer a {display:block;
overflow:hidden;
text-indent: 100%;
white-space: nowrap;
width:182px;
height:57px;
margin: 0 auto;
margin-top:10px;}


footer a.link1 {background:url(../img/link1.jpg);
}
footer a.link2 {background:url(../img/link2.jpg);}


}

/*---------------------------------------------------------------------*/
/*---------------------------   common    -----------------------------*/
/*---------------------------------------------------------------------*/

@media screen and (min-width: 480px){
section {width:900px;
margin-left:auto;
margin-right:auto;
margin-bottom:60px;
border-radius: 10px 10px 0px 0px;
margin-top:-80px;
position:relative;
background-color:#FFFFFF;
padding-left:30px;
padding-right:30px;
padding-top:10px;}


h2 {color:#617437;
font-size:24px;
border-bottom:5px solid #617437;
padding-bottom:15px;
margin-bottom:15px;
padding-top:20px;}

section p {line-height:24px;
font-size:17px;
color:#617437;}

}


@media screen and (max-width: 479px){
section {    /* width: 98%; */
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    /* border-radius: 10px 10px 0px 0px; */
    margin-top: -80px;
    position: relative;
    background-color: #FFFFFF;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;}


h2 {color: #617437;
    font-size: 22px;
    border-bottom: 3px solid #617437;
    padding-bottom: 5px;
    margin-bottom: 15px;
    padding-top: 10px;}

section p {    line-height: 22px;
    font-size: 15px;
color:#617437;}

}

/*---------------------------------------------------------------------*/
/*---------------------------   company   -----------------------------*/
/*---------------------------------------------------------------------*/
@media screen and (min-width: 480px){
section#company p {margin-bottom:20px;
line-height:24px;
font-size:17px;
color:#617437;}

section#company dl {overflow:hidden;
width:900px;
border-bottom:dashed 1px #CFD5C3;
background-color:#EFF1EB;}


section#company dt {float:left;
width:160px;

font-weight:bold;
padding-left:40px;
line-height:24px;
padding-top:20px;
padding-bottom:20px;
border-top:dashed 1px #CFD5C3;}

section#company dd {float:left;
width:660px;
padding-left:40px;
line-height:24px;
padding-top:20px;
padding-bottom:20px;
background-color:#FFFFFF;
border-top:dashed 1px #CFD5C3;}

section#company span {display:block;
padding:10px 0 10px 0;}
}


@media screen and (max-width: 479px){
section#company p {margin-bottom:20px;
line-height:24px;
font-size:14px;
color:#617437;}

section#company dl {overflow:hidden;
width:100%;
border-bottom:dashed 1px #CFD5C3;
background-color:#EFF1EB;}


section#company dt {
font-weight: bold;
    /* padding-left: 40px; */
    line-height: 24px;
    /* padding-top: 20px; */
    padding: 10px;
    /* padding-bottom: 20px; */
    border-top: dashed 1px #CFD5C3;}

section#company dd {
padding-left: 40px; */
    line-height: 24px;
    /* padding-top: 20px; */
    padding: 10px;
    /* padding-bottom: 20px; */
    background-color: #FFFFFF;
    border-top: dashed 1px #CFD5C3;}

section#company iframe {width:90% !important;
display: block;
    margin: 0 auto;
    height: 400px;
    margin-bottom: 20px;}


section#company span {display:block;
padding:10px 0 10px 0;
font-size: 14px;}
}
/*---------------------------------------------------------------------*/
/*--------------------------- business    -----------------------------*/
/*---------------------------------------------------------------------*/
@media screen and (min-width: 480px){
/*
section#business {background-image:url(../img/business.png);
background-repeat:no-repeat;
padding-bottom:550px;
background-position:center bottom;}
*/
section#business article {overflow:hidden;
width:800px;
margin-left:auto;
margin-right:auto;
margin-top:30px;
margin-bottom:30px;
background-image:url(../img/businessbar.png);
background-repeat:no-repeat;
background-position:center center;}

section#business div{
background-color:#8F9D73;
width:220px;
height:220px;
float:left;
border-radius: 110px;
margin-right:40px;}

section#business div p {color:#FFF;
font-weight:bold;
font-size:22px;
text-align:center;
padding-top:80px;
line-height:30px;}

section#business div:first-child {margin-left:30px;}
section#business div:last-child {margin-right:0;}
}

@media screen and (max-width: 479px){
	/*
section#business {background-image: url(../img/business.png);
    background-repeat: no-repeat;
    padding-bottom: 200px;
    background-size: contain;
    background-position: center bottom;}
*/
section#business img {
	width:100%;
}

section#business article {overflow:hidden;
margin-left:auto;
margin-right:auto;
margin-top:30px;
margin-bottom:30px;
/*
background-image:url(../img/businessbar.png);
background-repeat:no-repeat;
background-position:center center;
*/
}

section#business div{margin-bottom: 15px;
    background-color: #8F9D73;
    height: 80px;
    /* float: left; */
    border-radius:10px;}

section#business div p {color: #FFF;
    font-weight: bold;
    font-size: 20px;
    text-align: center;
    /* padding-top: 80px; */
    line-height: 30px;
    padding-top: 10px;}


}


/*---------------------------------------------------------------------*/
/*---------------------------    motto    -----------------------------*/
/*---------------------------------------------------------------------*/

@media screen and (min-width: 480px){

section#motto {
/*
background-image:url(../img/motto.png);
background-repeat:no-repeat;
padding-bottom:500px;
*/
background-position:center bottom;}

section#motto p {margin-bottom:20px;
}

section#motto dl {width:850px;
margin-left:auto;
margin-right:auto;
background-color:#8F9D73;
border-radius:5px;
margin-bottom:25px;}

section#motto dt {text-align:center;
font-size:20px;
width:840px;
margin-left:auto;
margin-right:auto;
padding-top:20px;
padding-bottom:15px;
font-weight:bold;
color:#FFF;
border-bottom:#FFF 1px dashed;}

section#motto dd {text-align:center;
font-size:20px;
width:840px;
margin-left:auto;
margin-right:auto;
padding-top:20px;
padding-bottom:30px;
font-weight:bold;
color:#FFF;
line-height:30px;}
section#motto dl:last-child {padding-bottom:30px;}
}



@media screen and (max-width: 479px){
section#motto {    /* background-image: url(../img/motto.png); */
    background-size: contain;
    background-repeat: no-repeat;
    /* padding-bottom: 200px; */
    background-position: center bottom;}

section#motto p {margin-bottom:20px;
}

section#motto dl {width:98%;
margin-left:auto;
margin-right:auto;
background-color:#8F9D73;
border-radius:5px;
margin-bottom:25px;}

section#motto dt {text-align:center;
font-size:20px;

margin-left:auto;
margin-right:auto;
padding-top:20px;
padding-bottom:15px;
font-weight:bold;
color:#FFF;
border-bottom:#FFF 1px dashed;}

section#motto dd {text-align:center;
font-size:16px;
width:95%;
margin-left:auto;
margin-right:auto;
padding-top:20px;
padding-bottom:30px;

color:#FFF;
line-height:22px;}

section#motto dd br {display:none;}

section#motto dl:last-child {padding-bottom:30px;}
}

/*---------------------------------------------------------------------*/
/*---------------------------   contact   -----------------------------*/
/*---------------------------------------------------------------------*/

@media screen and (min-width: 480px){


section#contact p {padding-left:20px;}


section#contact span {color:#FF0000;
}

section#contact div {padding-top:20px;}

table {width:900px;
}


tr {border-top:1px dashed #CFD5C3;}

th {padding-top:25px;
padding-bottom:25px;
width:200px;
text-align:left;
padding-right:60px;
padding-left:20px;
white-space:pre;}

input {height:25px;
  width:350px;
border:2px solid #999;
font-size:105%;}

input.addressnumber {margin-bottom:20px;
width:130px;}

input.address {margin-bottom:20px;}


section#contact select {height:29px;
border:2px solid #999;
margin-bottom:20px;
width:134px;}







th.textarea {vertical-align:top;
padding-right:70px;}

textarea {margin-top:20px;
margin-bottom:20px;
width:500px;
height:200px;
border:2px solid #999;}

.sendbutton input {
display: block;
    /* font-weight: bold; */
    text-decoration: none;
    font-size: 18px;
    text-align: center;
    line-height: 35px;
    color: #FFF;
    width: 181px;
    height: 41px;
    background-color:#000;
    border-radius: 5px;
    margin-right: auto;
    margin-left: auto;
    /* margin-bottom: 60px; */
    border: 0;}
	
}



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


section#contact p {padding-left:20px;}


section#contact span {color:#FF0000;
}

section#contact div {padding-top:20px;}

table {
}


tr {border-top:1px dashed #CFD5C3;}

th {padding-top: 25px;
    padding-bottom: 25px;
    width: 40%;
    text-align: left;
    font-size: 14px;}

input {height:25px;

border:2px solid #999;
font-size:105%;}

input.addressnumber {margin-bottom:10px;
}

input.address {margin-bottom:10px;}


section#contact select {height:29px;
border:2px solid #999;
display: block;
}







th.textarea {vertical-align:top;
    padding-right: 10px;
	text-align:right;}

textarea {margin-top:20px;
margin-bottom:20px;
    width: 95%;
height:200px;
border:2px solid #999;}

.sendbutton input {
display: block;
    /* font-weight: bold; */
    text-decoration: none;
    font-size: 18px;
    text-align: center;
    line-height: 35px;
    color: #FFF;
    width: 181px;
    height: 41px;
    background-color:#000;
    border-radius: 5px;
    margin-right: auto;
    margin-left: auto;
    /* margin-bottom: 60px; */
    border: 0;}
	
}



