@charset "UTF-8";

/* icon -------------------------------------*/
.system-category span{display: block;padding: 4px 8px;text-align: center;background: #E7322F;color: #fff;font-size: 16px;font-weight: bold;margin-right: 8px;}
.system-contents .system-category.single-works span {background: none;color: inherit;border: 1px solid #000;}
.system-category.newsblog span{display: inline-block;margin-bottom: 8px;font-size: 3.2vw;}
.system-contents .system-category{display: block;/* margin-bottom: 20px; */text-align: left;position: absolute;top: 1vw;left: 25vw;}
.system-contents .system-category span{display: inline-block;padding: 10px 20px;text-align: center;margin-right: 20px;margin-bottom: 35px;}
.system-contents .system-category.single-works span {background: ;}
.system-contents .system-category  span.design::before{background: url(../images/works/cate_icon1.svg) no-repeat center center / contain; width: 97px;height: 43px;content: "";position: absolute;  top: -30px;left: 50%;transform: translateX(-50%);}
.system-contents .system-category span.performance::before{background: url(../images/works/cate_icon2.svg) no-repeat center center / contain; width: 73px;height: 43px;content: "";position: absolute;  top: -30px;left: 50%;transform: translateX(-50%);}
.system-contents .system-category  span.heart::before{background: url(../images/works/cate_icon3.svg) no-repeat center center / contain; width: 49px;aspect-ratio:1; content: "";position: absolute;  top: -30px;left: 50%;transform: translateX(-50%);}
.system-contents .system-category  span.good::before{background: url(../images/works/cate_icon4.svg) no-repeat center center / contain; width: 110px;height: 51px;content: "";position: absolute;  top: -35px;left: 50%;transform: translateX(-50%);}
.system-contents .system-category  span.other::before{background: url(../images/works/cate_icon5.svg) no-repeat center center / contain; width: 110px;height: 51px;content: "";position: absolute;  top: -35px;left: 50%;transform: translateX(-50%);}
.system-contents .system-category  span{display: inline-block;font-size: 20px;font-weight: bold;line-height: 1.6;letter-spacing: 0.04em;border-radius: 34px;width: 289px;height: 67px;padding: 20px;position: relative;/* margin: 0 0 0 0; */}
.system-contents .system-category.newsblog span {border-radius: 0;padding: 5px 50px 5px 50px;height: auto;width: auto;}
.system-tag span{display: block;padding: 10px 0;text-align: center;border: solid 1px #333;}

#event .cate01{ background: #003547;color: #fff; }
#event .cate02{ background: #005E54;color: #fff; }
#event .cate03{ background: #C2BB00;color: #fff; }
#event .cate04{ background: #E1523D;color: #fff; }
#event .cate05{ background: #ED8B16;color: #fff; }
#event .cate06{ background: #f0f0f0;color: #fff; }

#event .icon01{ background: #003547; }
#event .icon02{ background: #005E54; }
#event .icon03{ background: #C2BB00; }
#event .icon04{ background: #E1523D; }
#event .icon05{ background: #ED8B16; }
#event .icon06{ background: #f0f0f0; }

#case-newly .icon01{ background: #003547; color: #fff; }
#case-newly .icon02{ background: #005E54; color: #fff; }
#case-newly .icon03{ background: #C2BB00; color: #fff; }
#case-newly .icon04{ background: #E1523D; color: #fff; }
#case-newly .icon05{ background: #ED8B16; color: #fff; }
#case-newly .icon06{ background: #f0f0f0; color: #fff; }

#case-reform .cate01{ background: #003547; color: #fff; }
#case-reform .cate02{ background: #005E54; color: #fff; }
#case-reform .cate03{ background: #C2BB00; color: #fff; }
#case-reform .cate04{ background: #E1523D; color: #fff; }
#case-reform .cate05{ background: #ED8B16; color: #fff; }
#case-reform .cate06{ background: #f0f0f0; color: #fff; }

#voice .icon01{ background: #003547; color: #fff; }
#voice .icon02{ background: #005E54; color: #fff; }
#voice .icon03{ background: #C2BB00; color: #fff; }
#voice .icon04{ background: #E1523D; color: #fff; }
#voice .icon05{ background: #ED8B16; color: #fff; }
#voice .icon06{ background: #f0f0f0; color: #fff; }

#sale .icon01{ background: #003547; color: #fff; }
#sale .icon02{ background: #005E54; color: #fff; }
#sale .icon03{ background: #C2BB00; color: #fff; }
#sale .icon04{ background: #E1523D; color: #fff; }
#sale .icon05{ background: #ED8B16; color: #fff; }
#sale .icon06{ background: #f0f0f0; color: #fff; }


#real_estate .icon01{ background: #003547; color: #fff; }
#real_estate .icon02{ background: #005E54; color: #fff; }
#real_estate .icon03{ background: #C2BB00; color: #fff; }
#real_estate .icon04{ background: #E1523D; color: #fff; }
#real_estate .icon05{ background: #ED8B16; color: #fff; }
#real_estate .icon06{ background: #f0f0f0; color: #fff; }


#real_estate .system-icon02 span.icon02-01 { background: #999; color: #fff; }
#real_estate .system-icon02 span.icon02-02 { background: #ccc; color: #fff; }
#real_estate .system-icon02 span.icon02-03 { background: #eee; color: #fff; }


#blog .mainContents .blog-icon01{ background: #000 !important; color: #fff; }
#blog .mainContents .blog-icon02{ background: #111 !important; color: #fff; }
#blog .mainContents .blog-icon03{ background: #222 !important; color: #fff; }
#blog .mainContents .blog-icon04{ background: #333 !important; color: #fff; }
#blog .mainContents .blog-icon05{ background: #444 !important; color: #fff; }
#blog .mainContents .blog-icon06{ background: #555 !important; color: #fff; }

/* ブログサイドバーリセット -------------------------------------*/
#blog .sidebar .blog-icon01{ background: none !important; color: #000; }
#blog .sidebar .blog-icon02{ background: none !important; color: #000; }
#blog .sidebar .blog-icon03{ background: none !important; color: #000; }
#blog .sidebar .blog-icon04{ background: none !important; color: #000; }
#blog .sidebar .blog-icon05{ background: none !important; color: #000; }
#blog .sidebar .blog-icon06{ background: none !important; color: #000; }


#topics .icon01{background: #000 !important;color: #fff;display: inline-block;margin-right: 20px;}
#topics .icon02{background: #111 !important;color: #fff;display: inline-block;margin-right: 20px;}
#topics .icon03{ background: #222 !important; color: #fff; display: inline-block; margin-right: 20px; padding: 4px 20px; }
#topics .icon04{ background: #333 !important; color: #fff; display: inline-block; margin-right: 20px; padding: 4px 20px; }
#topics .icon05{ background: #444 !important; color: #fff; display: inline-block; margin-right: 20px; padding: 4px 20px; }
#topics .icon06{ background: #555 !important; color: #fff; display: inline-block; margin-right: 20px; padding: 4px 20px; }


@media screen and (max-width: 767px) {
.system-contents .system-category  span{display: inline-block;font-size: 3.382vw;font-weight: bold;line-height: 1.6;letter-spacing: 0.04em;border-radius: 8.2vw;width: 24.1vw;padding: 1.9vw;position: relative;height: auto;}
}