@charset "utf-8";

#main {
margin:0;
height:420px;
position:relative
}

#main > div {
width:100%;
height:420px;
margin:0 auto;
position:relative
}

#main div img {
width:100%;
position:absolute;
top:0;
right:0;
z-index:1
}

#main div a {
width:100%;
padding:0;
color:#fff;
display:block;
position:absolute;
top:170px;
left:0;
z-index:10000
}

#main div a h2 {
width:70%;
height:120px;
margin:0 auto;
padding:20px;
font-size:1.2em;
line-height:1.2;
background:url(../img/main_title_bg.png) repeat
}

#main div a span {
width:70%;
height:38px;
margin:0 auto;
padding:7px 0 0 40px;
font-size:1.3em;
line-height:1.5;
display:block;
background:-moz-linear-gradient(left,#b9cf28,#22a372);
background:-webkit-linear-gradient(left,#b9cf28,#22a372);
background:linear-gradient(to right,#b9cf28,#22a372);
position:relative
}

#main div a span .maru {
position:relative
}

#main div a span .maru::before {
position:absolute;
content:'';
width:26px;
height:26px;
background:#fff;
border-radius:50%;
top:-23px;
right:15px;
margin-top:-7px
}

#main div a span .maru::after {
position:absolute;
content:'';
width:10px;
height:10px;
border-top:solid 2px #22a271;
border-right:solid 2px #22a271;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
top:0;
right:24px;
margin-top:-23px
}

#emergency {
width:96%;
margin:20px auto 0
}

#emergency h3 {
padding:10px 15px 8px;
font-size:1em;
font-weight:400;
line-height:1;
color:#fff;
display:inline-block;
background:#b7183e
}

#emergency .wrap {
padding:10px 10px 10px 50px;
font-size:1.1em;
line-height:1.5;
color:#b7183e;
border:solid 5px #b7183e;
background:url(../img/emergency_icon.jpg) top left no-repeat;
background-position:9px 9px
}

#emergency.information h3 {
background:#002C69
}

#emergency.information .wrap {
color:#002C69;
border:solid 5px #002C69;
background-image:none;
padding-left:20px
}

#photo_info {
width:96%;
margin:20px auto 0;
display:flex;
flex-wrap:wrap
}

#photo_info figure {
width:33%;
height:150px;
margin:1px 1px 2px 0;
overflow:hidden;
position:relative
}

#photo_info figure img {
max-height:100%
}

#photo_info .sankaku {
border-style:solid;
border-width:0 0 15px 15px;
border-color:transparent transparent #22a271;
position:absolute;
right:0;
bottom:0
}

#photo_info figcaption {
width:100%;
height:100%;
font-size:.9em;
letter-spacing:0;
font-weight:700;
line-height:1.2;
color:#fff;
position:absolute;
left:0;
bottom:0;
background:-moz-linear-gradient(top,rgba(0,0,0,0) 10%,rgba(0,0,0,0.8));
background:-webkit-linear-gradient(top,rgba(0,0,0,0) 10%,rgba(0,0,0,0.8));
background:linear-gradient(to bottom,rgba(0,0,0,0) 10%,rgba(0,0,0,0.8))
}

#photo_info figcaption span {
display:block;
position:absolute;
bottom:10px;
left:10px
}

.sectionBox {
width:100%;
margin:50px auto 0;
overflow:hidden;
background:-moz-linear-gradient(top,#ebf6f6,#dcf1e9);
background:-webkit-linear-gradient(top,#ebf6f6,#dcf1e9);
background:linear-gradient(to bottom,#ebf6f6,#dcf1e9)
}

.sectionBoxInner {
width:100%;
margin:50px auto
}

#news {
width:96%
}

#news h3 {
width:80%;
margin:0 auto 30px;
font-size:1em;
font-weight:400;
text-align:center
}

#news h3 img {
margin:0 auto 20px;
display:block
}

#news a.to_list {
margin:0 auto 30px;
display:block
}

#news ul {
width:100%;
display:flex;
flex-wrap:wrap;
justify-content:center
}

#news ul li {
width:50%;
height:256px;
padding:0;
position:relative;
background:#fff
}

#news ul li a {
color:#131313;
display:block
}

#news ul li div {
width:100%;
height:131px;
margin:0;
overflow:hidden
}

#news ul li div img {
max-width:100%;
margin:0 auto;
display:block
}

#news ul li p {
height:87px;
padding:20px;
font-size:.9em;
letter-spacing:.05em;
line-height:1.5;
background:url(../img/news_line.gif) right center no-repeat
}

#news ul li:nth-child(even) p {
background:none
}

#news ul li p span {
width:100%;
font-size:.8em;
text-align:center;
color:#727272;
position:absolute;
left:0;
bottom:10px
}

#info {
width:100%;
padding-top:50px
}

#info h3 {
margin-bottom:30px
}

#info h3 img {
margin:0 auto 20px;
display:block
}

#info a.to_list {
margin:0 auto 30px;
display:block
}

