:root {
  --key-blue: #0077b1;
  --key-grn:#008f72;
  --key-pink:#ee3b5d;
  --key-navy: #00195f;
  --bg-light: #f6f8fa;
  --bg-light02:#f4f9fd;
  --bg-light-blue:#d9edf5;
  --max-width: 1280px;
  --xxl-font:48px;
  --xxl-font-jp:42px;
  --m-font:21px;
  --s-font:16px;
}

* {
  box-sizing: border-box;
}
img{width:auto; max-width:100%;}

body {
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1.7;
  color: #222;
}

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Oswald:wght@600&display=swap');

main{width:100%; margin:0 auto;}
.text-ctr{text-align:center;}
.center{justify-content: center;}


.mt10{margin-top:10px;}
.mt20{margin-top:20px;}
.mt30{margin-top:30px;}
.mt40{margin-top:40px;}
.mt50{margin-top:50px;}

.mb10{margin-bottom:10px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:40px;}
.mb50{margin-bottom:50px;}

/* ---------- background ---------- */
.grd{background-image: linear-gradient( 141deg, rgb(0,150,95) 0%, rgb(0,100,180) 50%, rgb(0,149,84) 100%);}
.pale__bg{background: var(--bg-light);}
.pale__bg02{background: var(--bg-light02);}
.pale__blue__bg{background: var(--bg-light-blue);}

/* ---------- column ---------- */
section.column{width:100%;}
section .section-in{padding:4vw 50px; max-width:var(--max-width); margin:0 auto}
section.service .section-in{padding:2vw 50px;}
section.no-space .section-in{padding:0 0 30px; display:flex; justify-content: center;}

