@charset "UTF-8";
/* ----------------------------------------------------------------------------------------------------
*  info.css
* --------------------------------------------------------------------------------------------------*/
.post-list_wrap{
    padding: 103px 0;
    box-sizing: border-box;
}
.post-info .post{
    position: relative;
    padding-left: 25px;
    border-bottom: 1px solid #b1b1b1;
    box-sizing: border-box;
}
.post-info .post:first-of-type{ border-top: 1px solid #b1b1b1;}
.post-info .post a{
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 25px 50px 25px 0;
    box-sizing: border-box;
}

.post-info .post a:after,
.post-info .post a:before{
    position: absolute;
    right: 20px;
    top: 50%;
    display: block;
    content: "";
}
.post-info .post a::before{
    box-sizing: border-box;
    width: 26px;
    height: 26px;
    background: #f7293c;
    transform: translateY(-50%);
    -webkit-border-radius: 50%;
    border-radius: 50%;
}
.post-info .post a::after{
    right: 33px;
    margin-top: -1px;
    width: 7px;
    height: 7px;
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
    -webkit-transform: rotate(45deg) translateY(-50%);
    transform: rotate(45deg) translateY(-50%);
}

.post-info .post .post-date{
    order: 1;
    width: 100%;
    font-size: 1.6rem;
    font-weight: 900;
    color: #515151;
    letter-spacing: .12em;
}
.post-info .post .post-ttl{
    order: 2;
    font-size: 1.6rem;
    letter-spacing: .12em;
    line-height: calc(26 / 16);
}

@media screen and (max-width: 767px) {
    .post-list_wrap{
        padding: 13.333vw 0;
    }
    .post-info .post{ padding-left: 0;}
    .post-info .post a{
        padding: 5% 7vw 5% 0;
    }

    .post-info .post a::before{
        right: 0;
        width: 3.8vw;
        height: 3.8vw;
    }
    .post-info .post a::after{
        right: 1.85vw;
        width: 1.2vw;
        height: 1.2vw;
    }
    .post-info .post .post-date{
        font-size: 2.4vw;
    }
    .post-info .post .post-ttl{
        font-size: 3.733vw;
    }
}
/* ----------------------------------------------------------------------------------------------------
*  detail.css
* --------------------------------------------------------------------------------------------------*/
.post-detail_wrap{
    padding: 95px 0 105px 0;
    box-sizing: border-box;
}
.post-detail_wrap.post-info .post{
    padding-bottom: 52px;
    margin-bottom: 65px;

}
.post-detail_wrap.post-info .post:first-of-type{ border-top: none;}

.post-detail_wrap .post-head{
    padding-bottom: 20px;
    border-bottom: 1px solid #b1b1b1;
    margin-bottom: 50px;
    box-sizing: border-box;
}
.post-detail_wrap .post-head .post-ttl{
    font-size: 2.4rem;
    font-weight: 700;
    letter-spacing: .12em;
    line-height: calc(26 / 24);
    margin-bottom: 8px;
}
.post-detail_wrap .post-head .post-date{
    font-size: 1.6rem;
    color: #515151;
}

.post-detail_wrap .post-cnts a{
    display: inline;
    text-decoration: underline;
}
.post-detail_wrap .post-cnts a:hover{
    text-decoration: none;
}
.post-detail_wrap .post-cnts a:before,
.post-detail_wrap .post-cnts a:after{ display: none;}
.post-detail_wrap .post-cnts p{
    font-size: 1.6rem;
    line-height: calc(26 / 16);
    margin-bottom: 40px;
}
.post-detail_wrap .post-cnts h2{
    position: relative;
    font-size: 2.0rem;
    font-weight: 700;
    line-height: calc(26 / 20);
    margin-bottom: 10px;
    padding-left: 15px;
}
.post-detail_wrap .post-cnts h2:before{
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    content: '';
    width: 3px;
    height: 80%;
    background: #f7293c;
    box-sizing: border-box;
}

.post-detail_wrap .post-cnts h3{
    font-size: 1.8rem;
    font-weight: 700;
    color: #f7293c;
    line-height: calc(26 / 18);
    margin-bottom: 12px;
}
.post-detail_wrap .post-cnts div + h3,
.post-detail_wrap .post-cnts p + h3,
.post-detail_wrap .post-cnts img + h3{ margin-top: 55px;}

.post-detail_wrap .post-cnts ul,
.post-detail_wrap .post-cnts ol{ margin-bottom: 20px;}
.post-detail_wrap .post-cnts ul li{ list-style: disc; list-style-position: inside;}
.post-detail_wrap .post-cnts ol li{ list-style: decimal; list-style-position: inside;}
.post-detail_wrap .post-cnts .aligncenter{
    display:block;
    margin:0 auto;
    text-align: center;
}

.post-detail_wrap .post-cnts .alignright{
	float:right;
}

.post-detail_wrap .post-cnts .alignleft{
	float:left;
}


@media screen and (max-width: 767px) {
    .post-detail_wrap{
        padding: 12vw 0 13.333vw 0;
    }
    .post-detail_wrap.post-info .post{
        padding-bottom: 7.333vw;
        margin-bottom: 8.667vw;
    }
    .post-detail_wrap .post-head{
        padding-bottom: 5%;
        margin-bottom: 8%;
    }
    .post-detail_wrap .post-head .post-ttl{
        font-size: 5.067vw;
        line-height: 1.3;
        margin-bottom: 0;
    }
    .post-detail_wrap .post-head .post-date{
        font-size: 3.733vw;
    }

    .post-detail_wrap .post-cnts p{
        font-size: 3.733vw;
        margin-bottom: 6%;
    }
    .post-detail_wrap .post-cnts h2{
        font-size: 4.8vw;
    }
    .post-detail_wrap .post-cnts h2:before{
        height: 90%;
    }

    .post-detail_wrap .post-cnts h3{
        font-size: 4vw;
    }
    .post-detail_wrap .post-cnts div + h3,
    .post-detail_wrap .post-cnts p + h3,
    .post-detail_wrap .post-cnts img + h3{ margin-top: 7.333vw;}

    .post-detail_wrap .post-cnts ul,
    .post-detail_wrap .post-cnts ol{ margin-bottom: 5%;}
    .post-detail_wrap .post-cnts .alignright,
    .post-detail_wrap .post-cnts .alignleft{
        float:none;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }
    .post-detail_wrap .post-cnts img{
        width: auto;
    }
    .post-detail_wrap .post-cnts iframe{
        width: 100%;
        height: 51vw;
    }
}