@charset "utf-8";
/* CSS Document */
:root {
--fontColor:#000;
--bgColor:#F6F6F6;
--primaryColor:#DC000C;
--secondaryColor:#F6A1A6;
--redColor:#DE0000;
--whiteColor:#fff;
--grayColor:#EEEEEE;
--lineColor:#A5A5A5;
--borderColor:#D2D2D2;
--shadowColor:rgba(0, 0, 0, 0.25);
--alphaColor:rgba(255, 255, 255, 0.5);
}
/*========= ▼reset ===============*/
/* ブラウザのUAスタイルシートのすべてのスタイルを削除します、displayは除く */
*:where(:not(iframe, canvas, img, svg, video, a):not(svg *)) {all: unset;display: revert;}
/* box-sizingの優先値 */
*, *::before, *::after {box-sizing: border-box;}
/* リストのスタイル（箇条書き・番号）を削除します */
ol,ul {list-style: none;}
/* 画像がコンテナを超えないようにするため */
img {max-width: 100%;}
/* テーブルのセル間のスペースを削除します */
table {border-collapse: collapse;}
/*========= ▲reset ===============*/
a {
transition: all .5s;
-webkit-transition: all .5s;
-moz-transition: all .5s;
text-decoration: none;
    color: #333;
}
a:hover, a:focus, a:active{color: var(--fontColor);} 
body.devPc a:hover{opacity: 1;}
#container > .wrapContent {
padding: 0;
width: 100%;
}
img {width: auto;max-width: 100%;vertical-align: bottom;}
.pagesUi{z-index: 999;}

#HEADER .global{display: none;}
#CONTENTS, body:not(.noGlobal) #CONTENTS {margin-left: 0;padding: 0;}
#FOOTER{margin-left: 0;}
#PAGEBODY {padding-bottom: 0;}

#feature_corporate {overflow: hidden;font-family:"Noto Sans JP", sans-serif;font-optical-sizing: auto;font-style: normal;line-break: strict;overflow-wrap: break-word;word-wrap: break-word;word-break: break-word !important;line-height: 1.8;color: var(--fontColor);max-width: 1920px;margin: auto;}

article, #feature_corporate h2 {font-family:"Noto Sans JP", sans-serif;font-optical-sizing: auto;font-style: normal; line-break: strict;overflow-wrap: break-word;word-wrap: break-word;word-break: normal !important;letter-spacing:inherit;color: var(--fontColor);}
#feature_corporate p {margin: 0;font-size: 16px;}
#feature_corporate ul {list-style: none;margin: 0;padding: 0;position: relative;}
.font_small {font-size: 80%;}
.font_ss{font-size: 70%;}
.font_sss{font-size: 62%;}
.font_l{font-size: 126%;}
.font_large {font-size: 140%;}
.font_ll{font-size: 165%;}
.line_center {text-align: center;}
.line_right{text-align: right;}
.line_left{text-align: left;}
.font_bold{font-weight: bold;}
.font_red {color: var(--redColor);}
/*========= LoadingのためのCSS ===============*/
.loader-wrap {position: fixed;display: flex;align-items: center;justify-content: center;
    width: 100%;height: 100vh;background: var(--primaryColor);z-index: 999;}
