@charset "UTF-8";
/* 目次
***************************************
01. Common
02. Header
03. Footer
04. Module
*****************************************/
/****************************************
01. Common
*****************************************/
html:before,
html:after,
body:before,
body:after {
    content: "";
    background: #F46B00;
    position: fixed;
    display: block;
    z-index: 99999;
}
/* 上 */
html:before {
    height: 6px;
    width: 100vw;
    left: 0;
    top: 0;
}
/* 右 */
html:after {
    width: 6px;
    height: 100vh;
    right: 0;
    top: 0;
}
/* 下 */
body:before {
    height: 6px;
    width: 100vw;
    bottom: 0;
    left: 0;
}
/* 左 */
body:after {
    width: 6px;
    height: 100vh;
    top: 0;
    left: 0;
}
body {
    width: 100%;
    /*min-width: 1300px;*/
    overflow-x: hidden;
    overflow-y: auto;
}
button {
    font-family: zen-maru-gothic, sans-serif;
}
.normalBtn {
    width: 14vw;
    height: 6vw;
    font-family: zen-maru-gothic, sans-serif;
    font-size: 1.2vw;
    font-weight: bold;
    text-align: left;
    position: relative;
    display: flex;
    align-items: center;
    color: var(--sub-color-bule);
    transition: .3s;
}
.normalBtn::before {
    content: "";
    width: 4.2vw;
    height: 4.2vw;
    background-color: transparent;
    border: 2px solid var(--sub-color-bule);
    border-radius: 100px;
    position: absolute;
    right: 0;
    transition: .3s;
    overflow: hidden;
}
.normalBtn::after {
    content: "";
    width: 5vw;
    height: 1.1vw;
    background: url(../img/btn_arrow.svg) no-repeat;
    background-position: center right;
    background-size: cover;
    position: absolute;
    right: 1.4vw;
}
.normalBtn:hover {
    font-size: 1.3vw !important;
    transition: .3s;
}
.normalBtn:hover::before {
    transform: scale(1);
    transition: .3s;
    background: rgb(233,96,95);
    background: linear-gradient(338deg, rgba(233,96,95,1) 0%, rgba(255,207,65,0.7273503151260504) 74%, rgba(253,200,45,1) 100%);
}
.normalBtn:hover::after {
    right: 1.2vw;
    width: 2vw;
    transition: .4s;
}
/* mainの大枠 */
.container {
    align-items: center;
    display: flex;
    flex-direction: column;
    width: 100%;
    animation: fadein 3s forwards;
    position: inherit;
    z-index: 99;
}
@keyframes fadein {
	0% {opacity: 0}
	100% {opacity: 1}
}
/* 各要素の大枠 */
.wrapper {
    align-items: center;
    display: flex;
    flex-direction: column;
    width: 100%;
}
.wrapper:last-child { margin-bottom: 0; }
.wrapper > .page-bg {
    position: absolute;
    top: -50vw;
    margin-bottom: -50vw;
    width: 100%;
}
[class*="-catchcopy"] {
    font-family: zen-maru-gothic, sans-serif;
    font-size: 3.4vw;
    margin-bottom: 3vw;
    line-height: 1.5;
    letter-spacing: .8rem;
    color: #48486C;
    font-weight: 500;
}
body.home [class*="-catchcopy"] {
    position: absolute;
    top: 4vw;
}
[class*="-catchcopy"] .color-fvOrange {
    font-family: zen-maru-gothic, sans-serif;
    font-size: 3.8vw;
    letter-spacing: .9rem;
    position: relative;
    top: .2vw;
}
[class*="-catchcopy"] .hiragana {
    font-family: zen-maru-gothic, sans-serif;
    letter-spacing: .2rem;
}
.wrapper div[class*="-area"] {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}
body[class*="contact"] .wrapper div[class*="-area"] {
    margin-top: 500px;
}
.wrapper div[class*="-area"] > [class$="Title"],
body[class*="recruit"] .wrapper div[class*="-area"] section [class$="-inner"] > [class$="Title"],
body.recruit-entry-Form .wrapper .contact-area.recruit-entry h1.contctsTitle,
body.recruit-entry-Confirm .wrapper .contact-area.recruit-entry h1.contctsTitle,
body.recruit-entry-Comp .wrapper .contact-area.recruit-entry h1.contctsTitle {
    font-family: zen-maru-gothic, sans-serif;
    color: #F46B00;
    font-size: 10rem;
    font-weight: 300;
    margin-top: 5rem;
    padding: 0 12vw;
    width: 100%;
    text-shadow: 4px 3px 8px rgb(174 37 37 / 18%);
}
h1.privacypolicyTitle,
h1#qaTitle {
    line-height: 1 !important;
}
body[class*="contact"] .wrapper div[class*="-area"] > [class$="Title"] {
    position: relative;
    top: -610px;
    margin-bottom: -610px;
}
body.confirm .wrapper div[class*="-area"] > [class$="Title"] {
    top: -530px;
    margin-bottom: -530px;
}
body.contact-Comp .wrapper div[class*="-area"] > [class$="Title"] {
    margin-bottom: -510px;
}
.wrapper div[class*="-area"] > [class$="Title"] > em,
body[class*="recruit"] .wrapper div[class*="-area"] section [class$="-inner"] > [class$="Title"] > em {
    font-size: 1.6rem;
    display: block;
    font-weight: 500;
    position: relative;
    top: -10px;
    font-family: zen-maru-gothic, sans-serif;
}
h1.privacypolicyTitle > em,
h1#qaTitle > em {
    top: 30px !important;
}
[class$="Title"] + [class$="Common_area"] {
    width: 100%;
    padding: 0 12vw;
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    margin-top: 4vw;
}
[class$="Title"] + [class$="Common_area"] > div {
    width: 42%;
}
[class$="Title"] + [class$="Common_area"] [class$="Common_area-right"] {
    align-self: flex-start;
}
[class$="Title"] + [class$="Common_area"] [class$="Common_area-left"] {
    align-self: flex-end;
}
[class$="Title"] + [class$="Common_area"] .page-text,
.recruit-entry-text {
    font-family: zen-maru-gothic, sans-serif;
    font-weight: 600;
    font-size: 1.6rem;
    line-height: 3rem;
    white-space: normal;
}
body[class*="contact"] [class$="Title"] + .contctsCommon_area .page-text {
    color: #48486C;
}
.service:not(.index) [class$="Common_area"] .page-text {
    color: #EB610E;
}

