@charset "utf-8";

/*--------------------------------
	header
--------------------------------*/
.header {
    border-bottom: 2px solid #ECE2C0;
}

/*--------------------------------
	common
--------------------------------*/
.donation_list_wrap {
    padding-bottom: 11vw;
}
h1 {
    color: #492A13;
    font-size: 6vw;
    font-weight: bold;
    text-align: center;
    line-height: 1.2;
    letter-spacing: 0.2em;
    padding: 30px 0;
}

/* PC */
@media screen and (min-width: 641px) {
    .donation_list_wrap {
        padding-bottom: 60px;
    }
    h1 {
        font-size: 30px;
    }
}

/*--------------------------------
	支援先こども食堂一覧
--------------------------------*/
/*------------- アコーディオン -------------*/
.donation_list li {
    margin-bottom: 3%;
}
.donation_list li .acc_content {
    background: #FFFDF8;
    border: 1px solid #EDD9AF;
    border-radius: 8px;
    box-sizing: border-box;  
}
.donation_list li .acc_content dt {
    padding: 4% 8% 4% 3%;
    position: relative;
    cursor: pointer;
}
.donation_list li .acc_content dt::before {
    content: '';
    width: 2vw;
    height: 2vw;
    border: 0;
    border-bottom: solid 2px #A50707;
    border-right: solid 2px #A50707;
    position: absolute;
    top: 50%;
    right: 4%;
    margin-top: -6px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all .3s;
    transition: all .3s;
}
.donation_list li .acc_content dt .title_wrap {
    display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.donation_list li .acc_content dt .title_wrap .time {
    font-size: 4.5vw;
    font-weight: bold;
    letter-spacing: 0.1em; 
    line-height: 120%;
    color: #492A13;
}
.donation_list li .acc_content dt .title_wrap .term {
    font-size: 3.5vw;
    letter-spacing: 0.1em;
    line-height: 150%;
    color: #755008;
}
.donation_list li .acc_content dd {
    display: none;
}

/* アコーディオンオープン時 */
.donation_list li .acc_content dt.js-open::before {
    transform: rotate(-135deg);
}
.donation_list li .acc_content dd.js-open {
    display: block;
}

/* アイコン */
.donation_list li .acc_content .icon {
    font-size: 3.5vw;
    color: #ffffff;
    letter-spacing: 0.1em;
    border-radius: 3px;
    padding: 1.8% 2% 2%;
    margin-right: 4%;
    box-sizing: border-box;
}
.donation_list li .acc_content .icon_green {
    background: #036835;
}
.donation_list li .acc_content .icon_red {
    background: #A50707;
}
.donation_list li .acc_content .icon_blue {
    background: #1172B2;
}
.donation_list li .acc_content .icon_orange {
    background: #F76014;
}
.donation_list li .acc_content .icon_pink {
    background: #D71C48;
}

/* PC */
@media screen and (min-width: 641px) {
    .donation_list li {
        margin-bottom: 15px;
    }
    .donation_list li .acc_content dt {
        padding: 18px;
    }
    .donation_list li .acc_content dt::before {
        width: 10px;
        height: 10px;
    }
    .donation_list li .acc_content dt .title_wrap .time {
        font-size: 20px;
    }
    .donation_list li .acc_content dt .title_wrap .term {
        font-size: 14px;
    }
    .donation_list li .acc_content .icon {
        font-size: 14px;
        padding: 5px 7px;
    }
}

/*------------- table -------------*/
table {
    width: 100%;
}
th,td {
    border: solid 1px #EDD9AF;
    border-collapse: collapse;
    color: #492A13;

    padding: 13px 10px;
    text-align: center;
    font-size: 3.75vw;
    line-height: 1.3;
}
table tr th:first-of-type,
table tr td:first-of-type {
    border-left: none;
}
table tr th:last-of-type,
table tr td:last-of-type {
    border-right: none;
}
th {
    background: #FFF4CC;
}
td {
    background: #FFFDF8;
}
th.name {
    width: 70%;
}
th.area {
    width: 25%;
}
.bottom_text {
    font-size: 3.8vw;
    text-align: center;
    line-height: 160%;
    letter-spacing: 0.1em;
    padding: 5% 0; 
}

/* PC */
@media screen and (min-width: 641px) {
    .img_date {
        width: 480px;
        margin: 50px auto 20px;
    }
    th,td {
        font-size: 14px;
    }
    .bottom_text {
        font-size: 14px;
        padding: 30px 0; 
    }
}

/*--------------------------------
    バナーエリア
	bnr_area
--------------------------------*/
.bnr_area {
    background: none;
}

/*--------------------------------
    ボタンエリア
	btn_area
--------------------------------*/
.btn_area {
    padding: 0 5% 9%;
}