@charset "utf-8";

@media print,screen and (min-width: 769px) {

.sp{
    display: none;
}

body{
    background-color: #007a00;
}

#wrapper{
    position: relative;
    overflow: hidden;
    background-color: #fff;
    line-height: 2em;
    font-size: medium;
}


#wrapper .inner{
    width: 900px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}



#back{
    position: absolute;
    left: 0;
    top: 0;
}

#back .left{
    position: absolute;
    left: 0;
    top: 0;
    background-image: url(../img/back_left.png);
    width: 300px;
}


#back .right{
    position: absolute;
    left: 0;
    top: 0;
    background-image: url(../img/back_right.png);
    background-position: 0 -500px;
    width: 300px;
}


header{
    position: relative;
}

header .title{
    background-image: url(../img/title.png);
    width: 320px;
    height: 387px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
    margin-bottom: 50px;
    text-align: center;
    overflow: hidden;
    text-indent: -9999px;
}

header .menu{
    position: relative;
    margin-top: 100px;
    text-align: center;
    width: 100%;
    z-index: 100;
    height: 118px;
    display: flex;
    justify-content: center;
}


header .menu li{
    display: block;
    position: relative;
    width: 118px;
    height: 118px;
    margin-left: 5px;
    margin-right: 5px;
}
header .menu li a{
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 118px;
    height: 118px;
}

header .menu li a:hover{
    opacity:0.7;
    -webkit-opacity:0.7;
}



footer{
    position: relative;
    z-index: 1;
    background-image: url(../img/foot_back.png);
    -webkit-background-size: 100% 137px;
    background-size: 100% 137px;
    width: 100%;
    height: 137px;
}

footer .copyright{
    text-align: center;
    color: #fff;
    font-size:11px;
    padding-top: 95px;

}

section {
    width: 900px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 80px;
    text-align: center;
}
.txt_l  {
    text-align: left;
    margin-bottom: 20px;
}
.txt_r  {
    text-align: right;
    margin-bottom: 20px;
}
.bold {
    font-weight: bold;
    font-size: 110%;
}

.cap {
    font-size: 90%;
    padding-top: 10px;
}


#content{
    margin-top: 100px;
    position: relative;
    margin-bottom: 120px;
}
#content p {
    padding-bottom: 20px;
}
#content .tit  {
    padding-bottom: 40px;
}
#message {
    margin-left: auto;
    margin-right: auto;
}
#feature .ill {
    padding-top: 30px;
}
#activity .ill  {
    margin-bottom: 50px;
    margin-top: 20px;
}
#profile .illarea  {
    position: relative;
    width: 880px;
    height: 620px;
    margin-left: auto;
    margin-right: auto;
}
#profile .illarea .ill1 {
    position: absolute;
    top: 90px;
    left: 240px;
    z-index: 5;
}
#profile .illarea .ill2 {
    position: absolute;
    top: -10px;
    left: 5px;
    z-index: 1;
}
#profile .illarea .ill3 {
    position: absolute;
    top: 340px;
    z-index: 10;
}
#profile .illarea .ill4 {
    position: absolute;
    left: 600px;
    z-index: 5;
}
#profile .illarea .ill5 {
    position: absolute;
    left: 500px;
    top: 315px;
    z-index: 10;
}
#peoples .clm1 .fl_l  {
    text-align: left;
    float: left;
    width: 530px;
}
#peoples .clm1 .fl_r  {
    text-align: left;
    float: right;
    width: 345px;
    margin-top: 0px;
}
#peoples .clm1 .tit   {
    margin-left: -30px;
}
#peoples .clm1 .photo   {
    margin-top: 45px;
    text-align: left;
}
#peoples .clm2 {
    text-align: left;
}
#peoples .clm2 .tit  {
    margin-left: -30px;
    text-align: left;
}
#peoples .clm2 .box {
    margin-bottom: 30px;
}
#peoples .clm2 .people {
    text-align: left;
    width: 430px;
}
#peoples .clm2 .box .fl_l {
    float: left;
    text-align: left;
}
#peoples .clm2 .box .fl_r {
    float: right;
    text-align: left;
}
#peoples .clm2 .txt  {
    text-align: left;
}
#peoples .clm2 .photo  {
    width: 130px;
    float: right;
    padding-left: 10px;
    padding-bottom: 10px;
    text-align: justify;
}
#peoples .clm2 .bold  {
    font-weight: bold;
}
#peoples .clm2 .cap {
    padding-bottom: 10px;
    font-size: 90%;
}
#peoples .clm2 .box .center {
    text-align: center;
}

#info .infoarea {
    background-image: url(../img/info_line.png);
    background-repeat: no-repeat;
    background-position: center top;
}
#info .infoarea .news {
    text-align: left;
    background-image: url(../img/info_line.png);
    background-repeat: no-repeat;
    background-position: center bottom;
    line-height: 1.4em;
    padding-top: 10px;
}

#info .infoarea .news .a_news {

}




#info .infoarea .news .a_news .stit {
    font-weight: bold;
    line-height: 1.75em;
    padding-bottom: 0;
    padding-left: 10px;
    padding-top: 10px;
    font-size: 120%;
    text-align: center;
}


#info .infoarea .news .a_news .body  {
    margin-top: 5px;
    line-height: 1.75em;
}

.infoarea .calendar {
    margin-bottom: 20px;
    margin-top: 10px;
    padding-bottom: 20px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}
.infoarea .calendar tr td {
    padding-top: 10px;
    vertical-align: top;
    padding-bottom: 10px;
    padding-right: 10px;
    padding-left: 10px;
}
.infoarea .a_news .calendar.u_boder  {
    border-bottom: 1px solid #86CA71;
    padding-bottom: 50px;
}
.infoarea .calendar tr .day {
	white-space: nowrap;
	padding-bottom: 5px;
	padding-right: 10px;
}
.infoarea .calendar tr .time {
    padding-right: 20px;
    white-space: nowrap;
    text-align: right;
    width: 25%;
}
.infoarea .calendar tr .txt {
    width: calc(100% - 25% - 50px);
    padding-bottom: 20px;
}
.infoarea .calendar tr  .con {
    white-space: nowrap;
    text-align: left;
}

#discussion .coming {
    font-size: 150%;
    color: #86CA71;
    margin-top: 50px;
}
.green {
	color: #007A00;
	font-weight: bold;
}
}





@media only screen and (max-width: 768px) {

.pc{
        display: none !important;
}

#wrapper{
    background-color: #D93336;
}
	
	
#info .infoarea .news .a_news {
    font-size: 120%;
}
#info .infoarea .news .a_news .calendar .con {

}



}
