@charset "UTF-8";

:root{
  --brand:#c8102e;  /* 襍､ */
  --brand-dark:#a30c23;
  --ink:#1b1b1b;
  --muted:#000000;
  --line:rgba(0,0,0,.08);
  --bg:#f5f7fb;
  --card:#ffffff;
  --radius:24px;
  --shadow:0 14px 40px rgba(15,23,42,.12);
  --shadow-soft:0 10px 28px rgba(15,23,42,.10);
  --container:1200px;
  --page-bg: #f6fbff;
  --text: #1b2a33;
  --muted: #5c6a72;

  --warm-1: #ff9a8d;
  --warm-2: #ff6f80;

  --now-1: #88b2e3;
  --now-2: #d163b2;
    
  --cool-1: #2f9cc6;
  --cool-2: #4fc7cf;

  --line: #cfe3ee;
  --accent: #ff4d5e;

  --card-bg: #ffffff;
  --card-br: #cfe3ee;

  --radius-xl: 28px;
  --radius-lg: 18px;
  --shadow: 0 12px 30px rgba(9, 30, 66, 0.08);
}

h1,h2,h3,h4,h5,p {
    margin:0;
}

/* ===== Common ===== */


*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: "Noto Sans JP","Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  color:var(--ink);
  background: linear-gradient(90deg, #def0f4 0%,#eaeff3 45%, #eaeff3 60%, #dcedf4 90%);
}
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }

.container{
  width:min(var(--container), calc(100% - 40px));
  margin-inline:auto;
}

.flex {
    display: flex;
}



/* ===== Header ===== */
.header{
    position:fixed;
    width:100%;
    top:0;
    z-index:50;
    backdrop-filter:saturate(180%) blur(10px);
    background:rgba(255,255,255,.6);
    border-bottom:1px solid var(--line);
}
.header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0;
}
.head_logo {
	max-width:328px;
    width:100%;
	margin:10px 0 0 0;
}
header a.brand {
	width:27%;
	margin-left:10px;}
header a.brand:hover{
	opacity: .75;
	transition: .3s;
}
.nav{
    display:flex;
    align-items:center;
    font-size:17px;
    color:#111827;
    height:71px;
}
.nav a{
    padding:24px 15px 0 15px;
    transition:.15s ease;
    height:100%;
    border-bottom:0px solid rgba(236,50,55,1.00);
}
.nav a:hover{
    opacity:1;
    box-sizing:border-box;
    border-bottom:5px solid rgba(236,50,55,1.00);}

.header__cta{
	display:flex;
	align-items:center;
	max-width:336px;
    width:23%;}
.btn{
    background-image: url("../img/btn01.jpg");
	max-width:146px;
	background-size:100% 100%;
	display:inline-flex;
	height:71px;
    width:43.5%;
    color:#ffffff;
    font-weight:400;
    align-items:center;
    justify-content:center;
    font-size:16px;
    transition:.15s ease;
}
.btn--primary{
    background-image: url("../img/btn02.jpg");
    max-width:190px;
    width:56.5%;
    color:#fff;
    box-shadow:0 12px 26px rgba(200,16,46,.25);
}

.btn:hover {
    opacity:0.8;
}

.hamburger{
  display:none;
  width:65px; height:65px;
  border:1px solid var(--line);
  background:#ec3237;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.hamburger span{
  width:18px; height:2px;
  background:#ffffff;
  display:block;
  position:relative;
}
.hamburger span::before,
.hamburger span::after{
  content:"";
  position:absolute;
  left:0;
  width:18px; height:2px;
  background:#ffffff;
}
.hamburger span::before{ top:-6px; }
.hamburger span::after{ top:6px; }

.drawer__top .btn {
    background-color: red;
    border: 0;
    max-width: 65px;
    height:65px;
    right: 0;
    top: 0;
    position: absolute;}

.header__inner {
    padding: 0;}

.gnav {
    width:50%;
}
.gnav ul {
    list-style: none;
    display: grid;
    grid-template-columns: 1.4fr 1.3fr 0.5fr 1fr;
    gap: 5%;
    height: 59px;
    margin: 0;
    padding: 0;
    text-align: center;
}