body[class*="service"] [class$="Common_area"] .page-text p {
    background: none;
    padding: 1rem;
}

/* Loading背景画面設定　*/
#splash {
    /*fixedで全面に固定*/
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: #FAF6F4;
    text-align: center;
    color: var(--main-color-fvOrange);
    z-index: 9999;
}
#splash img {
    display: none;
    width: 19vh;
    height: 4vh;
    position: absolute;
    top: calc((100vh - 4vh) / 2);
    left: calc((100vw - 19vh) / 2);
    animation: poyopoyo 0.5s ease 0s infinite alternate;
    z-index: 9999;
}
@keyframes poyopoyo {
    from {
        transform: scale(0.94,0.94);
        opacity: .9;
    }
    to {
        transform: scale(1,1);
        opacity: 1;
    }
}
/* Loadingバー中央配置　*/
#splash_text {
    position: absolute;
    text-align: center;
    top: 50%;
    left: 50%;
    width: 100vw;
    transform: translate(-50%, -50%);
    color: var(--main-color-fvOrange);
    z-index: 9999;
}
#splash_text svg {
    height: 2.2vh;
}

/****************************************
02. Header
*****************************************/
/* headerの大枠 */
.header {
    width: 100vw;
    height: 80px;
    padding: 0 42px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    background-color: transparent;

}
.sticky {
    position: -webkit-sticky;/*Safari*/
    position: sticky;
    /*固定したい位置*/
    top: 6px;
    z-index: 99;
}
/* ヘッダーロゴ */
.logo {
    width: 15vw;
    height: auto;
}
.logo a,
.logo a img {
    width: 100%;
}

/* ヘッダーナビ */
.header_nav {
    width: calc(100vw - 15vw);
}
/* ヘッダーナビのul要素 */
.header_nav-list {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    list-style: none;
}
.header_nav-list * {
    transition:all 0.3s;-webkit-transition:all 0.3s;
}
.header_nav-list > li {
    display: inline-block;
}
.header_nav-list > li > a {
    display: block;
    font-weight: 500;
    position: relative;
}
.footer_nav-list li a,
.footer_nav-privacy {
    color: #F7F7F7;
}
.footer_nav-sub a:first-child {
    margin-right: 1.2rem;
}

