@charset "UTF-8";

/*-----------------------------------------------
地域交流推進センター__common
-----------------------------------------------*/
body {
font-family: -apple-system,BlinkMacSystemFont,"Montserrat","Noto Sans JP", "游ゴシック Medium", "Yu Gothic Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
}

/*header*/
#visual .h1-bar small {
    margin-top: 10px;
}

header#side h1 {
    border-bottom: 2px solid #ddd;
}

/*footer*/
footer .information > p {
    margin-bottom: 20px;
}

footer .information .cont_footer_img {
    margin-bottom: 30px;
}

footer a img {
    transition: all ease .3s;
}

footer a:hover img {
    opacity: 0.7;
}

/*breadcrumbs*/
#breadcrumbs ul > li a {
    color: #B08ECE!important;
}

/*gl_nav*/
#gl_nv > li > a {
    font-family: "Montserrat", -apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,"Noto Sans JP", "游ゴシック Medium", "Yu Gothic Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif!important;
    font-size: 90%;
}

#gl_nv > li > a::before {
    background: #702AAD!important;
}

#gl_nv > li > a::after {
    border-right: 2px solid #B08ECE!important;
    border-bottom: 2px solid #B08ECE!important;
}

#gl_nv > li > a:hover {
    background: rgba(176,142,206,0.3)!important;
}

#gl_nv > li > a.current {
    background: #B08ECE!important;
}

#gl_nv > li > a.current::after {
    border-color: #fff!important;
}

/*h1*/
.u_contents .edit .cont_h1 {
    font-size: 1.3em;
    padding: 16px 16px 16px 26px;
    box-sizing: border-box;
    margin-bottom: 1em;
    border-bottom: 1px solid #ddd;
    border-left: none;
    position: relative;
}

.u_contents .edit .cont_h1::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    width: 10px;
    height: 86%;
    background-color: #EBDB3B;
    margin-right: 0.25em;
}

/*h3*/
.u_contents .edit h3 {
    border-radius: 0.5em;
}

/*h4*/
.u_contents .edit h4.cont_h4 {
    border-left: 3px solid #EBDB3B;
}

.cont_cl {
    padding: 20px 10px!important;
}

.cont_em_bd {
    border-bottom: 2px solid #333;
}

.cont_tel {
    color: #212121!important;
    text-decoration: none!important;
}

/*pdf*/
.edit .cont_btn a[href$=".pdf"]::after {
    content: none;
}

/*btn*/
.cont_btn {
    margin-bottom: 80px;
}

.cont_btn a {
    display: table;
    border-radius: 30px;
    padding: 10px 30px;
    text-align: center;
    color: #fff!important;
    text-decoration: none !important;
    background-color: #B08ECE;
    box-shadow: 0 0 10px 0 rgba(179,49,247,0.1);
    transition: all ease .3s;
    min-width: 100px;
}

.cont_btn a:hover {
    color: #fff !important;
    background-color: #BFA2DD;
    box-shadow: 0 0 15px 0 rgba(179,49,247,0.2);
    transform: translateX(7px);
}

/*-----------------------------------------------
0_index__トップページ
-----------------------------------------------*/
.cont_top_h2 {
    font-size: 200%;
    text-align: center;
}

.cont_top_desc {
    margin-top: 85px;
    margin-bottom: 85px;
}

.cont_top_desc a,
.cont_top_link a {
    color: #3d69f2;
    text-decoration: underline;
}

.cont_top_desc a:hover,
.cont_top_link a:hover {
    text-decoration: none;
}

.cont_top_link a {
    font-size: 17px;
}

.cont_top_desc > p {
    text-align: center;
    margin-top: 25px;
    line-height: 2.5;
}

.cont_top_link > h2 {
    font-size: 35px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 30px;
}

section.cont_top_link {
    margin-bottom: 90px;
}

section.cont_top_link a:hover img {
    opacity: 0.7;
}

section.cont_top_link img {
    transition: all ease .3s;
}