.gnav ul.medical_nav li {
	min-height:2.5em;}

.gnav ul.medical_nav li a {
    margin: auto;
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 4em;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}

.gnav ul.medical_nav li a {
	background-color:#f2f2f2;}

.gnav ul.medical_nav li a:hover {
	background-color:#7bc1e4;}

.gnav ul.medical_nav li.no_link a {
    color: #a8a8a8;
    pointer-events: none;
}
.gnav ul.medical_nav li.no_link a:hover {
	background: none;
}

.gnav__link {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content:center;
}

.gnav__link:hover {
    border-bottom:5px solid rgba(237,51,56,1.00);
    box-sizing:border-box;
    padding: 5px 0 0 0;
    }

/* mega menu */

.gnav__item.has-mega{
    position:relative;
    display: flex;
    align-items: center;
    height: 100%;}

.megaFixed{
  position:fixed;   /* ←これで左右固定＆はみ出しゼロ */
  left:0; right:0;
  top: var(--headerH, 59px); /* ヘッダー高さに合わせる */
  padding:12px 0;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:.18s ease;
  pointer-events:none;
}
.megaFixed__inner{
  width:min(1100px,92vw);
  margin:0 auto;
  background:#fff;
  border-radius:12px;
  box-shadow:0 12px 28px rgba(0,0,0,.12);
  padding:2% 2% 3% 2%;
  pointer-events:auto;
}
.gnav__item.has-mega:hover > .megaFixed,
.gnav__item.has-mega:focus-within > .megaFixed{
  opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto;
}

/* アクティブ見た目 */
.gnav__item.has-mega:hover > .gnav__link,
.gnav__item.has-mega:focus-within > .gnav__link{
  font-weight:700;
}

.megaFixed__inner ul li a img {
    max-width: 100%;
    display: block;
    overflow: hidden;
    object-fit: cover;
    height: 100px;
    width: 100%;
    border-radius: 10px;
    margin-bottom: 10px;
}

.megaFixed__inner ul li a:hover {
    opacity:0.8;
    transition:0.3s;
}


/* ===== Hero ===== */
.hero{
    position:relative;
    max-height:827px;
    height:100%;
    border-radius:0 0 40px 40px;
    display:grid;
    place-items:center;
    overflow:hidden;
}
.hero__bg{
  position:absolute; inset:0;
	background-image:url("../img/main_back.jpg");
	background-size:cover;
    background-position:center;
/*  background:
linear-gradient(180deg, rgba(255,255,255,.20) 0%, rgba(255,255,255,.72) 70%, rgba(255,255,255,1) 100%),
url("assets/hero.jpg") center/cover no-repeat;
  transform:scale(1.02);*/
}

.hero__logo{
  font-size:58px;
  font-weight:800;
  letter-spacing:.05em;
  color:rgba(255,255,255,.92);
  text-shadow:0 18px 40px rgba(0,0,0,.25);
  line-height:1;
  margin:0;
}
.hero__copy{
    justify-self:end;
	position: absolute;
	bottom:6%;
	left:55%;
}
.hero__copy p{
  margin:0;
  font-size:40px;
  line-height:1.7;
  font-weight:700;
  text-align:left;
}
.hero__inner{
    position:absolute;
    width:100%;
    max-width:1120px;
    margin:0;
    bottom:0;
    }
.hikari {
    font-size: 145px;
    color: #ffffff;
    padding: 0;
    margin: 0;
    line-height: 0.85;
}

.gnav .megaFixed__inner ul {
    grid-template-columns: 1fr 1fr 1fr;
    height:inherit;
    gap:7.25% 10%;
    text-align:center;
    font-size:min(1.3vw,16px);
    font-weight:bold;
}



/* ===== Lists (News / Press) ===== */
.two-col{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:18px;
  margin-top:85px;
  position:relative;
  z-index:2;
}
.panel__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 0 30px 0;
}
.panel__title{
  font-weight:800;
  letter-spacing:.02em;
  font-size:22px;
  color:#111827;
}

.panel__title span{
    font-size:16px;
    color:#ed3336;
    margin-left: 0.5em;
    font-weight: 600;}

.panel__more{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px;
  color:#111827;
  opacity:.8;
    position: relative;
}
.list_arrow {
    display:block;}

.panel__more:hover .list_arrow {
    opacity: 0.8;
    transition:0.3s;}

.panel__more .dot{
  width:24px; height:24px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--line);
  display:grid; place-items:center;
  box-shadow:0 8px 18px rgba(15,23,42,.08);
  color:var(--brand);
  font-weight:900;
  line-height:1;
}
.list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.list__item a {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    height:90px;
    border-radius:7px;
    padding:26px 15px;
    background:rgba(255,255,255,.70);
    border:1px solid rgba(0,0,0,.06);
    transition:0.3s;
}
.list__item a:hover {
    opacity:0.8;
    background: rgb(243 228 228);
    transition:0.3s;}

