@charset "utf-8";
/*==================================================
    固定ページ、投稿ページ、アーカイブページ　共通
==================================================*/
 
/*--------------------------------------------------
    page_title
--------------------------------------------------*/
.page_title{
    text-align: center;
    padding: 20px 10px;
    margin-bottom: 30px;
}
.page_title h1{
    font-size: var(--22px);
    font-weight: bold;
}
.page_title h1 span{
    display: block;
    font-size: var(--14px);
}
/*--- 各子ページ ---*/
.page.child_page .page_title{
    margin-top: 30px;
}

/*--------------------------------------------------
    notice
--------------------------------------------------*/
.notice{
    max-width: 980px;
    margin: 60px auto;
    border: double 2px #756111;
    padding: 40px;
    text-align: center;
}
.notice p{
    padding-bottom: 0px;
}
.notice span{
    display: inline;
    text-decoration: underline;
    font-weight: bold;
    padding: 0px 5px;
}
.notice .text{
    margin-top: 20px;
}
.notice .text p{
    font-weight: bold;
}

.notice .contact_link_btn{
    width: 40%;
    border-radius: 5px;
}
/*--------------------------------------------------
    heading
--------------------------------------------------*/
.page.archive .heading{
    padding: 20px 10px;
    margin-bottom: 30px;
}
.page.archive .heading h2{
    color: #756111;
    border-left: solid 8px #756111;
    padding-left: 10px;
    font-size: var(--22px);
    font-weight: bold;
}

/*==================================================
    sessionページ
==================================================*/

/*--------------------------------------------------
    料金
--------------------------------------------------*/
.price table{
    max-width: 600px;
    width: 100%;
    margin: 0px auto;
    border-collapse: collapse;
}
.price table th,.price table td{
    border: solid 1px #756111;
    padding: 10px;
}
.price table th{
    font-weight: bold;
}
.price table td{
    text-align: center;
    font-weight: bold;
}
.price table td.heading_td{
    font-weight: bold;
}

/*--------------------------------------------------
    よくあるご相談
--------------------------------------------------*/
.session_item_warp{
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    list-style: none;
}
.session_box{
    width: calc((100% - 60px) / 3);
    border: solid 2px #756111;
    display: flex;
    flex-direction: column;   
}
.session_box h3{
    background: #756111;
    text-align: center;
    color: #fff;
    padding: 10px 0px;
}
.session_text{
    padding: 10px 10px 10px 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1;
}
.session_text ul{
    list-style-type: disc;
}
.session_text .link_page_button{
    width: 100%;
    margin: 20px auto 20px;
    text-align: center;
    border: solid 2px #756111;
}
.session_text .link_page_button a{
    display: block;
    color: #756111;
    text-decoration: none;
    padding: 10px;
    font-size: var(--14px);
    transition: 0.3s;
}
.session_text .link_page_button a::before{
    content: "→";
    padding-right: 5px;
}
.session_text .link_page_button a:hover{
    transform: scale(1.1);
    font-weight: bold;
}

/*--------------------------------------------------
    session 各ページ
--------------------------------------------------*/

/*--- top_message.session_top ---*/
.top_message.session_child_top{
    max-width: 600px;
    width: 100%;
    margin: 0px auto;
}
.top_message.session_child_top p{
    font-weight: bold;
}
/*--- session_child ---*/
.session_child{
    position: relative;
    max-width: 680px;
    margin: 0 auto 60px;
    border: 1px solid #756111;
    border-radius: 5px;
}
.session_child .heading{
    background-color: #756111;
    color: #fff;
    padding: 8px 10px;
    position: absolute;
    top: -0.8em;
    left: 1em;
    display: inline-block;
    border-radius: 5px;
    width: auto;
    max-width: calc(100% - 2em);
    white-space: nowrap;
    overflow: hidden;
}
.session_child .contents{
    padding: 40px 20px;
}

