@charset "utf-8";

/* ==================================================
Common CSS
================================================== */

@media(max-width:959px){

/* common*/


/* header*/
header {
width:100%;
margin:auto;
padding:5vw 0 5vw;
position:relative;
}

header .logo {
width:50vw;
margin:auto;
}

header .logo img {
width:100%;
}


/* pagetitle*/
.title_area {
background:url(../img/bg.png);
padding:5vw 0;
margin-bottom:2vw;
}

.title_area .pagetitle {
width:100%;
margin:auto;
font-weight:bold;
font-size:5vw;
text-align:center;
}

.title_area .icon {
padding-right:1.5vw;
}


/* bread*/
.bread {
width:94%;
margin:auto;
text-align:left;
color:#c969696;
font-size:80%;
padding-bottom:9vw;
}


/* flexbox*/
.container {
width:94%;
margin:auto;
display:flex;
}

.container .left_nav {
display:none;
}

.container .cts {
width:100%;
}



/* nav*/
.menu_title {
padding-bottom:5px;
color:#999;
}

.nav {
background:#329600;
border-radius:10px;
margin-bottom:10px;
display:block;
}

.nav a {
padding:10px 20px;
text-decoration:none;
border-radius:10px;
display:block;
color:#fff;
}

.nav a:hover {
background:#007800;
border-radius:10px;
color:#fff;
}


/* cts*/
.cts {
}

.cts .cts_title {
color:#329600;
border-bottom:#329600 3px solid;
padding-bottom:1vw;
font-weight:bold;
}

.cts .infolist {
border-bottom:#c8c8c8 1px dotted;
padding:3vw 0;
display:flex;
}

.cts .infolist .photo {
width:20vw;
height:20vw;
margin-right:20px;
overflow:hidden;
}

.cts .infolist .photo img {
width:20vw;
height:20vw;
object-fit:cover;
}

.cts .infolist .ex {
width:70vw;
}

.cts .infolist .date {
color:#969696;
padding-bottom:0.5vw;
}

.cts .infolist .infoicon {
font-size:3vw;
padding:3px 5px;
color:#fff;
border-radius:3px;
margin-right:1vw;
}

.cts .infolist .infotitle {
font-weight:bold;
font-size:4.5vw;
padding-bottom:1vw;
}

.cts .infolist .infoex {
font-size:3.5vw;
}


/* pagenation*/
.pagenation {
padding:3vw 0 10vw;
display:flex;
justify-content:center;
}

.pagenation .btn {
border:#c8c8c8 1px solid;
border-radius:4px;
text-align:center;
font-size:3vw;
margin:0 1vw;
}

.pagenation a {
display:block;
padding:2vw 3vw;
text-decoration:none;
font-weight:normal;
color:#c8c8c8;
border-radius:4px;
}

.pagenation a:hover {
background:#eee;
}


/* detail*/
.cts .info {
padding:3vw 0 10vw;
}

.cts .info .ex {
width:100%;
}

.cts .info .date {
color:#969696;
}

.cts .info .infoicon {
font-size:3vw;
padding:3px 5px;
color:#fff;
border-radius:3px;
margin-right:1vw;
}

.cts .info .infotitle {
font-weight:bold;
font-size:6vw;
padding-bottom:3vw;
}

.cts .info .photo {
width:100%;
margin:0 auto 5vw;
}

.cts .info .photo img {
width:100%;
}

.cts .info .ex {
border-bottom:#c8c8c8 1px solid;
padding-bottom:7vw;
margin-bottom:3vw;
font-size:4vw;
}

.cts .back {
width:50%;
margin:auto;
border:#c8c8c8 1px solid;
border-radius:4px;
text-align:center;
font-size:4vw;
}

.cts .back a {
display:block;
padding:3vw 3vw;
text-decoration:none;
font-weight:normal;
color:#c8c8c8;
border-radius:4px;
}

.cts .back a:hover {
background:#eee;
}


/* footer*/
footer {
margin-top:10vw;
background:url(../img/bg.png);
}

footer .copyright {
width:94%;
margin:auto;
padding:3vw 0;
text-align:center;
font-size:3vw;
color:#787878;
}

}