@charset "utf-8";
* {
    word-break: break-all;
}

dl.single_office_info {
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.form_edit .req:after {
    display: inline-block;
    content: "*必須*";
    color: rgb(204, 43, 55);
    margin-left: 0.25rem;
    font-size: 0.8rem;
}

.form_edit .disp-flex {
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -webkit-flex-pack: start;
    -moz-flex-pack: start;
    -ms-flex-pack: start;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    justify-content: flex-start;
}

/*Pagenation*/
#pagenation {
    display: block;
    margin: 1em 0;
    text-align: center;
}

#pagenation .disp-ib li {
    margin: 0.5rem;
}

#pagenation .active {
    background-color: #000;
    color: #ffffff;
}

#pagenation li a {
    background: #fff;
    color: #000;
    text-decoration: none;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
}

#pagenation li .active,
#pagenation li a {
    display: block;
    padding: 0.5rem 1rem;
    height: auto;
    border: 2px solid #000;
}

#pagenation li a:hover {
    background-color: #999;
    color: #ffffff;
}

#area_post_list > .flex-item {
    text-align: center;
    -webkit-align-self: stretch;
    -moz-align-self: stretch;
    -ms-align-self: stretch;
    align-self: stretch;
    padding: 1rem 0.5rem 0;
    margin-bottom: 4rem;
}

#area_post_list > .flex-item:not(.empty) {
    padding: 0;
    background: #fff !important;
}

#area_post_list > .flex-item .area_date {
    margin-top: -1rem;
    position: absolute;
}

#area_post_list > .flex-item .area_date:before {
    position: relative;
    display: inline-block;
    content: "";
    transform: rotate(-45deg);
    top: 0;
    left: 0;
    width: 5em;
    height: 5rem;
    background: #000;
}

#area_post_list > .flex-item .area_date > * {
    position: absolute;
    display: block;
    color: #fff;
    left: 0;
    right: 0;
}

#area_post_list > .flex-item .area_date > .day {
    bottom: 0.2rem;
    font-size: 3rem;
}

#area_new_list > .flex-item .area_date > .year_month {
    top: 0.6rem;
    font-size: 0.8rem;
}

#area_post_list .office_img {
    background-size: auto 100%;
}

#area_post_list > .flex-item .area_text {
    padding: 0.5rem;
    text-align: left;
}
#area_post_list > .flex-item .area_title {
    font-size: 1.2rem;
}

#area_post_list > .flex-item .area_excerpt {
    margin-top: 1rem;
}
#area_post_list > .flex-item .area_excerpt > p {
    text-indent: 0;
}

#area_post_list > .flex-item .area_category {
    font-size: 0.9rem;
}

ul.post-categories {
    margin-left: 0 !important;
}

.post-categories li,
#area_post_list > .flex-item .area_category li {
    margin: 0.25rem;
}

.post-categories li > a,
#area_post_list > .flex-item .area_category li > a {
    padding: 0.25rem;
}

/* ===================================================================
area_office
==================================================================== */
#area_office .office_outline {
    width: 100%;
}

#area_office .office_outline .office_pref {
    top: 0;
    right: 0;
    padding: 0.5rem;
    background: #000;
    color: #fff;
    text-decoration: none;
}
#area_office .office_outline .office_info {
    bottom: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.8);
    width: 100%;
    padding: 0.25rem 0.5rem;
}
#area_office .office_outline .office_info dt {
    padding: 0.25rem 0.5rem;
    font-size: 1.1em;
}
#area_office .office_outline .office_info dd {
    margin: 0;
    padding: 0;
}
#area_office .office_outline .office_info .disp-ib li {
    margin: 0.25rem 0.5rem;
}
/* ===================================================================
category-list
=================================================================== */
.category-list {
    padding-bottom: 2rem;
}

.category-list > li > * {
    display: block;
    border: 2px solid rgb(204, 43, 55);
    font-size: 1.2rem;
    padding: 0.5rem;
}

.category-list > li + li {
    margin-left: 1rem;
}

.category-list > li > a {
    background: rgb(204, 43, 55);
}

.category-list > li > .current,
.category-list > li:hover > a {
    background: #fff;
    color: rgb(204, 43, 55);
}

.category-list > li > .current {
    text-align: center;
}

/* ===================================================================
post-section
=================================================================== */
.post-section .area_blog_text {
    margin-top: 1em;
}
.post-section h3 > a {
    color: #000;
}
.post-section h3 > a,
.category-list > li > a,
.post-categories > li > a {
    text-decoration: none;
}

.post-categories > li {
    display: inline-block;
    background: rgba(204, 43, 55, 0.8);
    padding: 0.1rem 0.25rem;
    font-size: 0.8em;
    color: #fff;
}
.category-list > li > a,
.post-categories > li > a {
    color: #fff;
}