/*==================================================
    seminar
==================================================*/
.seminar{
    position: relative;
    max-width: 680px;
    margin: 0 auto 60px;
    border: 1px solid #756111;
    border-radius: 5px;
}

.seminar .heading{
    background-color: #756111;
    color: #fff;
    padding: 8px 10px;
    position: absolute;
    top: -0.8em;
    left: 1em;
    display: inline-block;
    border-radius: 5px;
    width: auto;
    max-width: calc(100% - 2em);
    white-space: nowrap;
    overflow: hidden;
}
.seminar .heading h2{
    font-size: var(--16px);
    letter-spacing: 0.2em;
}
.seminar .contents {
    padding: 40px 20px;
}

/*==================================================
    spiritual-item
==================================================*/
.item_box{
    display: flex;
    align-items: center;
    border: solid 2px #756111;
    border-radius: 5px;
    padding: 20px;
}
.item_box img{
    max-width: 30%;
    width: 100%;
}
.item_box .text{
    flex: 1;
    padding-left: 20px;
}
.item_box .text p{
    padding-bottom: 10px;
}
.item_box .text .item_btn{
    display: block;
    max-width: 300px;
    width: 100%;
    margin-top: 20px;
    background-color: #756111;
    color: #fff;
    text-align: center;
    padding: 10px 10px;
    border-radius: 5px;
    font-size: var(--14px);
    text-decoration: none;
}

/*--------------------------------------------------
    spiritual_item
--------------------------------------------------*/
.spiritual_item .heading{
    text-align: center;
    margin-bottom: 40px;
}
.spiritual_item .heading h2{
    font-size: var(--22px);
    font-weight: bold;
}

/*--- item_warp ---*/
.spiritual_item .item_warp{
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}
.spiritual_item .item_warp .item_box{
    max-width: 100%;
    width: calc((100% - 80px) / 3);
    flex-direction: column;
    padding-top: 40px;
}
.spiritual_item .item_warp .item_box img{
    max-width: 100%;
    width: 100%;
}
.spiritual_item .item_warp .item_box .item_text{
    padding: 20px 10px;
}
.spiritual_item .item_warp .item_box .item_text .item_link_btn{
    display: block;
    text-align: center;
    background-color: #756111;
    color: #fff;
    font-size: var(--14px);
    padding: 10px;
    text-decoration: none;
    border-radius: 10px;
    margin-top: 20px;
}
.spiritual_item .item_warp .item_box .item_text .item_link_btn::before{
    content: "▶︎";
    padding-right: 5px;
}
.spiritual_item .item_warp .item_box .item_text .item_link_btn:hover{
    font-weight: bold;
}

/*==================================================
    カレンダー
==================================================*/
.calendar{
    max-width: 780px;
    width: 100%;
    margin: 0px auto;
}
.calendar .calendar_title{
    text-align: center;
}
.calendar .calendar_title h2{
    font-size: var(--18px);
    font-weight: bold;
}
.calendar .calendar_title p{
    text-align: right;
    font-size: var(--14px);
}
.calendar .calendar_contents table{
    width: 100%;
    border-collapse: collapse;
}
.calendar .calendar_contents table th,.calendar .calendar_contents table td{
    border: solid 1px #ccc;
    padding: 10px 10px;
}
.calendar .calendar_contents table th{
    width: 90px;
}
.calendar .calendar_contents table td p{
    text-align: center;
}
.calendar .calendar_contents table .sunday{
    background-color: rgb(255, 0, 0, 0.2);
    color: #333;
}
.calendar .calendar_contents table .saturday{
    color: #333;
        background-color: rgb(0, 0, 255, 0.2);
}
/*==================================================
    レスポンシブ
==================================================*/

/*--------------------------------------------------
    960px以下
--------------------------------------------------*/
@media screen and (max-width: 959px) {
	/* 959px以下に適用されるCSS（タブレット用） */

    /*--- 共通 ---*/
    /*notice*/
    .notice{
        text-align: center;
    }
    
    .notice p{
        display: inline-block;
        text-align: left;
    }
}