/* ヘッダーナビ リスト要素 */
li[class^="header_nav-list-"] {
    font-family: zen-maru-gothic, Lato, "Noto Sans Javanese", sans-serif;
    font-size: 1.4vw;
    display: inline-block;
    height: 80px;
    letter-spacing: .2rem;
    box-sizing: border-box;
    margin: 0 1.6vw;
}
li[class^="header_nav-list-"] > a {
    color: var(--main-color-fvOrange);
}
.header_nav-item {
    display: block;
    height: 80px;
    box-sizing: border-box;
}
.header_nav-item_text {
    display: inline-block;
    padding-top: 2.7rem;
}
/* 中心から外に線が伸びるアニメーション（下部）*/
li[class^="header_nav-list-"] {
    /*線の基点とするためrelativeを指定*/
	position: relative;
}
li[class^="header_nav-list-"].active {
    color: var(--main-color-fvOrange);
    border-bottom: 3px solid var(--main-color-fvOrange);
}
li[class^="header_nav-list-"].active > a,
li[class^="header_nav-list-"].active > a:hover,
li[class^="header_nav-list-"] > a:hover {
	color: var(--main-color-fvOrange);
}
li[class^="header_nav-list-"] > a::after {
    content: '';
    /*絶対配置で線の位置を決める*/
    position: absolute;
    bottom: 0;
    left: 0%;
    /*線の形状*/
    width: 100%;
    height: 3px;
    background: var(--main-color-fvOrange);
    border-radius: 10px;
    /*アニメーションの指定*/
    transition: all .3s;
    transform: scale(0, 1);/*X方向0、Y方向1*/
    transform-origin: center top;/*上部中央基点*/
}
/*現在地とhoverの設定*/
li[class^="header_nav-list-"] > a:hover::after {
    transform: scale(1, 1); /*X方向にスケール拡大*/
}
li[class^="header_nav-list-"].active > a:hover::after {
    display: none;
}

/* ヘッダーナビのお問い合わせと資料ダウンロード */
li .header_nav-contacts,
li .header_nav-whitepaper {
    background: transparent;
    color: var(--main-color-fvOrange);
    border: 1px solid var(--main-color-fvOrange);
    border-radius: 100px;
    padding: .6rem 2rem;
    font-size: 1.4rem;
    margin-left: 2rem;
    overflow: hidden;
    position: relative;
    transition-duration: .4s;
    z-index: 2;
}
li .header_nav-contacts::after,
li .header_nav-whitepaper::after  {
    border: 1px solid #F46B00;
    border-radius: 20px;
    content: "";
    display: block;
    margin: auto;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    width: 100%;
    height: 0;
    z-index: -1;
    transform: translateY(-50%) scale(0.1);
    transition: opacity .5s, transform 0s;
    transition-delay: 0s, .4s;
}
li .header_nav-contacts::before,
li .header_nav-whitepaper::before {
    position: relative;
    top: 2px;
    margin-right: 6px;
}
li .header_nav-contacts::before {
    content: url(../img/icon_mail-orange.svg);
}
li .header_nav-whitepaper::before {
    content: url(../img/icon_download-orange.svg);
}
/* ヘッダーナビのお問い合わせのホバー時 */
li:hover .header_nav-contacts,
li:hover .header_nav-whitepaper  {
    background: var(--main-color-fvOrange);
    color: #fff;
}
li:hover .header_nav-contacts::before {
    content: url(../img/icon_mail-white.svg);
}
li:hover .header_nav-whitepaper::before {
    content: url(../img/icon_download-white.svg);
}
li .header_nav-contacts:hover::after,
li .header_nav-whitepaper::after {
    background: #F46B00;
    opacity: 1;
    transition-delay: 0s;
    transition: opacity .8s, transform .6s ease-in-out;
}

