@charset "utf-8";
h1.page-top {}

h1.h1_img_nostyle {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: inherit;
    display: inline;
}


/* Top Page Style - Begin */

div.contents-article-area-wrap_toppage,
div.contents-article-area-wrap,
div.contents-area-wrap {
    /* padding: .1rem 0 0 0; */
    padding: 1rem;
    margin: 0 auto;
    background-color: #f5f5f5;
}

div.contents-article-area-wrap_toppage {
    background-image: url("/products/complex/kurashini/common/images/bg_index_top.jpg"), url("/products/complex/kurashini/common/images/bg_index_top_2.jpg");
    background-size: 100% auto, 100% auto;
    background-repeat: no-repeat, repeat-y;
    background-position: right 50% top -6%, right 50% top 0;
}

div.area_top_main_container {}

div.area_top_main_container .area_top_main_box {
    padding: 3em 0;
    text-align: center;
}

div.area_top_main_container .area_top_main_box .area_top_main_logo {}

div.area_top_main_container .area_top_main_box .area_top_main_text {
    display: inline-block;
    font-weight: 200;
    font-size: 1rem;
    line-height: 2;
    color: #444;
}


/* Top Page Style - End */


/* Area Style - Start */

.contents.article-body {
    background-color: #fff;
    box-shadow: 6px 6px 8px rgb(0 0 0 / 20%);
    border: solid #ddd 1px;
    padding: 2rem;
}


/* Area Style - End */


/* Font Style */

.category-header-contents,
div.card-article-list-wrap,
.page-top-link,
.page-top-link-entry,
.contents.article-body,
.contents--article-area,
.category-list-wrap {
    /*
        font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
        */
}

.contents.article-body h2,
.contents--article-area h2,
.bottom-stuff h2 {
    color: #333;
    font-size: 1.3rem;
    line-height: 1.8;
    /*
    border: solid #ddd 1px;
    */
    border: 0;
    margin: 6rem -1rem 2rem -1rem;
    background-color: #fff;
    padding: 2rem;
    vertical-align: middle;
}

.contents.article-body h2 {
    padding-left: 1.4rem;
    position: relative;
    background-color: #f5f5f5;
    letter-spacing: .04em;
}

.contents.article-body h2:before {
    content: '';
    display: block;
    position: absolute;
    top: calc(50% - .6em);
    left: 0;
    background-color: #047763;
    width: .5rem;
    height: 1.2em;
}

.contents.article-body h3,
.contents--article-area h3,
.bottom-stuff h3 {
    color: #333;
    margin: 2rem 0 1rem;
    border-bottom: #047763 solid 2px;
    background-color: #fff;
    margin-bottom: 1.2rem;
    /*
    box-shadow: 6px 6px 8px rgb(0 0 0 / 20%);
    */
    padding-left: .2em;
}

.contents.category-list h3 {
    box-shadow: none;
    border: 0;
    border-bottom: #bbb solid 2px;
    margin-top: 0;
}

.contents.article-body img {
    /* for Responsive Image Size Width auto */
    max-width: 100%;
    width/***/
    : auto;
    /* for IE8 */
    display: block;
    height: auto;
    margin-top: 1.8rem;
    margin-bottom: 1.8rem;
}

.contents.article-body .article-beginning img {
    margin-top: 0;
    margin-bottom: 0;
}

.contents.article-body p {
    line-height: 180%;
}