/* ---------- btn ---------- */
.btn__block{
  display:flex;
  column-gap: 40px;
  margin-top: 40px;
  margin-inline: auto;
  width: 100%;
  max-width: 100%;
  row-gap: 32px;
}
.btn__block a{border-radius:30px; text-decoration:none; padding:10px 40px; text-align:center; font-weight:700; position:relative; font-size:18px;}
.btn__block a.type01{color:var(--key-blue); border:solid 2px var(--key-blue); background:#fff; width:400px;}
.btn__block a.type01:after{content:""; display:block; width:8px; height:13px; background-image:url(../images/common/arrow_blue.png); background-repeat:no-repeat; background-size:8px 13px; position:absolute; top:calc(50% - 6px); right:24px;}
.btn__block a.type01.small{width:300px}
.btn__block a.type02{color:#fff; border:solid 2px var(--key-blue); background:var(--key-blue); width:400px;}
.btn__block a.type02.free{width:fit-content; padding:10px 60px;}
.btn__block a.type02:after{content:""; display:block; width:8px; height:13px; background-image:url(../images/common/arrow.png); background-repeat:no-repeat; background-size:8px 13px; position:absolute; top:calc(50% - 6px); right:24px;}
.btn__block a.type03{border-radius:48px; color:#fff; border:solid 2px var(--key-pink); background:var(--key-pink); width:560px; height:96px; display:flex; align-items: center; justify-content: center; gap:10px;}
.btn__block a.type03:before{content:""; display:inlin-block; width:21px; height:15px; background:url(../images/common/icon_mail.png) no-repeat; background-size:21px 15px; top:calc(50% - 7.5px); left:15px;}

/* ---------- header ---------- */
.header {
  position: sticky;
  top: 0;
  background:rgba(255,255,255,.8);
  z-index: 100;
  width:100%;
  
}

.header__inner {
  max-width: var(--max-width);
  margin: auto;
  padding: 0 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing:border-box;
  height: 90px;
}

.nav a {
  margin-left: 24px;
  text-decoration: none;
  color: var(--key-blue);
  font-weight: 600;
  position:relative;
}
.nav a.content-link:before{content:"|"; display:inline-block; position:absolute; top:-3px; left:-16px;}
.nav a.icon__search:before{content:""; display:inline-block; position:absolute; top:3px; left:-24px;  width:21px; height:21px; background:url(../images/common/search.png) no-repeat; background-size:21px 21px;}

.logo img{width:180px; height:auto;}

a.regist__btn{padding:8px 20px; text-decoration:none; font-weight:700; border-radius: 35px; color:var(--key-blue); background:#fff; border: solid 2px var(--key-blue); margin-left:16px}
a.inquiry__btn{padding:8px 20px 8px 48px; text-decoration:none; font-weight:700; border-radius: 35px; color: #fff; border:solid 2px var(--key-pink); background:var(--key-pink);margin-left:6px; position:relative;}
a.inquiry__btn:before{content:""; display:block; position:absolute; width:21px; height:15px; background:url(../images/common/icon_mail.png) no-repeat; background-size:21px 15px; top:calc(50% - 7.5px); left:15px;}


.lang{font-size:16px; font-weight:700; color:var(--key-blue);}
.lang button{border:none; background:none; font-size:18px; font-weight:700; color:var(--key-blue); margin:0 0.25em; padding:6px;}
.lang button.active{background:var(--key-blue); color:#fff; border-radius: 20px;}

.bookmark{width:28px; height:40px;background:url(/assets/images/common/favorite_icon_on.svg) no-repeat; background-size:28px 40px; position:relative; border:none;}
.bookmark span{font-size:13px; font-weight:700; min-width:20px; height:20px; text-align:center; color:#fff; padding:3px; border-radius:10px; position:absolute;top:-6px; right:-6px; background:#c10000; z-index:2; line-height:1;}

/* ---------- hamburger ---------- */
.hamburger {
  display: none;
  width: 32px;
  height: 24px;
  margin-left: auto;
  position: relative;
  border: none;
  background: none;
  cursor: pointer;
}

.hamburger span {
  position: absolute;
  width: 100%;
  height: 3px;
  background: #222;
  left: 0;
  transition: .3s;
}

.hamburger span:nth-child(1) { top: 0; }
.hamburger span:nth-child(2) { top: 10px; }
.hamburger span:nth-child(3) { bottom: 0; }

/* ---------- SP 表示 ---------- */
@media (max-width: 1279px) {
  .logo{flex-grow: 4;}
  .nav {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,.97);
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 32px;
    transform: translateY(-100%);
    transition: .4s;
    z-index:4;
  }
  .nav a{opacity:0;}
  .bookmark{margin-right:20px;}
  .nav.is-open {
    transform: translateY(0);
    display:block;
  }
  .nav.is-open a{opacity:1;}
  .hamburger {
    display: block;
    z-index:5;
  }
  .lang{margin-right:20px;}
}

/* ---------- PC 表示 ---------- */
@media (min-width: 1280px) {
  .nav {
    position: static;
    transform: none;
    flex-direction: row;
    background: none;
  }
}
.hamburger.is-open span:nth-child(1) {
  transform: rotate(45deg) translateY(14px);
}
.hamburger.is-open span:nth-child(2) {
  opacity: 0;
}
.hamburger.is-open span:nth-child(3) {
  transform: rotate(-45deg) translateY(-14px);
}



/* ---------- hero ---------- */
.hero {
  position: relative;
  width:100%;
  background:#dedcdd;
  display:flex;
  justify-content: center;
}

.hero img {
  width:100%;
  max-width:1500px;
}
.lead{font-size:16px; font-weight:600;}
.lead-ctr{color:var(--key-navy); text-align:center; font-weight:700; padding:0 0 20px;}



/* ---------- content-ttl ---------- */
.content-ttl{
  text-align:center;
  display:flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap:10px;
  margin-bottom:40px;
}
.content-ttl h2{
  display:inline-block;
  width:fit-content;
  margin:0;
  font-size:var(--xxl-font);
  line-height:1;
  font-weight:700;
}
.content-ttl h2.jp-title{font-size:var(--xxl-font-jp);}
.content-ttl .grd{
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.content-ttl .sub-caption{font-size:var(--s-font); color:#333; font-weight:600;  margin:0;}
.content-ttl.white h2{color:#fff;}
.content-ttl.white .sub-caption{color:#fff;}


/* ---------- page-title ---------- */
.page-title-in {width:100%; max-width:1280px; margin:0 auto; padding:15px 40px; display:flex; flex-direction: column; align-items: center;}
.page-title-in ul.bread{display:flex; justify-content: left; width:100%; gap:20px}
.page-title-in ul.bread li{font-size:13px; color:var(--key-blue)}
.page-title-in ul.bread li a{color:#333; text-decoration:none; position:relative;}
.page-title-in ul.bread li a:after{content:">"; display:inline-block; position:absolute; right:-1em}

.page-title h2{font-size:var(--xxl-font); font-weight:700; margin:30px 0;}
.page-title h2.grd{
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


/* ---------- service ---------- */
.service {
  /*background: var(--bg-light);
  padding: 40px 16px;*/
}

.service__grid {
  max-width: 100%;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin:30px 0 15px;
}

.service__item {
  background: var(--key-blue);
  color: #fff;
  padding: 20px;
  text-align: center;
  border-radius: 6px;
  font-weight: bold;
  position:relative;
}
.service__item:after{content:""; position:absolute; display:block; width:19px; height:15px; background:url(../images/common/top_btn_arrow.png) no-repeat; background-size:19px 15px; top:calc(50% - 7.5px); right:20px;}
.service__item.outer-link:after{content:""; position:absolute; display:block; width:20px; height:20px; background:url(../images/common/btn_outer_link_white.png) no-repeat;  background-size:20px 20px; top:calc(50% - 10px); right:20px;}


.service__item.type02 {
  background: var(--key-grn);
  color: #fff;
  padding: 20px;
  text-align: center;
  border-radius: 6px;
  font-weight: bold;
}

/* ---------- news ---------- */
.news__list {
  display: flex;
  flex-wrap: wrap;
  gap: 50px;
  margin:40px 0;
}
.news__list article{width:360px}


.news__card {
  border-radius: 8px;
}
.news__card a{text-decoration:none; transition:all .4s;}
.news__card a:hover{opacity:.75;}
.news__card a p{color:#333; display:flex; flex-direction: column; gap:10px; width:100%;}
.news__card a p span{display:block; width:fit-content;}
.news__card a p .tags{background:var(--key-grn); color:#fff; font-size:12px; padding:4px 6px; border-radius:4px;}
.news__card a p .date{color:var(--key-blue); font-size:15px; font-weight:600;}

.news__photo{width:360px; height:200px; overflow:hidden; background:#fff; margin-bottom:20px; text-align:center;}
.news__photo img{max-width:100%; height:200px; object-fit: cover;}

.other__news__list{display:flex; flex-wrap: wrap; justify-content: space-between; width:100%;}
.other__news__list dt{width:7em; font-size:15px; color:var(--key-blue); font-weight:700; padding:15px 0;}
.other__news__list dd{width:calc(100% - 7em); margin:0; font-size:15px; padding:15px 0;}

@media (max-width: 1279px) {
  .news__list article{width:calc((100% - 50px * 2) / 3);}
  .news__photo{width:100%; height:calc((33vw * 2) / 3 *  6 / 9); overflow:hidden; background:#fff; margin-bottom:20px; text-align:center;}
  .news__photo img{max-width:100%; height:calc((33vw * 2) / 3 * 6 / 9); object-fit: cover;}
}


.three_column{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap:40px;
}
.three_column div{
  flex-basis: calc((100% - 40px * 2) / 3);
  width: calc((100% - 40px * 2) / 3);
}
.three_column a{text-decoration:none;}
.three_column a p{color:#333;}
.three_column a p .date{color:var(--key-blue); font-size:15px; font-weight:600; display:block;}
.three_column img{width:auto; max-width:100%;}


/* ---------- models ---------- */
.models {
  /*padding: 60px 0;*/
}

.model__card {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
}

.model__card img {
  width: 100%;
  display: block;
}

.swiper-wrap{position:relative; padding-bottom:50px;}
.swiper-area{position:relative;}

.swiper-area .swiper-button-next,
.swiper-area .swiper-button-prev{width:60px !important; height:60px !important; background:#fff;border-radius:30px; padding:10px; border:solid 4px var(--key-blue); transition: cubic-bezier(0.075, 0.82, 0.165, 1);}
.swiper-area .swiper-button-prev:after{content:""; width:14px; height:20px; background:url(../images/common/swiper-arrow-left.png) no-repeat; background-size:14px 20px;}
.swiper-area .swiper-button-next:after{content:""; width:14px; height:20px; background:url(../images/common/swiper-arrow-right.png) no-repeat; background-size:14px 20px;}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{opacity:0 !important;}

.swiper-area .swiper-button-prev{left:-30px !important;}
.swiper-area .swiper-button-next{right:-30px !important;}

/* ---------- faq ---------- */
.faq__list{width:90%; max-width:840px; margin:0 auto;}
.faq__list dl{display:flex; gap:40px; flex-direction: column;}
.faq__list dt{display:flex; gap:20px; position:relative; align-items: center; font-weight:700; }
.faq__list dt p{width:calc(100% - 80px)}
.faq__list dt:before{content:"Q"; display:block; width:60px; height:60px; background:var(--key-blue); color:#fff; font-size:36px; font-weight:700; display:inline-flex; justify-content: center; font-family:Arial, Helvetica, sans-serif}
.faq__list dd{display:flex; gap:20px; position:relative; align-items: center; font-weight:500; }
.faq__list dd p{width:calc(100% - 80px)}
.faq__list dd:before{content:"A"; display:block; width:60px; height:60px; background:#fff; color:var(--key-grn); font-size:36px; font-weight:700; display:inline-flex; justify-content: center; font-family:Arial, Helvetica, sans-serif}

/* ---------- inquiry ---------- */
.inquiry__column{display:flex; justify-content: center; flex-wrap: wrap; gap:60px;}
.inquiry__column .txt_block{width:calc(40% - 30px); display:flex; gap:20px; flex-direction: column;}
.inquiry__column .txt_block h3{color:#fff; font-size:28px; font-weight:700;}
.inquiry__column .txt_block h3 b{display:inline-block;}
.inquiry__column .txt_block p{color:#fff; font-size:15px;}
.inquiry__column .btn_block{width:calc(60% - 30px);}
.inquiry__column .btn_list{display:flex; flex-wrap: wrap; gap:30px; justify-content: center; margin-bottom:40px}
.inquiry__column .btn_list li{width:calc(50% - 15px);}
.inquiry__column .btn_list a{background:#fff; padding:10px 20px; border-radius: 60px; display:flex; flex-direction: column; align-items: center; text-decoration:none;}

.inquiry__column .btn_list a b{font-size:20px; font-weight:700; position:relative; color:var(--key-blue)}
.inquiry__column .btn_list a span{font-size:13px; color:#333;}
.inquiry__column .btn_block p{text-align:center; color:#fff;}

/* ---------- flow ---------- */
.casting_flow{margin:50px 0;}
.casting_flow_item{border:solid 2px var(--key-blue); border-radius:20px; display:flex; flex-direction: column; justify-content: center; overflow: hidden; background:#fff;}
.casting_flow_item h3{background:var(--key-blue); color:#fff; text-align:center; padding:10px; font-weight:700; font-size:24px;}
.casting_flow_item div{padding:20px; width:100%; display:flex; flex-direction: column; justify-content: center;  align-items: center; gap:10px;}
.casting_flow_item div h4{color:#002972; font-size:18px; font-weight:700;}
.casting_flow_item div p{font-size:15px;}
.casting_flow_item div img{width:75%;}

.sns_list{display:flex; flex-wrap: wrap; gap:15px; justify-content: center; margin:50px 0 30px;}
.sns_list li{width:84px;}
.sns_list li img{width:auto; max-width:100%;}

/* ---------- footer ---------- */
.footer {
  padding: 40px;
  text-align: center;
  color: #fff;
}

/* ---------- SP ---------- */
@media (max-width: 768px) {
  .service__grid,
  .news__list {
    grid-template-columns: 1fr;
  }

  .flow__steps {
    flex-direction: column;
  }

  .nav a {
    margin-left: 8px;
    font-size: 14px;
  }
}