/* ヘッダーナビのローカル ナビ */
.header_nav-list .header_nav_local {
    width: auto;
    height: 0;
    position: absolute;
    left: 0;
    transition: .5s;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border-top: 1px solid var(--main-color-fvOrange);
    box-sizing: border-box;
    background-color: #fff;
    opacity: 0;
}
.header_nav-list .header_nav_local li {
    margin-left: 0;
    border-left: 1px solid var(--main-color-fvOrange);
    border-right: 1px solid var(--main-color-fvOrange);
}
.header_nav-list .header_nav_local li:last-child {
    border-bottom: 1px solid var(--main-color-fvOrange);
}
.header_nav-list .header_nav_local li a {
    display: block;
    width: 25rem;
    height: 4.2rem;
    padding: 0px 1.3rem;
    color:  var(--main-color-fvOrange);
    background-color: #fff;
    font-family: "Lato", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
    font-size: 14px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
}
.header_nav-list li:hover > .header_nav_local {
    opacity: 1;
    overflow: visible;
}
.header_nav-list li:hover > ul > li {
    overflow: visible;
}
.header_nav-list li:hover > ul > li a:hover {
    background-color: var(--sub-color-bule);
    color: #F7F7F7;
}
.header_nav-list li > .header_nav_local .normalBtn {
    text-align: center;
}
.header_nav-list li > .header_nav_local .normalBtn::before {
    width: 20px;
    height: 20px;
    right: 1.3rem;
}
.header_nav-list li > .header_nav_local .normalBtn::after {
    width: 2.8rem;
    height: 0.8rem;
    top: 1.6rem;
    right: 1.9rem;
    background-size: cover;
}
.header_nav-list li:hover > ul > li a.normalBtn:hover {
    font-size: 14.4px !important;
    height: 4.2rem !important;
}
.menu-btn,
#menu-btn-check {
    display: none;
}

/****************************************
03. Footer
*****************************************/
/* footerの大枠 */
.footer {
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: auto;
    background-color: #FAF8F7;
    background-image: url(../img/footer_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
}
/* フッターのContacts */
.footer_contacts {
    width: calc(100% - 24vw);
    margin: 8vw 0 12vw;
}
body.about .footer_contacts {
    width: calc(100% - 32vw);
}
.footer_contacts a {
    width: 100%;
    display: block;
    background: rgba(255, 255, 255, .8);
    border: .6vw solid #48486C;
    padding: 3vw 0;
}
.footer_contacts a:hover {
    border: .6vw solid #F46B00;
    background:  #F46B00;
    color: #fff;
}
/* フッターのContactsの見出し */
.footer_contacts-main {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}
.footer_contacts-title {
    font-family: dnp-shuei-mgothic-std, sans-serif;
    font-size: 6rem;
    line-height: 1.3;
    color: var(--sub-color-bule);
    font-weight: 300;
}
.footer_contacts-main p {
    font-family: dnp-shuei-mgothic-std, sans-serif;
    font-size: 1.8rem;
    color: var(--sub-color-bule);
}
.footer_contacts a:hover * {
    color: #fff;
}

/* フッターメニュー */
.footer_menu {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    padding-top: 3vw;
    background: linear-gradient(180deg, rgba(79,79,98,.86) 80%, rgba(79,79,98,.86) 100%);
    position: relative;
}
body:not(.home) .footer_menu,
body:not(.home) .footer_copyright {
    background: linear-gradient(180deg, rgba(79,79,98, 1) 80%, rgba(79,79,98, 1) 100%);
}
.zindex-1 {
    z-index: -1;
    overflow: hidden;
    position: inherit;
}
.zindex-10 {
    z-index: -10;
    overflow: hidden;
    position: inherit;
    pointer-events: none;
    backdrop-filter: blur(12px);
}
.zindex-10::after {
    content: "";
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,.9);
    -webkit-backdrop-filter: blur(67px);
    backdrop-filter: blur(67px);
}
.pos-a {
    position: fixed;
    display: block;
}
.posi-re {
    position: relative;
}
.footer_menu-logo {
    width: 90%;
}
.footer_menu-logo a {
    width: 200px;
    display: block;
    padding: 3rem 0;
}
.footer_menu-logo a img {
    width: 100%;
}
.pageTop {
    position: absolute;
    top: -74px;
}
.pageTop a {
    color: #fff;
    display: block;
    opacity: .4;
}
.pageTop a::before {
    content: "";
    background: url(../img/gotop_arrow-short.svg) no-repeat;
    background-position: bottom;
    display: block;
    width: 15px;
    height: 100px;
    margin: 0 auto;
    position: relative;
    left: -5px;
}
.pageTop a:hover {
    color: #F46B00;
    opacity: 1;
}
.pageTop a:hover::before {
    content: "";
    background: url(../img/gotop_arrow-long.svg) no-repeat;
    background-position: bottom;
}
.pageTop a span {
    display: block;
    margin-top: 10px;
}
/* フッターメニューの内側 */
.footer_menu-innner {
    display: flex;
    justify-content: space-between;
    width: 90%;
}
/* フッターの会社ロゴと住所 */
.footer_menu-address {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
    padding: 1rem 0 5rem 0;
    width: 20%;
}
/* フッターの余白設定 */
.footer_menu-address a, .footer_menu-address p {
    font-size: 1.4rem;
    padding: 0.5rem 0;
    color: #F7F7F7;
}
/* フッターの会社ロゴと住所のSNSアイコン */
.footer_menu-snsIcon {
    display: flex;
    justify-content: space-between;
    width: 12%;
    margin-top: 2.4rem;
}
.footer_menu-snsIcon li {
    padding: 0 0.5rem;
    color: #F7F7F7;
    margin-right: 2rem;
}
.footer_menu-snsIcon li:last-child {
    margin-right: 0;
}
.fa-facebook:before,
.fa-youtube:before {
    font-size: 1.8rem;
}
/* フッターのナビの大枠 */
.footer_menu-nav {
    width: 80%;
    padding: 1.5rem 0 5rem 0;
    text-align: right;
}
.footer_nav {
    margin-bottom: 3rem;
}
/* プライバシーポリシー表記 */
.footer_nav-privacy {
    font-size: 1.4rem;
}
/* フッターナビのul要素 */
.footer_nav-list {
    margin-bottom: 1rem;
    text-align: right;
    margin: 0 -1.2rem;
}
.footer_nav-list li {
    display: inline-block;
    margin: 0 1.2rem;
}
/* フッターナビのa要素 */
.footer_nav-list li a {
    font-size: 1.4rem;
}
/* フッターのコピーライト表記 */
.footer_copyright {
    padding: 1.6rem 0 50px 0;
    text-align: center;
    width: 100%;
    background: linear-gradient(180deg, rgba(79,79,98,.86) 80%, rgba(79,79,98,.86) 100%);
}
/* フッターのコピーライトのp要素 */
.footer_copyright p {
    font-size: 1.2rem;
    color: #A8A8C3;
    text-align: center;
}
.footer_menu-snsIcon li a:hover, .footer_nav-list li a:hover, .footer_nav-privacy:hover {
    color: #EB610E;
}


