@charset "UTF-8";

#wrapper {
background:#fff;}
.container {
padding:77px 0;}
.contents {
position:relative;
width:94%;
max-width:1050px;
margin:0 auto;}

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

.container {
padding:7.7% 0;}

}

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

.container {
padding:50px 0;}
.contents {
width:90%;}

}

/* contents ========================*/

.contents-txt {
position:relative;}

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

.contents-txt {
text-align:left;}
.contents-txt br {
display:none;}

}

/* smenu ================== */

.smenu {
margin:0 auto;
width:100%;
max-width:900px;
justify-content:space-between;}
.smenu li {
width:24%;
padding:0 0 2% 0;}
.smenu li a {
position:relative;
display:block;
line-height:48px;
white-space:nowrap;
overflow:hidden;
color:#008400;
background:rgba(255,255,255,0.4);
border:1px solid #008400;
transition:0.3s;}
.smenu li:last-child a {
color:#fff;
background:#008400;}
.smenu li a:hover {
color:#fff;
border:1px solid #e80;
background:#e80;}
.smenu li a::after {
content:"";
position:absolute;
z-index:2;
right:6px;
top:50%;
width:5px;
height:5px;
border-right:1px solid #008400;
border-bottom:1px solid #008400;
transform:translate(0,-50%) rotate(-45deg);
transition:0.3s;}
.smenu li:last-child a::after {
border-right:1px solid #fff;
border-bottom:1px solid #fff;}
.smenu li a:hover::after {
border-right:1px solid #fff;
border-bottom:1px solid #fff;}

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

.smenu li {
width:49%;}

}

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

.smenu li a {
font-size:3.4vw;}
.smenu li a::after {
display:none;}

}

/* footer =======================*/

.f-menu {
width:100%;
background: -moz-linear-gradient(top, #d44182, #e8498f);
background: -webkit-linear-gradient(top, #d44182, #e8498f);
background: linear-gradient(to bottom, #d44182, #e8498f);
box-shadow:0 2px 3px 0 rgba(0,0,0,0.2);}
.f-menu ul {
width:100%;
max-width:1000px;
margin:0 auto;
border-right:1px solid #f599c2;}
.f-menu li {
width:25%;
font-size:90%;
line-height:50px;
white-space:nowrap;
border-left:1px solid #f599c2;}
.f-menu li a {
display:block;
color:#fff;
transition:0.3s;}
.f-menu li a:hover {
background:#ee8800;}

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

.f-menu li {
width:50%;
border-bottom:1px solid #f599c2;}

}

.footer {
padding:35px 0 0 0;
background:rgba(255,255,255,0.67);
font-size:90%;}
.footer .logo {
width:80%;
margin:0 auto 10px;}

.copyright {
text-align:left;
margin:30px 0 0 0;
padding:0 15px;
font-size:12px;
line-height:45px;
background:rgba(190,220,200,0.5);
white-space:nowrap;
overflow:hidden;}

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

.copyright {
font-size:2vw;}

}

.page-top {
position:fixed;
z-index:999;
bottom:0;
right:0;
width:44px;
height:44px;}
.page-top a {
padding:14px;
display:block;
background:#008400;
transition:0.3s;}
.page-top a:hover {
background:#e80;}