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

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;700&display=swap');

body {font-family: 'Noto Sans JP', sans-serif;}

/*共通レイアウト*/

body {background:#fff;}

a:hover {
filter:alpha(opacity=70);
opacity:0.7;
}

.bannerarea {
background:#a9d165;
padding:1em 15px;
text-align:center;
color:#fff;
}

.copyright {
background:#a9d165;
padding-bottom:1em;
text-align:center;
color:#fff;
}

.head-area {
font-size:16px;
padding:0.5em 1em;
line-height:1.7em;
border-bottom:5px solid #fff;
}

.head-area img {
float:right;
margin-top:0.4em;
}

.head-area h4 span {
font-size:20px;
font-weight:bold;
}

.body-area {
background:#eae8df;
padding:1em;
margin-bottom:1em;
}

.body-area p {
line-height:1.5em;
}

table.gaiyou th {
vertical-align:middle;
background:#eae8df;
padding:20px;
text-align:center;
color:#009574;
width:20%;/*35%*/
}

table.gaiyou td {
vertical-align:middle;
padding:20px;
color:#009574;
width:65%;
line-height:1.2em;
}

.head-area a:hover { filter:alpha(opacity=70); -moz-opacity:0.7; opacity:0.7; }

.head-area a { color:#000; text-decoration:none; }

div.tooltip {  
    width: 250px;  
    position: absolute;  
    left: -9999px;  
    background: #EEE;  
    padding: 5px;  
    border: 1px solid #AAA;  
}  
  
div.tooltip p{  
    color: #FFF;  
    background: #222;  
    padding: 5px 10px;  
} 

/*PCレイアウト*/
@media screen and (min-width:768px){

.background {
width: 100%;
height: 0;
padding-top: calc(858 / 1676 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
background: url(../img/mainvisual.png) center center / cover no-repeat;
}

.greeting {
/*background: url(../img/greeting.png) center no-repeat;
background-size: cover;*/
padding:0;
}

.greeting h1 {
font-size:20px/*20px*/;
line-height:1.5em;
margin:1.5em 0;
}

.greeting p {
font-size:25px;
line-height:1.5em;
margin-top:1em;
}

.philosophy {
background: url(../img/bg_philosophy_main.png) center no-repeat;
background-size: cover;
padding:100px 0 100px 0;
}

.philosophy table {
font-size:24px;
line-height:1.5em;
margin-top:2em;
}

section {
padding-top:100px/*5em*/;
padding-bottom:100px/*5em*/;
}

#news table {
margin-top:1em;
width:100%;
}

#news table tr {
border-bottom:1px solid #b0c285;
}

#news table td.icon {
width:20%;
padding:15px;
text-align:center;
vertical-align:middle;
}

#news table td.day {
width:25%;/*10*/
padding:15px;
text-align:center;
vertical-align:middle;
}

#news table td.msg {
width:70%;
padding:15px;
vertical-align:middle;
}

h2.title {
font-size:25px;/*35px*/
font-weight:bold;
font-family: "ＭＳ 明朝",serif;
}

h2.title span {
font-size:150%;
}

table.gaiyou {
font-size:20px;
width:100%;
border-bottom:1px solid #999999;
border-collapse:separate;
border-spacing:0px 5px;
} 

}


/*モバイルレイアウト*/
@media screen and (max-width:767px) { 
/*　画面サイズが767px以下の場合読み込む　*/

.background {
width: 100%;
height: 0;
padding-top: calc(1127 / 1000 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
background: url(../img/mainvisual_sp.png) center center / cover no-repeat;
}

section {
padding-top:50px/*2em*/;
padding-bottom:50px/*2em*/;
}

.greeting {
padding-top:2em;
/*padding-bottom:2em;*/
}

.greeting h1 {
font-size:20px;
line-height:30px;
}

.greeting p {
font-size:16px;
line-height:1.5em;
margin-top:1em;
}

.philosophy {
background: url(../img/bg_philosophy_main.png) center no-repeat;
background-size: cover;
padding:50px 0;
}

.philosophy table {
font-size:20px;
line-height:1.2em;
margin-top:1.5em;
}

#news table {
margin-top:1em;
width:100%;
font-size:12px;
}

#news table tr {
border-bottom:1px solid #b0c285;
}

#news table td.icon {
width:15%;
padding:10px 5px;
vertical-align:middle;
}

#news table td.day {
width:15%;
padding:10px 5px;
vertical-align:middle;
text-align:center;
}

#news table td.msg {
width:70%;
padding:10px 5px;
vertical-align:middle;
}

h2.title {
font-size:25px;
font-weight:bold;
line-height:1.5em;
font-family: "ＭＳ 明朝",serif;
}

h2.title span {
font-size:150%;
}

table.gaiyou {
font-size:14px;
width:100%;
}

table.gaiyou th {
width:100%;
display:block;
}

table.gaiyou td {
width:100%;
display:block;
}

}