/****************************************
04. Module
*****************************************/
/********************
Works List
********************/
.works_block {
    width: 100%;
}
.works_block img {
    border-radius: .8vw .8vw 0 0;
    border-bottom: 1px solid var(--body-bg-color);
    width: 100%;
    height: auto;
    object-fit: cover;
}
.works_block ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    margin: 4rem auto 0;
    padding: 0 12%;
    width: 100%;
}
body.service .works_block ul {
    margin: 0　auto;
    gap: 1.8vw;
}
.works_block ul .works_li {
    width: calc(100% / 3 - 2.2%);
    margin-bottom: 4.8vw;

}
body.home .works_block ul .works_li {
    margin-bottom: 8.8vw;
}
.works_li {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -moz-transition: -moz-transform 0.2s linear !important;
    -webkit-transition: -webkit-transform 0.2s linear !important;
    -o-transition: -o-transform 0.2s linear !important;
    -ms-transition: -ms-transform 0.2s linear !important;
    transition: transform 0.2s linear !important;
    padding: 1vw;
    border-radius: 1vw;
}
body.service .works_block ul.service-carousel-sliderFor .works_li {
    padding: 1vw 0;
    margin-right: 4vw;
    margin-left: 0;
}
body.service .works_block ul .works_li {
    width: calc(100% / 3);
    min-width: 49rem;
}
body.service .works_block ul.service-carousel-sliderFor .works_li {
    min-width: unset;
}
.works_block ul li .works_li-inner {
    display: block;
    position: relative;
    width: 100%;
}
.works_block ul li .works_li-worksName {
    font-family: dnp-shuei-mgothic-std, sans-serif;
    font-weight: 500;
    font-size: 3.2rem;
    color: var(--sub-color-bule);
    line-height: 1.7;
    padding: 1.2rem 0 0;
    display: inline-block;
    margin-bottom: 2vw;
    white-space: initial;
}
.works_block ul li .works-serviceName_wrapper {
    width: auto;
    position: relative;
    top: 0;
    margin-top: .6vw;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    opacity: 1;
}
.works_block ul li .works-serviceName_wrapper .works-serviceName {
    font-family: dnp-shuei-mgothic-std, sans-serif;
    font-weight: 500;
    font-style: italic;
    letter-spacing: .2rem;
    color: var(--sub-color-bule);
    font-size: .5vw;
    padding: 0.1vw 1vw;
    background-color: var(--body-bg-color);
    border: 1px solid var(--sub-color-bule);
    margin: 0 1.5vw 2.3vw 0;
    border-radius: 100px;
}
.works_block ul li .works_li-categoryName_wrp {
    display: flex;
    opacity: .7;
}
.works_block ul li span.works-categoryName {
    font-family: dnp-shuei-mgothic-std, sans-serif;
    color: #48486C;
    font-size: 1.2rem;
    margin-right: 1vw;
    text-align: left;
}
.works_li:hover {
    -webkit-transform: scale(.98) !important;
    -moz-transform: scale(.98) !important;
    -o-transform: scale(.98) !important;
    -ms-transform: scale(.98) !important;
    transform: scale(.98) !important;
    background: rgb(233,96,95);
    background: linear-gradient(338deg, rgba(233,96,95,1) 0%, rgba(255,207,65,0.7273503151260504) 74%, rgba(253,200,45,1) 100%);
    -webkit-box-shadow: 1rem 1rem 1.5rem rgb(0 0 0 / 7%);
    box-shadow: 1rem 1rem 1.5rem rgb(0 0 0 / 7%);
}
body.service .works_li:hover {
    -webkit-box-shadow: none;
    box-shadow: none;
}
body.service .works_block ul.service-carousel-sliderFor .works_li:hover {
    padding: 1vw;
}
.works_li:hover img {
    border: 1px solid var(--main-color-fvOrange);
    -webkit-box-shadow: 1rem 1rem 1.5rem rgb(0 0 0 / 20%);
    box-shadow: 1rem 1rem 1.5rem rgb(0 0 0 / 20%);
}
.works_li:hover .works_li-worksName,
.works_li:hover .works-categoryName {
    color: #fff;
}
.works_block ul li:hover .works-serviceName_wrapper .works-serviceName {
    color: var(--main-color-fvOrange);
    border: 1px solid var(--main-color-fvOrange);
}
.home .works_block ul li.works_li {
    background-color: transparent;
}
.home .works_block ul li:nth-child(-n+5) .works-serviceName_wrapper {
    top: 0 !important;
}