.badge{
    font-size:14px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(97,97,97,1.00);
    color:#ffffff;
    font-weight:normal;
    white-space:nowrap;
}
.meta{
  display:flex; align-items:center; gap:10px;
  min-width:0;
  flex:1;
}
.date{
  font-size:16px;
  white-space:nowrap;
}
.title{
  font-size:16px;
  color:#111827;
}

.medical .panel__title{
	border-left:5px solid #d80012;
	padding:10px 20px;
	margin-top:30px;
}

.medical .panel__title span{
	display:none;}


/* ===== Two cards (General/Medical) ===== */
.cards{
    margin:70px 0;
    background:rgb(255,255,255);
    border-radius:28px;
    padding:78px 0;
    box-shadow: 0 0 40px rgb(168 213 235);
}
.cards .container {
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:40px;
}
.card{
    position:relative;
    overflow:hidden;
    border-radius:17px;
    max-width:580px;
    aspect-ratio:580 / 300;
}

@media screen and (max-width:960px){
.cards .container {grid-template-columns: 1fr;}
.cards .card {width:100%;justify-self:center;}
}

.card:hover {
    transition:0.3s;
    opacity: 0.8;}
.card__bg{
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(0,0,0,.30), rgba(0,0,0,0) 65%),
  url("../img/general.png") center/cover no-repeat;
}
.card:nth-child(2) .card__bg{
  background: linear-gradient(90deg, rgba(0,0,0,.30), rgba(0,0,0,0) 65%),
  url("../img/medical.png") center/cover no-repeat;
}
.card__label{
    position:relative;
    padding:160px 18px 0px 60px;
    font-size:25px;
    font-weight:800;
    color:#fff;
    text-shadow:0 10px 22px rgba(0,0,0,.35);
    }
.card__label small{
  display:block;
  opacity:.95;
  font-weight:800;
  letter-spacing:.08em;
  margin-top:4px;
}
.card__arrow{
    position:absolute;
    right:-1px;
    bottom:-1px;
    width:70px;
    height:70px;
    border-radius:20px 0 10px 0;
    background:#fff;
    border:1px solid var(--line);
    display:grid; place-items:center;
    box-shadow:0 14px 30px rgba(15,23,42,.18);
    color:var(--brand);
    font-weight:900;
}

/* ===== Section blocks ===== */
.section{
  margin-top:26px;
}
.section__grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:18px;
  align-items:start;
}
.section__lead{
}
.section__lead h2{
  margin:0 0 10px;
  font-size:20px;
  letter-spacing:.02em;
}
.section__lead p{
  margin:0;
  color:var(--muted);
  line-height:1.9;
  font-size:16px;
}

.menu{
    display:flex;
    flex-direction:column;
    font-size:22px;
}
.menu__item{
    padding:14px 16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-weight:600;
    color:#111827;
    border-bottom:1px solid #000000;
    position:relative;
    transition:0.3s;

}
.menu__item:after {
    content:"";
    position:absolute;
    right:20px;
    top:40%;
    background-image: url("../img/arrow_off.png");
    width:17px;
    height:15px;
    background-size:100% 100%;
    transition:0.3s;
}
.menu__item--active,
.menu__item:hover {
    background:var(--brand);
    color:#fff;
    border-color:transparent;
    transition:0.3s;
}