.loader,.loader:before,.loader:after {border-radius: 50%;width: 2.5em;height: 2.5em;-webkit-animation-fill-mode: both;animation-fill-mode: both;-webkit-animation: load7 1.8s infinite ease-in-out;animation: load7 1.8s infinite ease-in-out;}
.loader {color: #ffffff;font-size: 10px;margin: 80px auto;position: relative;text-indent: -9999em;-webkit-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);-webkit-animation-delay: -0.16s;animation-delay: -0.16s;}
.loader:before, .loader:after {content: '';position: absolute;top: 0;}
.loader:before {left: -3.5em;-webkit-animation-delay: -0.32s;animation-delay: -0.32s;}
.loader:after {left: 3.5em;}
@-webkit-keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
@keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
/*========= ▲LoadingのためのCSS ===============*/
#feature_corporate section:not(#sec01) {position: relative;padding: 5% 0;}
#feature_corporate .sec-inner {position: relative;max-width: 1290px; width: 92%; margin: 0 auto;}
#feature_corporate .dh2{text-align: center;}
#feature_corporate #sec02, #feature_corporate #sec04 {background: var(--bgColor);}
#feature_corporate h2 {font-size: clamp(21px, 2.4vw, 38px);font-weight: 600;position: relative;display: inline-block;}
#feature_corporate h2::before{position: absolute;content: "";width: 30%;height: 5px;background: var(--primaryColor);left: 50%;bottom: -10px;transform: translateX(-50%);}
#feature_corporate .cateBox{margin: 6% auto 4%;}
#feature_corporate .cateUl{display: flex;flex-wrap: wrap;justify-content: space-around;}
#feature_corporate .cateUl li {flex-basis: 48%;background: var(--fontColor);position: relative;overflow: hidden;box-shadow: 0px 10px 15px var(--shadowColor);border-radius: 5px;margin-bottom: 2%;}
#feature_corporate .cateUl li a .cateImg {width: 100%;opacity: .5;transition: all .5s;}
#feature_corporate .cateUl li a .cateTitle {color: var(--whiteColor);font-size: clamp(17px, 2vw, 32px);font-weight: 400;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);text-align: center;width: 100%;}
#feature_corporate .btnArea {text-align: center;}
#feature_corporate a.btnRed{font-size: clamp(20px, 2vw, 32px);font-weight: 500;text-align: center;padding: 0.5em 2em;border: solid 3px var(--primaryColor);border-radius: 50vh;display: inline-block;line-height: 1.3;background: var(--whiteColor);transition: all .5s;}
#feature_corporate a.btnRed i {margin-left: 10px;font-size: clamp(18px, 1.4vw, 22px);}
#feature_corporate .serviceArea{margin: 5% auto 0;}
#feature_corporate ul.serviceUl {display: flex;justify-content: space-around;position: relative;padding: 0 0 5%;}
#feature_corporate .serviceUl::before{position: absolute;content: "";z-index: -1;background: var(--primaryColor);width: 300vw;left: 50%; transform: translateX(-50%);bottom: 0;top: 15%;}
#feature_corporate .serviceUl li {flex-basis: 30.333%;color: var(--whiteColor);position: relative;}
#feature_corporate .abNo {position: absolute;width: 20%;top: -5%;left: -7%;}
#feature_corporate h3.serviceTitle {font-size: clamp(22px, 2vw, 32px);font-weight: 500;margin: 0.7em auto;}
#feature_corporate .serviceSum {font-size: clamp(13px, 1vw, 16px);}
#feature_corporate .serviceImg{overflow: hidden;border-radius: 5px;box-shadow: 0 10px 15px var(--shadowColor);}
#feature_corporate section#sec03 {padding-bottom: 0 !important;}
#feature_corporate .toggle_contents{background: var(--whiteColor);border: solid 2px var(--borderColor);border-radius: 5px;}
#feature_corporate .toggle_txt {display: none;}
#feature_corporate .toggle_title{font-size: clamp(24px, 2.4vw, 38px);font-weight: 500;background: var(--grayColor);padding: 0.5em 1em;position: relative;}
#feature_corporate .toggle_title:after {font-family: "Font Awesome 5 Free";font-weight: 900;content: "\f067";transition: 0.3s;color: var(--primaryColor);position: absolute;right: 3%;top: 50%;transform: translateY(-50%);font-size: clamp(24px, 2.4vw, 38px);transition: 0.3s;}
#feature_corporate .toggle_title.selected:after {font-family: "Font Awesome 5 Free";font-weight: 900;content: "\f068";transition: 0.3s;color: var(--primaryColor);position: absolute;right: 3%;top: 50%;transform: translateY(-50%);font-size: clamp(24px, 2.4vw, 38px);}
#feature_corporate .toggleArea{margin: 1% 4%;}
#feature_corporate .toggle_dl{position: relative;padding-bottom: 2.5%;padding-top: 2.5%;}
#feature_corporate .toggle_dl dt {font-size: clamp(22px, 2vw, 32px);font-weight: 500;padding-left: 1.5em;border-bottom: solid 1px var(--lineColor);position: relative;}
#feature_corporate .toggle_dl dt::after {position: absolute;display: block;content: "";background: var(--primaryColor); left: 0;width: 1em;height: 7px;top: 50%;transform: translateY(-50%);}
#feature_corporate .toggle_dl dd {font-size: clamp(15px, 1.15vw, 18px);padding-left: 2em;margin: 2% auto 5%;}
#feature_corporate .toggle_dl:not(:last-child) dd::after {position: absolute;content: ""; border-top: solid 17px var(--primaryColor);border-left: solid 21px transparent;border-right: solid 21px transparent;left: 50%;bottom:0;transform: translateX(-50%);}
#feature_corporate .serviceArea2{margin: 5% auto 0;}
#feature_corporate ul.serviceUl2 {display: flex;justify-content: space-around;position: relative;padding: 0 0 20%;}
#feature_corporate .serviceUl2::before{position: absolute;content: "";z-index: -1;background: var(--secondaryColor);width: 300vw;left: 50%; transform: translateX(-50%);bottom: 0;top: 10%;}
#feature_corporate .serviceUl2 li {flex-basis: 30.333%;position: relative;background: var(--whiteColor);border-radius: 5px;box-shadow: 0 3px 10px var(--shadowColor);overflow: hidden;}
#feature_corporate h3.serviceTitle2 {font-size: clamp(19px, 1.75vw, 28px);font-weight: 500;color: var(--primaryColor);text-align: 
center;padding: 0.5em 0;line-height: 1.3;}
#feature_corporate .imgArea {position: relative;overflow: hidden;}
#feature_corporate .serviceUl2 li a .serviceImg2 {width: 100%;transition: all .5s;}
#feature_corporate .logoImg {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);background: var(--alphaColor);padding: 10px;backdrop-filter: blur(20px);-webkit-backdrop-filter:blur(20px);}
#feature_corporate dd a{transition: all .5s;}
#feature_corporate section#sec05 {padding-bottom: 0;}
@media (any-hover: hover) {
/*:hover はここに書く*/
#feature_corporate .cateUl li:hover .cateImg {transform: scale(1.1);opacity: .85;}
#feature_corporate a:hover.btnRed {transform: translateY(-5px);box-shadow: 0 10px 15px var(--shadowColor);}
#feature_corporate dd a:hover{color: var(--redColor);}
#feature_corporate .serviceUl2 li:hover a .serviceImg2 {transform: scale(1.1);}
}
#feature_corporate .pad-cam {display: block !important;}
#feature_corporate .pad-pc {display: block !important;}
#feature_corporate .sp-cam {display: none !important;}
#feature_corporate .banner3 {display: none;position: fixed;margin: 15px 20px;z-index: 999;bottom: 12%;right: 0;}
#feature_corporate .banner3 a {text-decoration: none;transition: all .5s;}
#feature_corporate .banner-icon3{font-size: 26px;}
#feature_corporate .banner-back3 {width: 300px;}
#feature_corporate .banner-top3 img, .banner-bottom3 img {filter: drop-shadow(0px 3px 8px var(--shadowColor));}
#feature_corporate a .banner-copy3{color: #000;}
#feature_corporate .banner-copy3 {font-size: 16.5px;position: relative;font-family:"Noto Sans JP", sans-serif;margin-bottom: 0 !important;}
#feature_corporate .banner-bottom3 {padding: 15px 0;line-height: 1.6;}
#feature_corporate .banner-body3 {width: 300px;background: transparent;color: #000000;font-weight: bold;text-align: center;}
#feature_corporate .banner-close3 {font-weight: 900;position: absolute;top: -13px;right: -4px;z-index: 99999;padding: 4px 8px;border: none;background-color: #0077BE;border-radius: 25px;cursor: pointer;-webkit-box-shadow: 0 0 7px rgb(0 0 0 / 40%);box-shadow: 0 0 7px rgb(0 0 0 / 40%);line-height: 1.5;font-family:"Noto Sans JP", sans-serif;color: #fff;}
#feature_corporate .onlySPC, #feature_corporate .onlyPc {display: block;}
#feature_corporate dd a i, #feature_corporate h3 i{margin-left: 8px;font-size: 75%;}