/********************
News List
********************/
.newsList .section-wrapper {
    width: 100%;
    padding: 0 12vw;
}
.news-area {
    display: flex;
    flex-direction: column;
    margin: 15rem 0;
    width: 100%;
}
.news_block,
.recruitmentType .recruitmentType_type .recruitmentType_type_block,
.qa_block {
    margin: 8rem 0;
    padding: 0;
}
.news_block ul,
.recruitmentType .recruitmentType_type .recruitmentType_type_block ul,
.qa_block ul {
    display: flex;
    flex-direction: column;
    margin: 0 auto;
}
.news_block-parts,
.recruitmentType .recruitmentType_type .recruitmentType_type_block-parts,
body.recruit .recruit_recruiting-item .recruitmentType_type_block-parts,
.qa_block-parts {
    width: 100%;
    background: #fff;
    margin-bottom: 6rem;
    box-sizing: border-box;
    border: 2px solid #fff;
    font-family: dnp-shuei-mgothic-std, sans-serif;
    -moz-transition: -moz-transform 0.2s linear !important;
    -webkit-transition: -webkit-transform 0.2s linear !important;
    -o-transition: -o-transform 0.2s linear;
    -ms-transition: -ms-transform 0.2s linear !important;
    transition: transform 0.2s linear !important;
}
body.recruit .recruit_recruiting-item .recruitmentType_type_block-parts {
    margin-bottom: 4rem;
}
.news_block-parts:hover,
.recruitmentType .recruitmentType_type .recruitmentType_type_block-parts:hover,
body.recruit .recruit_recruiting-item .recruitmentType_type_block-parts:hover {
    -webkit-transform: scale(.98) !important;
    -moz-transform: scale(.98) !important;
    -o-transform: scale(.98) !important;
    -ms-transform: scale(.98) !important;
    transform: scale(.98) !important;
}
.news_block ul li div,
.newsDetail .articleDetail_data {
    margin-bottom: 2rem;
    display: flex;
    align-items: center;
    width: 100%;
    flex-direction: row;
    justify-content: flex-end;
    position: relative;
}
.news_block ul li div,
.news_block-tag,
.news_block-category,
.qa_block ul li p {
    font-family: dnp-shuei-mgothic-std, sans-serif;
}
.news_block ul li div {
    min-height: 3.6rem;
}
.news_block-date {
    font-size: 1.4rem;
    font-weight: bold;
    letter-spacing: .2rem;
    position: absolute;
    left: 0;
}
.news_block-tag span {
    font-size: 1.4rem;
    font-weight: normal;
    margin-right: 6px;
}
.news_block-tag span:not(:last-child)::after {
    content: ",";
}
.news_block-parts a .news_block-tag a {
    display: inline;
}
.news_block-category {
    display: inline-block;
    text-align: right;
    font-size: 1rem;
    margin-left: 1rem;
}
.news_block-category span {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    margin-left: 6px;
    background: linear-gradient(338deg, rgba(233,96,95,1) 0%, rgba(255,207,65,0.7273503151260504) 74%, rgba(253,200,45,1) 100%);
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    border-radius: 0.3rem;
}
.news_block ul li > a,
.recruitmentType .recruitmentType_type_block ul li > a,
.qa_block ul li {
    display: block;
    font-size: 1.8rem;
    letter-spacing: .4rem;
    line-height: 1.8;
    color: var(--font-baseColor-black);
    font-weight: 500;
    padding: 3rem 4rem 4rem 4rem;
    text-align: left;
    font-family: dnp-shuei-mgothic-std, sans-serif;
}
.newsList .news_block ul li > a {
    font-size: 2rem;
}

