@charset "utf-8";

/* ************************************************ 
*	会員交流事業
* ************************************************ */	
.list-block {
margin: 0 auto;
padding: 0 0 100px 0;
width: 1000px;
max-width: 90%;
}
.list-box {
margin: 0 auto 50px auto;
padding: 30px 0;
width: 100%;
background-color:#fff;
box-shadow: 0 0 5px #ccc;
border-radius: 15px;
position:relative;
z-index: 0;
}

.list-box-inner {
margin: 0;
padding: 20px 30px 60px 30px;
width: calc(100% - 60px);
background-color: #fff;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.list-box-inner h3.sub-title{
margin: 0 0 55px 0;
padding: 20px 0;
width: 100%;
color: #333;
font-size: min(2.4vw,24px);
align-content: center;
text-align: center;
font-weight: 500;
position: relative;
border-top: 10px solid #c1db81;
border-bottom: 10px solid #c1db81;
}

.list-box-inner__iconbox{
margin: 0 auto 30px auto;
padding: 0;
width: 100%;
align-content: center;
text-align: center;
}
.list-box-inner__iconbox img{
width: 70px;
}

.list-box-inner__left {
margin: 0;
padding: 0;
width: 33%;
}
.list-box-inner__right {
margin: 0;
padding: 0;
width: 63%;
}

.list-box-inner__left img{
margin: 0 0 20px 0;
width: 100%;
vertical-align: bottom;
}
.pdfdl-btn {
margin: 0 0 15px 0;
padding: 0;
width: 100%;
}
.pdfdl-btn a{
background-color:#fff;
border: 1px solid #333;
color: #333;
display: block;
line-height: 1.2;
text-decoration: none;
font-size: min(1.8vw,18px);
align-content: center;
height: 60px;
border-radius: 50vh; /* CSS3 */
position:relative;
padding-left: 75px;
}
.pdfdl-btn a::before {
position:absolute;
top: 15px;
left: 35px;
content:"";
display:inline-block;
width:30px;
height:32px;
background:url("../images/pdf_icon.png") no-repeat;
background-size:contain;
}
.pdfdl-btn a:hover{
color: #fff;
background-color:#000;
border-radius: 50vh; /* CSS3 */
}

.entry-btn {
margin: 0;
padding: 0;
width: 100%;
}
.entry-btn a{
background-color:#f4b4d0;
border: 1px solid #f4b4d0;
color: #fff;
display: block;
line-height: 1.2;
text-decoration: none;
font-size: min(1.8vw,18px);
text-align: center;
align-content: center;
height: 60px;
border-radius: 50vh; /* CSS3 */
}
.entry-btn a:hover{
color: #fff;
background-color: #88cccc;
border: 1px solid #88cccc;
border-radius: 50vh; /* CSS3 */
}

.cancel-btn {
margin: 0;
padding: 0;
width: 100%;
}
.cancel-btn a{
background-color:#ff0000;
border: 1px solid #ff0000;
color: #fff;
display: block;
line-height: 1.2;
text-decoration: none;
font-size: min(1.8vw,18px);
text-align: center;
align-content: center;
height: 60px;
border-radius: 50vh; /* CSS3 */
}
.cancel-btn a:hover{
color: #fff;
background-color: #b00000;
border: 1px solid #b00000;
border-radius: 50vh; /* CSS3 */
}
.entryclose-btn{
background-color:#a9a9a9;
border: 1px solid #a9a9a9;
color: #fff;
display: block;
line-height: 1.2;
text-decoration: none;
font-size: min(1.8vw,18px);
text-align: center;
align-content: center;
height: 60px;
border-radius: 50vh; /* CSS3 */
}

.list-box-inner__right .hsection{
margin: 0 0 30px 0;
padding: 0;
}
.list-box-inner__right h4{
margin: 0 0 10px 0;
padding: 0 10px;
width: calc(100% - 20px);
background-color: #888;
color: #fff;
font-size: min(1.8vw,16px);
align-content: center;
height: 35px;
font-weight: 500;
}
.list-box-inner__right p{
margin: 0;
padding: 0;
font-size: min(1.8vw,16px);
}

.listbox-more {
margin: 0;
padding: 20px 0 0 0;
text-align:center;
background-color:#fff;
width: 300px;
max-width: 100%;
}
.listbox-more a{
color: #333;
display: block;
padding: 10px 0 11px 0;
line-height: 200%;
text-decoration: none;
font-size: min(2vw,18px);
border: 1px solid #333;
border-radius: 50vh; /* CSS3 */
}
.listbox-more a:hover{
color: #fff;
background-color: #88cccc;
border: 1px solid #88cccc;
border-radius: 50vh; /* CSS3 */
}


/* ************************************************ 
*   レスポンシブ
* ************************************************ */
/* PC 画面の横幅が960px以上 */
@media only screen and (min-width: 960px){

}


/* Tablet (Portrait) 画面の横幅が768px〜959pxまで */
@media only screen and (min-width: 768px) and (max-width: 959px) {
.list-block { padding: 0 0 50px 0; }
.pdfdl-btn a{
padding-left: 47px;
}
.pdfdl-btn a::before {
top: 15px;
left: 15px;
width:28px;
height:30px;
}
}


/* Mobile (Portrait) 画面の横幅が767pxまで */
@media only screen and (max-width: 767px) {
.list-block { padding: 30px 0; }
.list-box-inner {
width: calc(100% - 20px);
padding: 10px 10px 30px 10px;
}
.list-box {
margin: 0 auto 50px auto;
padding: 20px 0;
}
.list-box-inner h3.sub-title{
margin: 0 0 30px 0;
font-size: 4.5vw;
text-align: left;
padding: 15px 0;
border-top: 5px solid #c1db81;
border-bottom: 5px solid #c1db81;
}

.list-box-inner__left {
margin: 0 0 30px 0;
width: 100%;
}
.list-box-inner__right {
margin: 0;
width: 100%;
}

.pdfdl-btn a{
font-size: 4.25vw;
height: 60px;
padding-left: 75px;
}
.pdfdl-btn a::before {
top: 15px;
left: 35px;
width:30px;
height:32px;
}

.entry-btn a{
font-size: 4.25vw;
height: 60px;
}
.cancel-btn a{
font-size: 4.25vw;
height: 60px;
}

.list-box-inner__right h4{
font-size: 4vw;
}
.list-box-inner__right p{
font-size: 4vw;
}

.listbox-more {
padding: 0;
width: 100%;
}
.listbox-more a{
font-size: 4.25vw;
}

}