/************************************************************/@media screen and (max-width: 1279px) {
  #HEADER .global{display: block;}
}

/************************************************************/@media screen and (max-width: 820px) {
#feature_corporate .pad-cam {display: block !important;}
#feature_corporate .pad-pc {display: block !important;}
#feature_corporate .pc-cam {display: none !important;}
#feature_corporate .sp-cam {display: none !important;}
}
/************************************************************/@media screen and (max-width: 768px) {
#feature_corporate .banner3 {display: block;width: 40%;z-index:99;position: fixed;bottom: 4%;}
#feature_corporate .banner-icon3 {font-size: 24px;}
#feature_corporate .banner-body3 {width: 100%;border-radius: 0px;color: #000000;font-weight: bold;text-align: center;}
#feature_corporate .banner-back3 {width: 100%;margin: 0px;border-radius: 0px;}
#feature_corporate .banner-bottom3 {padding: 5px 5px 3px;line-height: 1.6;}
#feature_corporate p.banner-copy3 {font-size: 14px;position: relative;margin: 0;line-height: 1.4;}
#feature_corporate .banner3 a{text-decoration: none;}
#feature_corporate .onlySPC, #feature_corporate .onlyPc{display: none;}
}
/************************************************************/@media screen and (max-width: 700px) {
#feature_corporate .btnArea{margin: 2em 0;}
#feature_corporate .cateBox, #feature_corporate .serviceArea, #feature_corporate .serviceArea2 {margin-top: 12%;}
#feature_corporate ul.serviceUl, #feature_corporate ul.serviceUl2 {margin: 0 1em;flex-direction: column;}
#feature_corporate .serviceUl::before{top: 5%;}
#feature_corporate .serviceUl li{margin-bottom: 17%;}
#feature_corporate .serviceUl2 li{margin-bottom: 15%;}
#feature_corporate .pad-sp {display: block !important;}
#feature_corporate .pc-cam {display: none !important;}
#feature_corporate .pad-cam {display: none !important;}
#feature_corporate .pad-pc {display: none !important;}
#feature_corporate .banner3{width: 75%;position: relative;margin: 0 auto 5%;}
#feature_corporate .onlySPC{display: block;}
#feature_corporate .onlyPc{display: none;}
}