.news_block .news_block-parts:hover > a,
.recruitmentType .recruitmentType_type_block-parts:hover > a div:last-child .recruitment_type,
body.recruit .recruit_recruiting-item .recruitmentType_type_block-parts:hover > a div:last-child .recruitment_type {
    color: #EB610E;
}
.news_block .news_block-parts:hover > a div {
    color: #48486C;
}
.newsDetail .news_block-date a {
    font-size: 1.6rem;
}
.newsDetail .news_block-tag a {
    font-size: 1.4rem;
    color: #48486C;
}
.newsDetail .news_block-tag a:hover {
    border-bottom: none;
}
.newsDetail .news_block-category span a {
    font-size: 1.4rem;
    color: #fff;
    text-decoration: none;
}
.newsDetail .news_block-category span:hover {
    background: #F46B00;
}
.newsDetail .news_block-category span:hover a {
    color: #fff;
}
/********************
中心から外に線が伸びるアニメーション（下部）
********************/
.underline li {
    /*線の基点とするためrelativeを指定*/
	position: relative;
    padding-bottom: 6px;
}
.underline li.active {
    color: #F46B00;
    border-bottom: 1px solid #F46B00;
}
.underline li.active a,
.underline li a:hover {
	color: #F46B00;
}
.underline li a::after {
    content: '';
    /*絶対配置で線の位置を決める*/
    position: absolute;
    bottom: 0;
    left: 0%;
    /*線の形状*/
    width: 100%;
    height: 1px;
    background: #F46B00;
    border-radius: 10px;
    /*アニメーションの指定*/
    transition: all .3s;
    transform: scale(0, 1);/*X方向0、Y方向1*/
    transform-origin: center top;/*上部中央基点*/
}
/*現在地とhoverの設定*/
.underline li.active a::after,
.underline li a:hover::after {
    transform: scale(1, 1); /*X方向にスケール拡大*/
}

/********************
マウスオーバーで拡大するアニメーション
********************/
.zoom {
  cursor: pointer;
  overflow: hidden;
}
.zoom > * {
  transition: transform .2s ease;
}
.zoom:hover > * {
  transform: scale(1.1);/* 拡大 */
}

/********************
マウスオーバーでアニメーション
********************/
.move {
  transition: transform .6s ease;
}
.move:hover {
  transform: scale(1.04);/* 拡大 */
}

/********************
要素を回転させる
********************/
.rotate {
  animation: 10s linear infinite rotation1;
  transform-origin:center;
}
@keyframes rotation1{
  0%{ transform:rotate(0);}
  100%{ transform:rotate(360deg); }
}