.menu__item.menu__item--active:after,
.menu__item:hover:after {
    background-image: url("../img/arrow_on.png");
}
.chev{
  width:34px; height:34px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.06);
  display:grid; place-items:center;
  color:var(--brand);
  font-weight:900;
  flex:0 0 auto;
}
.menu__item--active .chev{
  background:rgba(255,255,255,.92);
  color:var(--brand);
}
.company_info {
    position:relative;
    margin:0 auto;
    padding:85px 0;
}

.company_info .section__lead h2 {
    font-size:40px;
}

.company_info .section__lead p {
    font-size:16px;
}

.company_info .section__lead .company_en {
    font-size:145px;
    font-family:"Inter",sans-serif;
    font-weight:100;
    color:#ffffff;
    position:absolute;
    top:0;
    left:10%;
    z-index:-1;
    line-height:0.8;
    opacity: 0.8;
}

/* ===== Service slider ===== */
.service{
    margin-top:18px;
    background:rgba(255,255,255,1);
    border-radius:50px;
    box-shadow:var(--shadow);
    padding:145px 0 100px 0;
    position:relative;
    z-index:1;
}

.service__head{
    margin-bottom:12px;
    width:27%;
}
.service__head div {
    width:80%;
}
.service__head h2{
  margin:0 0 20px 0;
    line-height: 1;
  font-size:40px;
  letter-spacing:.02em;
}
.service__head p{
  margin:0;
  color:var(--muted);
  line-height:1.8;
  font-size:14px;
  max-width:620px;
}

.service__head p.service_en {
    font-size: 145px;
    font-family: "Inter", sans-serif;
    font-weight: 100;
    color: #d4edf4;
    position: absolute;
    top: 3%;
    left: 12%;
    z-index: -1;
    line-height: 0.8;
    opacity: 0.3;
}

.service_content {
    gap:20px;
}

.svc{
  scroll-snap-align:start;
  flex:0 0 280px;
}
.svc__img{
    height:371px;
    transition:0.3s;
    border-radius:18px;
    background-size:cover;
    position:relative;
    box-shadow:0 0 7px rgba(0,0,0,0.2);
}

.svc__img span {
    background-color:#ffffff;
    width:70px;
    height:70px;
    border-radius:15px 0 15px 0;
    position:absolute;
    transition:0.3s;
    bottom: 0;
    right: 0;
    padding:30px 0 0 30px;
}

.svc__img span:before {
    background-image:url("../img/arrow_off.png");
    content:"";
    width:17px;
    height:15px;
    display:block;
    transition:0.3s;
}

.svc:hover .svc__img {
    opacity:0.8;
    transition:0.3s;
}

.svc:hover .svc__img span {
    background-color:rgba(200,16,46,1.00);
    transition:0.3s;
}

.svc:hover .svc__img span:before {
    background-image:url("../img/arrow_on.png");
    transition:0.3s;
}