.contents.article-body strong {
    font-weight: 800;
    background: linear-gradient(to bottom, #fff 80%, #d1f5c1 20%);
}


/* category-header START
--------------------------------------- */

.category-header-contents {
    background-color: #fff;
    /* f8f8f8 */
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    z-index: 5000;
    border-bottom: solid #f5f5f5 1px;
    margin-top: 0;
}

.category-header-contents .navbar.navbar-default {
    background-color: #fff;
    /* f8f8f8 */
    margin-bottom: 0;
}

.category-header-contents .navbar-header .navbar-brand.current-category {
    font-size: .9rem;
    background: none;
    padding: .6rem 10px;
    /* padding: 2.4rem 2rem 1rem; */
    text-align: left;
    border-bottom: solid #ddd 2px;
    margin-bottom: 0;
}

.category-header-contents .navbar-header .navbar-brand.current-category a {
    background: none;
}

.category-header-contents .navbar-header .navbar-brand.current-category a:link {
    color: #555;
    font-weight: 400;
}

.category-header-contents .navbar-header .navbar-brand.current-category a:visited {
    color: #555;
}

.category-header-contents .navbar-header .navbar-brand.current-category a:hover {
    color: #555;
    text-decoration: none;
}

.category-header-contents .navbar-header .navbar-brand.current-category a:active {
    color: #555;
}

.category-header-contents .navbar-header .navbar-brand.current-category img.category-head_logo {
    max-width: 160px;
    margin-right: 1rem;
    vertical-align: bottom;
}

.category-header-contents .collapse.navbar-collapse {
    margin: 1rem 0 0;
}

.category-header-contents .navbar-default .navbar-nav>li>a {
    margin-left: 0;
    font-size: .9rem;
    color: #555;
    font-weight: 400;
}


/*
    .category-header-contents .navbar-default .navbar-nav>li>a:before {
        content: "・"
    }
*/

.category-list-wrap {
    margin-bottom: 2rem;
}

.category-list-wrap .category-list {
    background-color: #fff;
    margin-top: 2rem;
    /* f8f8f8 */
    box-shadow: 6px 6px 8px rgb(0 0 0 / 20%);
    border: solid #ddd 1px;
}

.category-list-wrap ul {
    margin: 0;
    padding: 1rem;
}

.category-list-wrap ul li {
    padding: 0;
    display: inline;
    background: none;
    font-weight: 400;
}

.category-list-wrap ul li a {
    padding: .8rem 1.2rem .8rem 1.2rem;
    color: #000;
    font-size: 1rem;
    display: inline-block;
    border: 0;
    -webkit-transition: .4s;
    transition: .4s;
}

.category-header.category-header-contents ul li {
    background-color: transparent;
}

.category-header.category-header-contents ul li:hover {
    border: 0;
}

.category-header.category-header-contents ul li a {
    border: 0;
}

.category-header.category-header-contents ul li a:before {
    content: '';
    display: block;
    position: absolute;
    top: calc(50% - .2em);
    left: .7rem;
    height: 60%;
    background-color: #047763;
    width: .2em;
    height: .4em;
}


/* category-header END
--------------------------------------- */


/* hover-arrow START
------------------------------------------------------ */

.category-list-wrap ul li a,
.category-header-contents .navbar-default .navbar-nav>li>a {
    position: relative;
}

.category-list-wrap ul li a:after,
.category-header-contents .navbar-default .navbar-nav>li>a:after {
    position: absolute;
    top: calc(50% + 4px);
    right: 1em;
    content: '';
    margin-top: -8px;
    margin-right: -4px;
    opacity: 0;
    width: 8px;
    height: 8px;
    border-top: 2px solid #047763;
    border-right: 2px solid #047763;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.category-list-wrap ul li a:hover,
.category-header-contents .navbar-default .navbar-nav>li>a:hover {
    text-decoration: none;
    transition: .7s;
    -webkit-transition: .7s;
    /*    border-bottom: solid #047763 1px; */
    /* 666 */
}

.category-list-wrap ul li a:hover::after,
.category-header-contents .navbar-default .navbar-nav>li>a:hover::after {
    animation: arrow 1.2s infinite;
}

@keyframes arrow {
    50% {
        right: 1em;
        opacity: 1;
    }
    100% {
        right: 0;
        opacity: 0;
    }
}


/* hover-arrow END
------------------------------------------------------ */


/*
    .category-list-wrap ul li:first-child a {
        border: 0;
        color:#333;
    }
*/


/* category-header END */

.contents.article-h1 {
    margin-top: 1.2rem;
}

.contents.article-h1 h1.page-top {
    border: 0;
    background-color: #fff;
    box-shadow: none;
    color: #047763;
    padding: 1.2rem 1.6rem 1.2rem;
    line-height: 1.4;
    font-size: 1.4rem;
    box-shadow: 6px 6px 8px rgb(0 0 0 / 20%);
    position: relative;
    /*    border: solid #047763 .4rem;  */
}

.contents.article-h1 h1.page-top:before {
    content: '';
    display: block;
    position: absolute;
    top: calc(20%);
    left: -1px;
    background-color: #047763;
    width: .5rem;
    height: 60%;
}

.page-top-link {
    /*    border-bottom: solid #ffffff 2px; */
    -webkit-transition: .2s;
    transition: .2s;
    background-color: #fff;
    padding: 2rem 2rem 1rem 2rem;
    box-shadow: 6px 6px 8px rgb(0 0 0 / 20%);
    margin-bottom: 2rem;
}

.page-top-link-entry {
    padding: .4rem 0 1rem 0;
    margin-bottom: 0rem;
}

.contents.article-body .page-top-link {
    border: 0;
}

.contents.article-body .page-top-link:hover {
    border: 0;
}

.page-top-link>a {
    color: #000;
}

.page-top-link>a:hover {
    text-decoration: none;
}

.article-beginning .article-title {
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.8;
    padding: 0;
    color: #047763;
}

.article-beginning .article-desc {
    padding: 1rem 0rem;
}

.article-beginning .article-desc p {
    font-size: 1.1rem;
    line-height: 1.8;
    padding: 3rem 2rem;
    margin-bottom: 0;
    font-weight: 400;
    color: #555;
    background-color: #fbfbfb;
}

.article-date-category {
    padding: 0 2rem;
    color: #999;
    text-align: right;
}

.article-beginning .article-date {
    margin-right: 1em;
    font-size: .8rem;
}

.article-beginning .article-category {
    font-size: .8rem;
}

.asset-body h4 {
    margin-top: 3rem;
    padding-left: 0;
    font-size: 1rem;
    background: none;
}

.bottom-stuff {}

.bottom-stuff .relation-article {}

.bottom-stuff .category-list {}

.bottom-stuff {}

.bottom-stuff {}

.bottom-stuff {}

div.card-article-list-wrap {
    margin-bottom: 2rem;
}

div.card-article-list {
    padding: 1rem;
    margin-bottom: 3.2rem;
}

div.card-article-list>a {
    color: inherit;
}

div.card-article-list>a:hover {
    text-decoration: none;
}

div.card-article-list>a div.entry-asset {
    padding: 2rem;
    -webkit-transition: .2s;
    transition: .2s;
    background-color: #fff;
    box-shadow: 6px 6px 8px rgba(0, 0, 0, 0.2);
    border: solid #ddd 1px;
}


/* hover-arrow START
------------------------------------------------------ */

div.card-article-list>a div.entry-asset,
.page-top-link>a .article-beginning {
    position: relative;
}

div.card-article-list>a div.entry-asset::after,
.page-top-link>a .article-beginning::after {
    position: absolute;
    bottom: 20px;
    right: 3em;
    content: '';
    margin-top: -8px;
    opacity: 0;
    width: 40px;
    height: 40px;
    border-top: 8px solid #047763;
    border-right: 8px solid #047763;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}


/*
.page-top-link>a .article-beginning::after {
    border-color: #fff;
}
*/

div.card-article-list>a:hover div.entry-asset,
.page-top-link:hover {
    -webkit-transition: .2s;
    transition: .2s;
    -webkit-transform: translateY(-1%) scale(1.03);
    transform: translateY(-1%) scale(1.03);
    /*    -webkit-box-shadow: rgba(0, 0, 0, .3);
    box-shadow: rgba(0, 0, 0, .3);
    */
}

.page-top-link:hover {
    -webkit-transform: translateY(1.5%) scale(1.03);
    transform: translateY(1.5%) scale(1.03);
}

div.card-article-list>a:hover div.entry-asset::after,
.page-top-link>a:hover .article-beginning::after {
    animation: arrow 1.2s infinite;
}

@keyframes arrow {
    50% {
        right: 1em;
        opacity: 1;
    }
    100% {
        right: 0;
        opacity: 0;
    }
}


/* hover-arrow END
------------------------------------------------------ */


/*
div.card-article-list>a div.article-image1 {
    filter: grayscale(20%) brightness(100%);
    -webkit-transition: .7s;
    transition: .7s;
}

div.card-article-list>a:hover div.article-image1 {
    filter: grayscale(0%) brightness(110%);
    -webkit-transition: .4s;
    transition: .4s;
}
*/

div.card-article-list .article-title {
    padding: 1.4rem 0;
    font-size: 1.3rem;
    margin-bottom: 0;
    font-weight: 700;
    line-height: 1.5;
    background-color: #fff;
    color: #047763;
}

div.card-article-list .article-desc {
    background-color: #f5f5f5;
    background-color: #fbfbfb;
}

div.card-article-list .article-desc p {
    line-height: 1.8;
    font-size: .9rem;
    padding: 1rem;
    margin-bottom: 0;
}

div.card-article-list .article-date,
div.card-article-list .article-category {
    display: none;
}


/* --- for Masonry Layout --- START --------------- */

#contents--article-area {
    visibility: hidden;
}


/* --- for Masonry Layout --- STOP --------------- */

@media screen and (min-width: 640px) {
    div.card-article-list {
        width: 50%;
        margin: 0;
        margin-bottom: 1rem;
    }
    .page-top-link>a .article-beginning .article-image1 img {
        width: 100%;
        min-height: 240px;
        max-height: 360px;
        /*  object-fit: cover;  */
        /*  font-family: 'object-fit: cover';   */
        /* ie Huck */
        /* ie huck */
        height: auto;
    }
    div.card-article-list>a div.article-image1 img {
        /*  object-fit: cover;    */
        /*  font-family: 'object-fit: cover';  */
        /* ie Huck */
        /* ie huck */
        width: 100%;
        height: auto;
        /* height:150px; */
    }
    /* Top Page Style - Begin
    ------------------------------------------------ */
    div.contents-article-area-wrap_toppage {
        background-position: right 50% top -60px;
    }
    div.area_top_main_container {}
    div.area_top_main_container .area_top_main_box {
        padding: 2rem 0 0;
    }
    div.area_top_main_container .area_top_main_box .area_top_main_logo {
        margin: 0 auto;
        width: 60%;
        padding: 2rem 2rem 1rem 2rem;
    }
    div.area_top_main_container .area_top_main_box .area_top_main_text {
        padding: .5rem 3rem;
        background-color: rgba(255, 255, 255, 0.6);
    }
    /* Top Page Style - End
    ------------------------------------------------ */
}

@media screen and (min-width: 768px) {
    div.contents-article-area-wrap_toppage {
        background-position: right 50% top -60px;
    }
}

@media screen and (min-width: 920px) {
    div.contents-article-area-wrap_toppage {
        background-position: right 50% top -150px;
    }
}

@media screen and (min-width: 1120px) {
    div.contents-article-area-wrap_toppage {
        background-position: right 50% top -240px;
    }
}

@media screen and (min-width: 1320px) {
    div.contents-article-area-wrap_toppage {
        background-position: right 50% top -320px;
    }
}

@media screen and (min-width: 1500px) {
    div.contents-article-area-wrap_toppage {
        background-position: right 50% top -420px;
    }
}

@media screen and (min-width: 1740px) {
    div.contents-article-area-wrap_toppage {
        background-position: right 50% top -520px;
    }
}

@media screen and (min-width: 1960px) {
    div.contents-article-area-wrap_toppage {
        background-position: right 50% top -600px;
    }
}

@media screen and (min-width: 2146px) {
    div.contents-article-area-wrap_toppage {
        background-size: auto;
        background-position: right 50% top -610px;
    }
}

@media screen and (max-width: 640px) {
    div.card-article-list {
        width: 99%;
        margin: 0;
    }
    /* Top Page Style - Begin
    ------------------------------------------------ */
    div.contents-article-area-wrap_toppage {
        background-position: right 50% top -500px;
        background-size: auto 1400px;
    }
    div.area_top_main_container {
        margin: 0 0 1rem 0;
    }
    div.area_top_main_container .area_top_main_box {
        padding: 2rem 0 2rem;
    }
    div.area_top_main_container .area_top_main_box .area_top_main_logo {
        margin: 0 auto;
        width: 90%;
        padding: 1rem;
    }
    div.area_top_main_container .area_top_main_box .area_top_main_text {
        font-size: 1.2rem;
        padding: 1em 1em;
        background-color: rgba(255, 255, 255, 0.7);
    }
    /* Top Page Style - End
    ------------------------------------------------ */
    .page-top-link {
        padding: 1rem;
    }
    div.card-article-list>a div.entry-asset {
        padding: 1rem;
    }
    .page-top-link-entry {
        margin-top: calc(-2rem - 10px);
        margin-left: calc(-2rem - 10px);
        margin-right: calc(-2rem - 10px);
        margin-bottom: 0;
    }
    .page-top-link-entry .article-beginning .article-image1 {
        padding-top: 0;
    }
    .category-header-contents .navbar-header .navbar-brand.current-category img.category-head_logo,
    .category-header-contents.contents>nav>div>div.navbar-header>div>a>img {
        max-width: 110px;
    }
    .category-header-contents .navbar-header .navbar-brand.current-category a {
        display: block;
        padding: .6rem 0 0 0;
        width: calc(100% - 100px);
    }
    .category-header-contents .navbar-header .navbar-brand.current-category a:first-child {
        padding: 0;
    }
    div.current-category {
        background-image: none;
        height: auto !important;
        border-bottom: solid #ddd 2px;
    }
    div.current-category>a {
        /*      display: block;     */
    }
    .article-beginning .article-desc {
        padding-top: 0;
    }
    .article-beginning .article-desc p {
        font-size: 1rem;
        line-height: 1.6;
        padding: 1.6rem 2rem;
    }
    .article-beginning .article-title {
        padding: 0 1rem;
    }
    .article-date-category {
        padding: 0 1rem;
    }
    .category-header-contents .navbar-default .navbar-nav>li>a {
        color: #333;
    }
    .category-header-contents .collapse.navbar-collapse {
        margin: 0 -10px 0;
        padding-bottom: 10px;
    }
    /* ------------------ */
    .category-header .navbar-collapse ul {
        border: 0;
    }
    .category-header.category-header-contents ul li {
        border: 0;
        border-bottom: ;
    }
    .category-header.category-header-contents ul li:hover {
        border: 0;
    }
    .category-header.category-header-contents ul li a {
        border: 0;
        border-bottom: dotted 1px #bbb;
        padding: .8rem 0 .8rem 2.4em;
        display: block;
        width: 100%;
        height: 100%;
        background-color: #f5f5f5;
    }
    .category-header.category-header-contents ul li a:before {
        /*  display: none;  */
        width: .4em;
        height: .4em;
    }
    .category-header-contents .navbar-header .navbar-toggle {
        margin-top: .5rem;
    }
    .contents.article-body .container-fluid .asset-body ul {
        padding-inline-start: 1rem;
    }
    /* ------------------ */
}