#info ul {
width:96%;
margin:0 auto;
padding:5px 0;
background:#fff
}

#info ul li {
padding:11px;
cursor:pointer;
border-top:solid 1px #e6e6e6
}

#info ul li:nth-child(1) {
border:none
}

#info ul li a p {
font-size:.85em;
line-height:1.5;
letter-spacing:.03em;
color:#131313
}

#info ul li a p span {
margin-bottom:10px;
font-size:.8em;
line-height:1;
color:#727272;
display:block
}

#info ul li a p span.category {
margin-top:4px;
margin-bottom:0
}

.remodal dl {
color:#131313
}

.remodal dl dt {
padding:0 0 10px;
text-align:center
}

.remodal dl dd {
text-align:left
}

#event {
width:100%;
margin:0 auto;
padding:0 0 50px;
background:#dcf1e9
}

#event > div {
width:100%;
margin:0 auto;
position:relative
}

#event h3 {
width:80%;
margin:0 auto 30px;
font-size:1em;
font-weight:400;
text-align:center
}

#event h3 img {
margin:0 auto 20px;
display:block
}

#event a.to_list {
margin:0 auto 30px;
display:block
}

#event ul {
width:96%;
margin:0 auto;
display:flex;
flex-direction:row;
flex-wrap:wrap;
justify-content:flex-start
}

#event ul li {
width:48%;
margin:0 auto 15px;
background:#fff
}

#event ul li a {
color:#131313;
display:block
}

#event ul li div {
width:100%;
height:126px;
overflow:hidden
}

#event ul li div img {
max-width:100%
}

#event ul li dl {
padding:10px;
line-height:1.3
}

#event ul li dl dt {
padding-bottom:10px;
font-size:.9em;
font-weight:700
}

#event ul li dl dd {
font-size:.8em
}

#awords {
width:100%;
margin:0 auto;
padding:50px 0 150px;
background:#f6ffff url(../img/awords_bg_sp.png) bottom center no-repeat;
background-size:100%
}

#awords h3 img {
max-width:100%;
margin:0 auto 30px;
display:block
}

#awords .awordsInner {
width:100%;
margin:0 auto;
padding:0;
position:relative
}

#awords p {
padding:0;
color:#22a271;
text-align:center;
line-height:0
}

#awords p b {
padding:5px 10px;
font-size:.95em;
line-height:1.2;
text-align:center;
display:inline-block;
border:solid 2px #22a271
}

#awords p span {
padding:0;
font-size:3em;
letter-spacing:0
}

#awords ul.awords_photo {
width:280px;
height:280px;
padding-top:33px;
margin:30px auto;
background:url(../img/awords_leaf_bg_sp.png) top center no-repeat;
background-size:auto 280px
}

#awords ul.awords_photo li img {
width:200px;
height:200px;
overflow:hidden;
border-radius:50%;
margin:0 auto
}

#awords .awords_details {
width:80%;
margin:0 auto;
border-bottom:solid 2px #22a372
}

#awords dl {
font-size:1em;
letter-spacing:.1em;
line-height:1.3;
text-align:center
}

#awords dl dt {
padding:10px;
background:#22a372
}

#awords dl dt span {
width:100%;
margin:0 auto;
display:block;
color:#fff
}

#awords dl dd {
padding:6px 0;
text-align:center;
color:#22a271
}

a.to_list {
width:70px;
height:15px;
padding:6px 0 5px 10px;
font-size:.83em;
letter-spacing:0;
line-height:1;
color:#fff;
display:inline-block;
background:#22a271
}

.maru {
position:relative
}

.maru::before {
position:absolute;
content:'';
width:20px;
height:20px;
background:#fff;
border-radius:50%;
top:-9px;
right:3px;
margin-top:-7px
}

.maru::after {
position:absolute;
content:'';
width:6px;
height:6px;
border-top:solid 2px #22a271;
border-right:solid 2px #22a271;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
top:0;
right:10px;
margin-top:-10px
}

.sns ul {
padding:30px 0;
display:flex;
flex-wrap:wrap;
justify-content:center
}

.sns ul li {
margin:5px 10px;
border-radius:3px
}

.sns ul li a {
width:150px;
height:57px;
padding:10px 0 0 70px;
line-height:1.5;
color:#fff;
display:block
}

.sns ul li a span {
display:block
}

.sns ul li:nth-child(1) {
background:url(../img/sns_f.png) top left no-repeat #3b5998
}

.sns ul li:nth-child(2) {
background:url(../img/sns_t.png) top left no-repeat #55acee
}

.sns ul li:nth-child(3) {
background:url(../img/sns_y.png) top left no-repeat red
}

.banner {
width:100%;
margin:0;
background:#131313
}

.banner ul {
width:100%;
margin:0 auto;
padding:20px 62px
}

.banner ul li {
width:100%;
margin:0 2px;
border:solid 1px #999
}

.banner ul img {
max-width:100%;
margin:0 auto;
display:block
}

.basename {
text-transform:uppercase
}