.post-section .post-categories > li + li {
    margin-left: 0.5rem;
}

.post-section img {
    display: block;
    margin: auto;
}

/* ===================================================================
gallery
*+.area_lightbox{ margin-top: 1rem; }
.area_lightbox.disp-flex img{ width: 100%; height: auto; margin: auto; }
.area_lightbox.disp-flex > .flex-item{
  -webkit-box-align:center;
  -moz-box-align:center;
  -ms-flex-align:center;
  -webkit-align-items:center;
  -moz-align-items:center;
  align-items:center;
  text-align: center;
  min-width: 100px;
}
.area_lightbox.disp-flex > .flex-item > *{
  display: block;
  margin: auto;
}
.area_lightbox .flex-item.is-empty{
  height: 0;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
==================================================================== */

/* ==================================================================== */

#tbl_company ul.post-categories > li {
    margin: 0rem auto;
}

#tbl_company td:nth-child(2),
dl.single_office_info > dt,
dl.single_office_info > dd {
    margin: 0.5em auto 1em;
}
/* ===================================================================
media screen
=================================================================== */

.disp-flex.no-wrap {
    -webkit-box-lines: single;
    -moz-box-lines: single;
    -webkit-flex-wrap: nowrap;
    -moz-flex-wrap: nowrap;
    -ms-flex-wrap: none;
    flex-wrap: nowrap;
}

/* スマホ */
@media screen and (max-width: 639px) {
}

/* タブレット1 */
@media screen and (min-width: 640px) {
}

/* タブレット1 */
@media screen and (min-width: 640px) and (max-width: 799px) {
}

/* タブレット2以下 */
@media screen and (max-width: 799px) {
    /* #wrapperの中の#mainと#sidebarを横幅いっぱい */
    #wrapper #area_posts {
        -webkit-box-direction: normal;
        -moz-box-direction: normal;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        flex-direction: column;
    }
    #wrapper #area_posts > #main,
    #wrapper #area_posts > #sidebar {
        width: 100% !important;
    }
    #area_blog_list .per30 {
        width: 100%;
    }

    #area_post_list.disp-flex,
    #area_post_list .disp-flex,
    #area_post_list .flex-item {
        display: block;
        width: 100%;
    }
    .category-list > .flex-item {
        width: 49% !important;
    }

    .form_edit ul li {
        margin: 0;
    }

    dl.single_office_info > *,
    .form_edit dl > * {
        padding: 0;
    }

    #tbl_company td:nth-child(1):before,
    dl.single_office_info > dt:before,
    .form_edit dl dt:before {
        content: "▼";
    }

    #tbl_company td:nth-child(1),
    dl.single_office_info > dt,
    .form_edit dl dt {
        font-weight: bold;
    }

    #tbl_company tr,
    #tbl_company td,
    .disp-flex:not(.no-block) {
        display: block;
    }

    .disp-flex.no-block > li + li {
        margin-left: 0 !important;
    }

    dl.single_office_info > * {
        width: 100%;
    }
}

/* タブレット2以上 */
@media screen and (min-width: 800px) {
    #area_post_list > .flex-item {
        width: 48%;
    }
    #area_post_list > .flex-item > .flex-item {
        width: 50%;
    }

    .form_edit {
        display: table;
        width: 100%;
    }
    .form_edit dl {
        display: table-row;
    }
    .form_edit dl > * {
        display: table-cell;
        vertical-align: middle;
    }

    .form_edit .disp-flex {
        -webkit-box-align: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        -moz-align-items: center;
        align-items: center;
    }

    dl.single_office_info > dt {
        width: 25%;
    }
    dl.single_office_info > dd {
        width: 75%;
    }

    #tbl_company {
        border-collapse: collapse;
    }
    #tbl_company td {
        padding: 0.5rem;
        background: rgb(255, 255, 255);
        border: #000 2px solid;
    }

    #tbl_company td:nth-child(1) {
        width: 10em;
        background: rgb(56, 59, 56);
        color: #fff;
    }
}

/* ipad */
@media screen and (min-width: 800px) and (max-width: 1023px) {
    #area_blog_list .per30 {
        width: 48%;
    }
    .category-list > .flex-item {
        width: 32% !important;
    }
}

/* ipad以下 */
@media screen and (max-width: 1023px) {
    .category-list {
        -webkit-box-pack: justify;
        -moz-box-pack: justify;
        -webkit-flex-pack: justify;
        -moz-flex-pack: justify;
        -ms-flex-pack: justify;
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        justify-content: space-between;
    }
    .category-list > .flex-item {
        margin: 0 0 1em 0;
    }
    .category-list > .flex-item > a {
        text-align: center;
    }
    .category-list > .flex-item:first-child {
        width: 100% !important;
    }
}

/* PC */
@media screen and (min-width: 1024px) {
    #area_new_list > .flex-item {
        width: 30% !important;
    }
}
