/**
 * Category & Tearm Styles
 */

@charset "UTF-8";

/* Tax Description
	 ========================================================================== */

.taxonomy-description {
    background-color: rgba( 255, 255, 255, 0.2);
    padding: 20px;
    margin: 0 0 30px;
}
.taxonomy-description p {
    margin: 0;
}

/* Tearm Information
	 ========================================================================== */

.tearm-information {
    margin: 0 0 30px;
    position: relative;
    z-index: 2;
}
.tearm-information .tearm-list {
    width: 100%;
    height: 40px;
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    margin: 0 0 10px;
}

.tearm-information .page_info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: column-reverse;
}
.tearm-information .count-guide {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 16px;
    width: 100%;
}
.tearm-information .count-guide p {
    margin: 0;
    font-size: 0.875rem;
}
.tearm-information .count-guide p .num {
    font-size: 1rem;
    font-weight: 600;
}
.tearm-information .count-guide .count-items {
    margin: 0 1rem 0 0;
}
.tearm-information .post-order {
    width: 100%;
}
.tearm-information .post-order select {
    width: 100%;
    margin-bottom: 20px;
    line-height: 1.2;
    padding: 10px;
}

/* display_selectedItem
	 ========================================================================== */

#dsi-menu {
	display: none;
}
.tearm-list {
    width: 50%;
    height: 40px;
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    margin: 0 0 20px;
}
.tearm-list .select_box {
    width: 100%;
    height: 40px;
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
}
#dsi-menu:checked ~ .tearm-list .select_box {
    height: inherit;
    overflow: inherit;
}
.tearm-list .select_box li {
    box-sizing: border-box;
    height: 40px;
    border-bottom: none;
}
.tearm-list .select_box li label,
.tearm-list .select_box li a {
    display: flex;
    height: 100%;
    align-items: center;
    padding: 0 8px;
	cursor: pointer;
}
.tearm-list .select_box li label {
	color: #707070;
}
.tearm-list .select_box li label:hover {
	border: 1px solid #c5c5c5;
}
#dsi-menu:checked ~ .tearm-list .select_box li label {
	border: 1px solid #c5c5c5;
}
.tearm-list .select_box li label::after,
.tearm-list .select_box li a::after {
    content: '';
    position: absolute;
    top: inherit;
    right: 10px;
    width: 7px;
    height: 12px;
    display: inline-block;
    -webkit-mask-image: var(--arrow-img-ic);
    -webkit-mask-size: cover;
    mask-image: var(--arrow-img-ic);
    mask-size: cover;
    transform: translateY(-50%);
    transform: rotateZ(90deg);
    opacity: 0.3;
}
.tearm-list .select_box li a:hover::after {
    opacity: 1;
    transform: inherit;
}
#dsi-menu:checked ~ .tearm-list .select_box li label::after {
	transform: scale(1, -1);
    transform: rotateZ(-90deg);
}

/* cat post list
	 ========================================================================== */

.type-grid {
    margin: 0 0 40px;
}
.type-grid .post {
    padding: 0 0 20px;
    margin: 0 0 30px;
}
.type-grid .post.post:last-child {
    margin: 0 0 0;
    border-bottom: none;
}
.type-grid .post-header {
    margin: 0 0 20px;
}
.type-grid .post-title {
    margin: 0 0 10px;
    font-size: 1.5rem;
    line-height: 1.2;
}
.type-grid .post-header .time {
    display: inline-block;
    font-size: 0.875rem;
    line-height: 1.2;
    padding: 10px 0 0 0;
}
.post-li .blogimg {
    position: relative;
    overflow: hidden;
    margin: 0 0 15px;
}
.post-li .blogimg a {
	display: block;
}
.post-li .blogimg a::before {
    content: '';
    display: block;
    padding-top: 56.25%;
}
.post-li .blogimg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

/**
* 16.1 Mobile Large 620px
*/
@media screen and (min-width: 38.75em) {

	/* cat post list
		 ========================================================================== */

    .post-li .entry-content-excerpt {
        display: flex;
        justify-content: space-between;
    }
    .post-li .blogimg {
        width: 150px;
    }
    .post-li .blog-post-wrap {
        width: 100%;
    }
    .post-li .blogimg + .blog-post-wrap {
        width: calc(100% - 180px);
    }

}

/**
* 16.2 Tablet Small 740px
*/
@media screen and (min-width: 46.25em) {

	/* Tearm Information
		 ========================================================================== */

    .tearm-information {
        display: flex;
        align-items: center;
    }
    .tearm-information .tearm-list {
        width: 33%;
        margin: 0 20px 0 0;
    }
    .tearm-information .page_info {
        width: calc(100% - 33% - 20px);
        flex-direction: row;
    }
    .tearm-information .count-guide {
        margin: 0 20px 0 0;
    }
    .tearm-information .post-order select {
        margin-bottom: 0;
    }
    .tearm-information .post-order {
        max-width: 150px;
    }

}

/**
* 16.3 Tablet Large 880px
*/
@media screen and (min-width: 55em) {

	/* Tearm Information
		 ========================================================================== */

    .blocker .tearm-information {
        display: block;
    }
    .blocker .tearm-information .tearm-list {
        width: 100%;
        margin: 0 0 10px 0;
    }
    .blocker .tearm-information .page_info {
        width: 100%;
        flex-direction: initial;
    }

}

/**
* 16.4 Desktop Small 1000px
*/
@media screen and (min-width: 62.5em) {

	/* Tax Description
		 ========================================================================== */

    .taxonomy-description {
        margin: 0 0 50px;
    }

	/* Tearm Information
		 ========================================================================== */

    .blocker .tearm-information {
        display: flex;
    }
    .blocker .tearm-information .tearm-list {
        width: 30%;
        margin: 0 20px 0 0;
    }
    .blocker .tearm-information .page_info {
        width: calc(100% - 30% - 20px);
        flex-direction: row;
    }

	/* cat post list
		 ========================================================================== */

    .type-grid {
        margin: 0 0 60px;
    }
    .type-grid .post {
        padding: 0 0 35px;
        margin: 0 0 50px;
    }

}

/**
* 16.5 Desktop 1290px
*/
@media screen and (min-width: 77.5em) {
}

/**
* 16.6 Desktop Wide 1400px
*/
@media screen and (min-width: 87.5em) {

    #primary.content-area {
        max-width: 1280px;
        margin: auto;
    }

}

/**
* Colors
*/

/* Tearm Information
	 ========================================================================== */

.tearm-information .count-guide {
    background-color: rgba(255, 255, 255, 0.5);
}

/* cat post list
	 ========================================================================== */

.type-grid .post {
    border-bottom: 1px dotted #707070;
}
.type-grid .post-header .time {
    border-top: 1px dotted #707070;
}
.type-grid .post-title,
.type-grid .post-title a {
	color: var(--spc-lpcst-col);
}

/* Tearm
	 ========================================================================== */

.tearm-information .select_box li {
    background-color: #ffffff;
}
.tearm-information .select_box li a,
.tearm-information .select_box li label {
    border: 1px solid #c5c5c5;
    background-color: #ffffff;
}
.tearm-information .select_box li:not(:first-child) a {
	border-top: none;
}
.tearm-information .select_box li a:hover {
    background-color: #c5c5c5;
}
.tearm-information .select_box li a::after {
    background-color: #000000;
}
.tearm-information .select_box li label::after {
    background-color: #000000;
}