@charset "UTF-8";



body{font-family:"Yu Gothic Medium", YuGothic, "Yu Gothic", sans-serif; letter-spacing:0.1em; line-height:1.5; margin:0; padding: 0; background: #E85D27; font-size: 16px;}

.hide-text{position: absolute; text-indent: -100vw; white-space: nowrap; overflow: hidden;}

.wrap{ padding: 0 60px; margin: 0 auto; box-sizing: border-box;}
@media screen and (max-width: 1200px) {
.wrap{ padding: 0 50px;}
}
@media screen and (max-width: 750px) {
.wrap{ padding: 0 7%;}
}

.js-fade {
  opacity: 0;
  transition-duration: .8s;
}
.js-fade.is-inview {
  opacity: 1;
  transition-delay: .3s;
}

.cshover button,
.cshover input,
.cshover a, 
a.cshover{ -webkit-transition:all .3s; transition:all .3s;}
.cshover button:hover,
.cshover input:hover,
.cshover a:hover, 
a.cshover:hover { -webkit-opacity: 0.6; opacity: 0.6; }

@media screen and (min-width: 751px) {
.sp-hide { display: block;}
.sp-hide-inline { display: inline;}
.sp-show { display:none !important;}
.sp-show-inline { display:none !important;}
}
@media screen and (max-width: 750px) {
.sp-hide-inline, .sp-hide { display: none !important;}
.sp-show{ display:block;}
.sp-show-inline{ display:inline;}
.sp-br-none br, br.sp-br-none {display: none;}
.flex.sp-noflex { display: block;}
}

a[href*="tel:"] {color: #fff;}
@media (min-width: 751px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}

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


.index-main{min-height: 100vh; min-height: 100svh; display: flex;  justify-content: center;  align-items: center;}
.index-main img {width: min(54vw,540px);}


.message{width: 100%; max-width: 1200px; height: min(55vw,550px); box-sizing: border-box; margin: 30px auto 0; border-radius: min(17vw,166px); background: url("/assets/images/message.jpg") center/cover no-repeat; display: flex; align-items: center; color: #E85D27; padding: min(10vw,100px);}
.message_box { width: 540px; position: relative; display: flex; flex-direction: column; align-items: flex-start; padding-left: min(7vw,67px);}
.message_boxtext {font-size: clamp(18px, calc(27 / 1500 * 100vw), 27px); margin-bottom: min(10vw,100px); line-height: 2.1;}
.message_box .ceo {position: absolute; right: 0; bottom: -50px; font-size: clamp(16px, calc(24 / 1500 * 100vw), 24px);}
.message_box .ceo span{ font-size: clamp(13px, calc(17 / 1500 * 100vw), 17px);}
@media screen and (max-width: 1280px) {
  .message_box{width: fit-content; padding-left: 50px;}
}
@media screen and (max-width:1000px) {
  .message{background-position: 60% center; letter-spacing: 0;}
  .message_box{padding-left: 0;}
  .message_boxtext {margin-bottom: 20px; font-size: 20px;}
  .message_box .ceo{ position: relative; bottom: 0; margin-bottom: min(5vw,50px);}
}
@media screen and (max-width:750px){
.message{height: auto; padding-top: 60%; background-position-x: 80%; padding-inline: 50px; background: url("/assets/images/message-sp.jpg?d") 80% center/cover no-repeat;}
.message_boxtext,.message_box .ceo{line-height: 1.7; -webkit-text-stroke: 3px #f5f1ed; text-stroke: 3px #f5f1ed; paint-order: stroke;}
}
@media screen and (max-width:500px){
  .message{padding-inline: 30px; padding-bottom: 40px;}
  .message_boxtext {margin-bottom: 10px; font-size: 16px;}
  .message_box .ceo{margin-bottom: 30px;}
}

/* モーダルボタン */
#modalArea { color: #E85D27; display: none; position: fixed; z-index: 10; top: 0; left: 0; width: 100%; height: 100%;}
.modalBg {width: 100%; height: 100%; background-color: rgba(0,0,0,0.7);}
.modalWrapper {position: absolute; top: 50%; left: 50%; transform:translate(-50%,-50%); width: 80%;  max-width: 800px; padding:  min(5vw,50px); background-color: #fff; border-radius: 30px;}
#openModal {width: 200px; height: 50px; padding: 12px 25px; background-color: #fff; border-radius: 50px; cursor: pointer; color: #fff; background-color: #E85D27; border: none; font-size: clamp(15px, calc(20 / 1500 * 100vw), 20px); letter-spacing: 0.01em;}
#closeModal {position: absolute; top: 1rem; right: 1.5rem; cursor: pointer; font-size: 25px;}
@media screen and (max-width:800px) {
  #openModal {width: fit-content;}
  .modalWrapper{padding-block: 80px;}
}
@media screen and (max-width:500px) {
  #openModal {height: auto;}
}



.company{width: 100%; margin: min(16vw,160px) auto min(20vw,200px); color: #fff;  display: flex; flex-direction: column; align-items: center;  background: url("/assets/images/bg.svg?a") center 0 / cover no-repeat;}
.company a{color: #fff; text-decoration: none;}
.company_ttl{border-bottom: 1px solid #fff; border-top: 1px solid #fff; margin-inline: auto; display: block; width:fit-content; padding: 10px 20px; text-align: center; letter-spacing: 0.3em; line-height: 1.2; font-size: clamp(18px, calc(25 / 1500 * 100vw), 25px);}
.company_list{margin-top: clamp(30px, 4.5vw, 45px);}
.company_list dl{ display: grid; grid-template-columns: min(12vw,120px) 1fr; row-gap: 20px; width: 100%; font-size: clamp(18px, calc(25 / 1500 * 100vw), 25px);}
.company_list dt,.company_list dd{margin: 0;}
@media screen and (min-width: 1501px) {
  .company{background: url("/assets/images/bg.svg?a") right 100% / contain no-repeat;}
}
@media screen and (max-width: 750px) {
  .company{background-position: right 60%; background-size: 120%;}
.company_list dl{gap: 20px;}
}
@media screen and (max-width: 500px) {
.company{margin-block: 100px;}
.company_list dl{font-size: 16px;}
}

.ft_logo{margin: 0 auto; margin-bottom: 65px; width: 100%;}
.ft_logo ul{display: flex; gap: min(10vw,150px); align-items: center; justify-content: center;}
@media screen and (max-width: 500px) {
.ft_logo{margin-bottom: 80px;}
}