.svc:nth-child(1) .svc__img{ background-image:url("../img/service01.png"); }
.svc:nth-child(2) .svc__img{ background-image:url("../img/service02.png"); }
.svc:nth-child(3) .svc__img{ background-image:url("../img/service03.png"); }
.svc__body{
  padding:14px 14px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.svc__title{
  font-weight:600;
  font-size:22px;
  letter-spacing:.02em;
}



/* ===== Big banners ===== */
.vision_banner_area {
    margin:50px 0 64px 0;
}

.vision_banner_area a {
    width: 80vw;
    background-image: url("../img/vision_back.jpg");
    background-size: 100%;
    background-position: left 57%;
    height: 370px;
    margin-left: auto;
    border-radius: 20px 0 0 20px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    display:block;
}

.recruit_banner_area a {
    width: 80vw;
    background-image: url("../img/recruit_back.jpg");
    background-size: 100% auto;
    background-position: right 84%;
    height: 370px;
    margin-right: auto;
    border-radius: 0 20px 20px 0;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    display:block;
}

.vision_banner_area a:hover,
.recruit_banner_area a:hover {
    opacity: 80%;
    transition:0.3s;
}

.vision_inner {
    padding: 6% 0 0 5%;
    height: 100%;
    position: relative;
    margin-right: calc((100vw - 17px - 1200px) / 2);
}

.recruit_inner {
    position:relative;
    height:100%;}

@media screen and (min-width:1200px){
.recruit_inner {
    margin-left:calc((100vw - 17px - 1200px)/2);
    padding:68px 0 0 0}
}
@media screen and (max-width:1199px){
.recruit_inner {
    margin-left:10%;}
.vision_inner {
    margin-right:0}
.service .container.flex {
    display:block;}
.service_content a.svc {
    flex: 0 0 31.5%;}
.service__head {
    width: 100%;}

.recruit_banner_area a {
	background-size: 122% auto;
    background-position: 60% 84%;}



}
.vision_inner .banner__title {
    font-size:70px;
    font-family: "Inter",sans-serif;
    font-weight:100;
    color:#ffffff;
    line-height:1;
    opacity: 80%;
    margin:0 0 73px 0;
}
.vision_inner h3 {
    font-weight: bold;
    font-size:20px;
    color:#ffffff;
    margin-bottom:16px;
}
.recruit_inner h3 {
    font-weight: bold;
    font-size:20px;
    color:#ffffff;
    margin-bottom:16px;
}
    .banner__desc {
    color:#ffffff;}

.arrow_circle {
    background-color:#ffffff;
    width:60px;
    height:60px;
    border-radius:200px;
    padding:22px 0 0 22px;
    display:block;
    position:absolute;
    right:0;
    bottom:25px;
}

.recruit_inner .arrow_circle {
    right:25px;
}

.recruit_inner .banner__title {
    font-size: 70px;
    font-family: "Inter", sans-serif;
    font-weight: 100;
    color: #ffffff;
    line-height: 1;
    opacity: 80%;
    margin: 0 0 60px 0;}

/* ===== FAQ + Contact ===== */

.faq_area {
    margin-top:inherit;
    margin:80px 0;
}
.faq__inner {
    position:relative;
}

.faq_en {
    font-size: 145px;
    font-family: "Inter", sans-serif;
    font-weight: 100;
    color: #ffffff;
    position: absolute;
    top: 16%;
    left: 24%;
    z-index: -1;
    line-height: 0.8;
    opacity: 0.8;
}

.grid-2{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  align-items:stretch;
}
.faq{
  display:grid;
  grid-template-columns:1fr;
}
.faq__inner{
  padding:165px 20px 20px 80px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.faq__title{
  margin:0;
  font-size:35px;
  letter-spacing:.02em;
}
.faq__desc{
  margin:0;
  color:var(--muted);
  line-height:1.9;
  font-size:14px;
}
.faq__btn{
  margin-top:20px;
  align-self:flex-start;
}
.faq__btn .btn{
    background: var(--brand);
    color: #fff;
    border-color: transparent;
    width: 300px;
    height: 50px;
    display: block;
    max-width: inherit;
    border-radius: 30px;
    font-size: 20px;
    padding: 10px 20px 0 0;
    text-align: center;
    position:relative;
}

.faq__btn .btn:after{
    content:"";
    background-image:url("../img/arrow_on.png");
    background-size:100% 100%;
    width:17px;
    height:15px;
    display:block;
    position:absolute;
    right:20px;
    top:18px;
}

.person{
  border-radius:0 28px 28px 0;
  overflow:hidden;
  box-shadow:var(--shadow);
  background:url("../img/faq_pic.jpg") right / auto 100% no-repeat;
  min-height:492px;
}

.cta{
    margin-top:20px;
    border-radius:35px 35px 0 0;
    background:url("../img/foot_back.jpg") no-repeat;
    background-size: 140%;
    background-position: 53% 70%;
    color:#fff;
    position:relative;
    height:490px;
    margin-bottom:-55px;
    z-index:0;
}
.cta__inner{
    padding:100px 0px 0 0;
    display:flex;
    flex-direction:column;
    gap:12px;
    text-align:center;
    max-width:900px;
    margin:0 auto;
    height:100%;
    position:relative;
}
.contact_en {
    font-size: 145px;
    font-family: "Inter", sans-serif;
    font-weight: 100;
    color: #d4edf4;
    position: absolute;
    top: 13%;
    left: 0;
    right:0;
    text-align:center;
    z-index: -1;
    line-height: 0.8;
    opacity: 0.3;
}
.cta__inner a:hover {
    opacity: 80%;
    transition:0.3s;
}
.contact_txt {
    font-size:18px;
    margin-bottom:75px;
    font-weight: 600;
}
.cta__title{
  margin:0 0 48px 0;
  font-size:35px;
  font-weight:600;
  letter-spacing:.02em;
  text-shadow:0 12px 26px rgba(0,0,0,.35);
}
.cta__actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.btn--ghost{
  background:rgba(255,255,255,.95);
  color:#111827;
  border-color:transparent;
}

.foot_contact_btn {
    background-color:var(--brand);
    width:420px;
    height:70px;
    border-radius:40px;
    color:#ffffff;
    font-size:22px;
    text-align:center;
    font-weight:600;
    padding:17px 0 0 0px;
    position:relative;
}

.foot_contact_btn:after {
    content:"";
    width:17px;
    height:15px;
    display:block;
    position:absolute;
    right:30px;
    top:40%;
    background-image:url("../img/arrow_on.png");
    transition:0.3s;
}

.foot_recruit_btn {
    background-color:#ffffff;
    width:420px;
    height:70px;
    border-radius:40px;
    color:var(--muted);
    font-size:22px;
    text-align:center;
    font-weight:600;
    padding:17px 0 0 0px;
    position:relative;
}

.foot_recruit_btn:after {
    content:"";
    width:17px;
    height:15px;
    display:block;
    position:absolute;
    right:30px;
    top:40%;
    background-image:url("../img/arrow_off.png");
    transition:0.3s;
}

/* ===== Footer ===== */
.footer{
    margin-top:26px;
    background:rgb(255,255,255);
    border-top:1px solid var(--line);
    border-radius:35px 35px 0 0;
    position:relative;
    z-index:9;
    height: 380px;
}
.footer__inner{
  padding:70px 0 0 0;
  display:grid;
  grid-template-columns:1fr 1.7fr;
  gap:18px;
  align-items:start;
}
/* 3列版 */
.footer__inner{
  grid-template-columns:1fr 1.5fr .5fr;
}

.footer__brand{
  display:flex; flex-direction:column; gap:8px;
}
.footer__brand .brand{
  font-size:14px;
}
.footer__brand .brand a:hover{
	opacity: .75;
	transition: .3s;
}
.footer__small{
  color:var(--muted);
  font-size:16px;
  line-height:1.8;
    margin-top:20px;
}
.footer__links{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    margin-top:10px;
    gap:10px 16px;
    font-size:16px;
    color:#111827;
}
/* 3列版 */
.footer__links{
    font-size:15px;
}
.link_yueki {
    position: relative;
    left: -50px;
}
.link_yueki img {
    box-shadow: 0px 2px 1px 2px #e9e9e9;
    border-radius: 10px;
}
.link_yueki img:hover {
	opacity:.85;
}

.footer__links a{ opacity:.85; }
.footer__links a:hover{ opacity:1; text-decoration:underline; }
.copyright{
    position:absolute;
    bottom:40px;
    left:0;
    right:0;
    text-align:center;
    color:var(--muted);
    font-size:14px;
}
.new_window:after {
    position:relative;
    display:inline-block;
    margin-left:1em;
    vertical-align:-2px;
    content:"";
    background-image:url("../img/new_window.png");
    width:16px;
    height:16px;
    background-size:100% 100%;
}

/* ===== Responsive ===== */
@media screen and (min-width:1200px){
.link_yueki img {
    width: 75%;
	}
}
@media screen and (max-width:1299px){

.recruit_inner {
	margin-left: 7%;
    padding: 7% 0 0 0;}


}

@media screen and (min-width:1220px){
	.fortb {display:none;}
}

@media screen and (max-width:1199px){
.company_en,
.service_en,
.faq_en,
.contact_en {
    font-size:14vw!important;
    left:0!important;
    right:0!important;
    text-align:center;}

.hero__copy p {
    font-size: 32px;}

.header__cta {
	width:20%;}
header a.brand {
	width:max(22%,200px);}
header nav.nav {
	width:54%;
	margin-left:3%;}

.nav {
    display: grid;
    grid-template-columns: 1.3fr 1.3fr 1fr 1fr;}

.nav a {
    padding: 18px 0px 0 0;
    font-size: 1.8vw;}

}

@media (max-width: 1250px){
.footer__inner {
    padding: 50px 0 0 0;
	grid-template-columns: 0.9fr 2fr .35fr;
    gap: 25px;
	}
.footer__links {
    font-size: 14px;
	}
.link_yueki {
    left: -60px;
	}
}
@media (max-width: 960px){
.hero__inner{ grid-template-columns:1fr; align-items:center; }
.hero__copy{ justify-self:start; max-width:610px; }
.hero__logo{ font-size:46px; }
.two-col{ grid-template-columns:1fr;}
.cards{ grid-template-columns:1fr; }
.section__grid{ grid-template-columns:1fr; }
.grid-2{ grid-template-columns:1fr; }
.hikari {font-size:15vw;}
.hero__copy {
	left: inherit;
    right: 2%;}
.hero__copy p {
    font-size: 3.8vw;}
.service_content {
    gap: 20px;
    display: grid;
    grid-template-columns: 1fr;}
.footer__links {
    grid-template-columns: 1fr 1fr;}
.footer__inner {
    gap: 40px;
	grid-template-columns: 1fr 1fr;}
.cta__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-content: center;
    gap: 20px;}
.foot_contact_btn,
.foot_recruit_btn {
    width: 100%;
	font-size:18px;
	padding:21px 0 0 0;}
/* 3列版 */
.footer__inner {
    grid-template-columns: 1fr 1.7fr .4fr;
	}
}

@media (min-width: 769px){
	.forsp {display:none;}
}

@media (max-width: 768px){
.title{
	font-size:14px;
	}
.badge {
    font-size: 12px;
	}
.gnav {display:none;}
.nav{ display:none; }
.header__cta{ display:none; }
.hamburger{ display:flex; }
.hero{ min-height:480px; }
.hero__logo{ font-size:40px; }
.banner__title{ font-size:36px; }

.hero {
    max-height: 700px;}

.vision_banner_area a,
.recruit_banner_area a {
    width: 94%;
	margin-right:auto;
	margin-left:auto;
	border-radius:20px;}

.svc__img {
    height: 260px;}
.service {
    padding: 75px 0 100px 0;}

.service {
	padding: 40px 0 30px 0;
	margin-top: 40px;
	border-radius: 20px;}

.service__head p.service_en {
    top: 2%;}

.vision_banner_area {
    margin: 50px 0 30px 0;}

.company_info {
    padding: 5px 0;}
.cards {
    margin: 40px 0;
    padding: 35px 0;}

.person {
    border-radius: 0px 0px 0px 0;
    background: url("../img/faq_pic.jpg") right 30% / auto 140% no-repeat;
    min-height: 250px;}

.faq__inner {
    padding: 55px 20px 0px 20px;
    text-align: center;}

.faq__btn {
    margin: 20px auto 0 auto;}

.faq_area {
    margin: 60px 0 0 0;}

.cta {
	margin-top: 50px;
	background: url("../img/foot_back_sp.jpg") no-repeat;
	background-size: 135%;
	background-position: 50% 97%;
	height: auto;}

.cta__inner {
    padding: 60px 10% 13% 10%;}

.cta__title {
    margin: 0 0 10px 0;
    line-height: 1.2;
	font-size:23px;}

.contact_txt {
    margin-bottom: 20px;
	font-size:18px;}

.recruit_banner_area a {
    background-size: 190%;
    background-position: 50% 90%;}

.recruit_inner {
    margin-left: 0;
    padding: 7% 5% 0 5%;}

.recruit_inner .banner__title {
    margin: 0 0 50px 0;}

.vision_inner .banner__title {
    margin: 0 0 50px 0;}

.footer {
    height: auto;}

.copyright {
    position: relative;
    display: block;
    margin: 30px 0 0px 0;
    background-color: #ed3336;
    padding: 10px 0;
    bottom:inherit;
    left:inherit;
    right:inherit;
    text-align: center;
    color: #ffffff;
    font-size: 14px;}

.footer__links {
    grid-template-columns: 1fr 1fr;}

.cta__actions {
    justify-content: center;
    grid-template-columns: 1fr;}

.footer__links {
    grid-template-columns: 1fr 1fr;}

.footer__inner {
	grid-template-columns: 1fr;}

.hero__copy p {
    font-size: 6vw;
    text-align: center;
    color: #ffffff;
    text-shadow: 0 0 7px rgb(0, 0, 0, 0.3);}
.hero__copy {
    bottom: 40%;
    left: 0;
    right: 0;
    margin: auto;}

.vision_inner {
	}
/* 3列版 */
.footer__inner {
    grid-template-columns: 1fr 1.7fr .4fr;
	}
.link_yueki {
    left: -40px;
	}
}
@media (max-width: 767px){
.panel__title {
    font-size: 20px;
	}
.panel__title span{
	display: block;
	font-size: 13px;
	margin-left: 0;
	}
.list__item a{
    height:auto;
    min-height:90px;
    align-items:flex-start;
    padding: 20px 15px 15px;
	}
.meta{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-start;
    gap:0 10px;
	}
.meta .title{
    width:100%;
    margin-top:2px;
    word-break: break-word;
    overflow-wrap: break-word;
	}
.badge {
    padding: 4px 10px 5px;
    position: relative;
    top: -3px;
	}
.card__label {
    padding: 121px 18px 0px 25px;
    font-size: 19px;
	}
.menu {
    font-size: 20px;
	}
.vision_inner {
    padding: 6% 1% 0 3%;
	}
.banner__desc {
    font-weight: 500;
	}
.recruit_inner {
    padding: 7% 2% 0px 2%;
	}
.cta__title {
    line-height: 1.35;
    font-size: 20px;
	}
.contact_txt {
    font-size: 16px;
    font-weight: 500;
	}
/* 3列版 */
.footer__inner {
    grid-template-columns: 1fr;
	}
.link_yueki {
    top: -20px;
    left: 0;
    width: 120px;
    height: auto;
    margin-bottom: -15px;
	}
.copyright {
    font-size: 10.5px;
	}
}
@media (max-width: 400px){
.footer__links {
    font-size: 13.25px;
	}
}

/* ===== Mobile drawer (simple) ===== */
.drawer{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.45);
  display:none;
  z-index:80;
}
.drawer.is-open{ display:block; }
.drawer__panel{
  position:absolute;
  top:0; right:0;
  width:min(360px, 88vw);
  height:100%;
  background:#fff;
  box-shadow: -24px 0 60px rgba(15,23,42,.22);
  padding:0 16px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.drawer__top{
  display:flex;
    height:65px;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding-bottom:8px;
}
.drawer__top .brand{
    display:none;}

.drawer__nav{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:10px 0;
}
.drawer__nav a{
  padding:10px 10px;
  border-bottom:1px solid #b7b7b7;
  font-weight:700;
  color:#111827;
}
.drawer__actions a.btn--primary {
    max-width:inherit;
    width:100%;
    background-color:red;
    margin-bottom:10px;
}

.drawer__nav a:hover{ background:rgba(0,0,0,.04); }
.drawer__actions{
  margin-top:auto;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.drawer__panel .brand span {
    fnot-size:30px;
}

.has-tip {
  position: relative;
  cursor: pointer;
}

.has-tip::after {
  content: attr(data-tip);
  position: absolute;
  bottom: 120%;
  left: 50%;
  transform: translateX(-50%);
  
  background: #333;
  color: #fff;
  padding: 6px 10px;
  border-radius: 5px;
  font-size: 12px;
  
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
}

.has-tip:hover::after {
  opacity: 1;
}