/*pdf*/
.cont_top_desc a[href$=".pdf"]::after {
    content: "picture_as_pdf";
    display: inline-block;
    font-family: 'Material Icons';
    color: #333;
    vertical-align: middle;
    margin-left: 5px;
    font-weight: normal;
    font-style: normal;
    font-size: 100%;
    line-height: 1;
    letter-spacing: normal;
    text-transform:  none;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smothing: antialiased;
}

/*-----------------------------------------------
1_history__沿革
-----------------------------------------------*/

/*-----------------------------------------------
2_citizen__市民公開講座
-----------------------------------------------*/
table.cont_table {
    max-width: 580px!important;
    margin: 0 0 20px 0;
}

table.cont_table tr {
    max-width: 580px!important;
}

@media screen and (max-width:999px){
    .cont_tel_tablet {
        color: #3d69f2 !important;
        text-decoration: underline !important;
    }
}
/*-----------------------------------------------
3_pharmacist-course__薬剤師生涯教育講座
-----------------------------------------------*/
.pharmacist_desc {
    margin-bottom: 50px;
}

/*-----------------------------------------------
4_yakusou__薬草園の一般公開
-----------------------------------------------*/


/*-----------------------------------------------
5_teach-yakudai__教えて！薬大先生
-----------------------------------------------*/
.teach_img_box {
    width: 350px!important;
    padding-right: 20px;
}

/*-----------------------------------------------
6_reccurent__リカレント講座
-----------------------------------------------*/

/*-----------------------------------------------
7_volunteer__ボランティアサークル
-----------------------------------------------*/
.vaccine_img_box {
    width: 350px!important;
    padding-right: 20px;
}

.edit .l_btn > a::after {
    color: #fff;
}

/*-----------------------------------------------
8_vaccine__ワクチン啓発
-----------------------------------------------*/

/*-----------------------------------------------
9_other__その他（講演会等）
-----------------------------------------------*/
#entry_page #left_box .img_box ul {
    padding-top: 30px;
}

#entry_page .img_box ul {
    flex-direction: column;
}

.img_box ul {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}

#entry_page .img_box ul li {
    width: 100%;
    padding-bottom: 20px;
}

.img_box ul li {
    margin-bottom: 20px;
}

.img_box li a {
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: relative;
    transition: all ease .5s;
    text-decoration: none !important;
    color: #212121 !important;
}

#entry_page .img_box ul li figure {
    width: 200px;
    padding-top: 25%;
}

.img_box li figure {
    margin: 0;
    padding: 0;
    width: 50%;
    padding-top: 50%;
    position: relative;
    overflow: hidden;
    transition: all ease .3s;
}

.img_box li figure img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: all ease .3s;
}

.img_box li figure::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: #000;
    pointer-events: none;
    opacity: 0;
    transition: all ease .3s;
}

.img_box li a:hover figure::after {
    opacity: 0.2;
}

.img_box li a:hover figure img {
    transform: scale(1.1);
}

.img_box li a:hover figure {
    border-radius: 20px;
}


#entry_page .img_box dl {
    width: calc(100% - 250px);
}

.img_box dl {
    width: 45%;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    line-height: 1.2;
    transition: all ease .5s;
}

.img_box li dt {
    font-size: 1.2em;
    font-weight: bold;
    border-top: 2px solid #ddd;
    border-bottom: 2px solid #ddd;
    padding: 15px 0;
    margin-bottom: 1em;
    position: relative;
}

.img_box li dt::before {
    content: "";
    position: absolute;
    left: 0;
    top: -2px;
    width: 15%;
    height: 1px;
    border-top: 2px solid #702AAD;
}

.img_box li dd {
    font-size: 90%;
}

.img_box li dd small {
    display: block;
    color: #888;
    margin-bottom: 1em;
}

.img_box li dd small {
    display: block;
    color: #888;
    margin-bottom: 1em;
}

.img_box li a:hover dl {
    transform: translateX(10px);
}

#right_box dl a, .pager a {
    color: #B08ECE;
}

@media screen and (max-width:999px) {
    #entry_page .news_box ul li figure {
        padding-top: 25%;
        width: 25%;
    }

    #entry_page .news_box dl {
        width: 70%;
    }

}