@charset "UTF-8";
/* =========================================================
  共通パーツ
========================================================= */
/* セクション */
section { position: relative; width: 100%; }
section .inner { max-width: 1240px; padding: 0 20px; margin: 0 auto; overflow: hidden; }
@media only screen and (max-width: 1279px) {
  section .inner { max-width: 100%; }
}
@media only screen and (max-width: 767px){
  section .inner { max-width: 100%; padding: 0 5.33vw;}
}
/* 背景 */
.bg_black{background: url(../../assets/img/home/bg.jpg); background-size: 100%; background-position: center; background-repeat: repeat; color:#FFF;}
.bg_white{background-color:#fff;color: #000;}
/* 見出しタイトル */
h3 .en{font-size: 16px; font-weight: 500; border-bottom: 1px solid #DC0616;display: table;margin: 0 auto;}
.bg_black h3 .en{color:#3381FF;}
.bg_white h3 .en{color:#003391;}
h3 .ja{font-size: 40px; font-weight: 600; line-height: 1.5; margin:auto;text-align: center; display: block; margin: 10px auto 0;}
/* キャッチフレーズ */
.catch_text{font-size: 18px; text-align: center; margin: 30px auto 0;}
.catch_text.large{font-size: 20px;margin: 0 auto 0; line-height: 2;}
@media only screen and (max-width: 767px){
  .bg_black{background: url(../../assets/img/home/bg.jpg); background-size: 300%; background-position: center; background-repeat: repeat; color:#FFF;}
  h3 .en{font-size: 3.2vw; }
  h3 .ja{font-size: 5.33vw; margin: 5.33vw auto 0;}
  /* キャッチフレーズ */
  .catch_text{font-size: 3.73vw; text-align: justify; margin: 5.33vw auto 0;line-height: 1.8;}
  .catch_text.large{font-size: 3.73vw;margin: 0 auto 0;}  
}

/* =========================================================
  コンテンツ
========================================================= */
#message{margin: 90px auto 0;padding:15px 0 30px; text-align: center;font-size: 16px;color: #fff;background-color: #000;}
#kv{aspect-ratio: 1440 / 570; background-image: url(../../assets/img/home/kv.jpg); background-size: 100%; position: relative;background-repeat: no-repeat; }
#kv .inner{display: flex; flex-direction: column;}
#kv h2{position:absolute; line-height: 1; font-size: 60px;font-size:clamp(30px, 5vw, 60px); text-align:center;font-weight:600; color:#fff; text-shadow:0 2px 6px rgba(0,0,0,.35);transform:translate(-50%); left: 50%;bottom: 4vw; width:100%;}
#kv h2 span{display: block; font-size: 32px;font-size:clamp(16px, 2.5vw, 32px); margin-bottom: 20px;}
@media only screen and (max-width: 767px){
  #message{ margin: 60px auto 0; padding: 2.4vw 0 0; font-size: 3.2vw; text-align: center;}
  #message .inner{ width: calc(100% - 10.667vw);  border-bottom: 1px solid #888888;}
  #message .inner p{margin-bottom: 2vw;;}
  #kv{aspect-ratio: 375 / 572; background-image: url(../../assets/img/home/kv_sp.jpg); background-size: cover;}
  #kv .inner{display: block;}
  #kv h2{position:inherit; font-size: 5.87vw; text-align:center;transform:none; left: none; width:100%;max-width: 100%;}
  #kv h2 span{ font-size: 4.8vw;line-height: 1; margin: 4vw 0 2vw 0;}
}

#concept{margin:0 auto;background-image: url(../../assets/img/home/intro_bg.jpg); background-size: cover; background-position:top center; background-repeat: no-repeat;}
#concept .inner{padding: 14.583% 0 150px;}
#concept .catch_text.large{font-size: 20px;margin: 0 auto 0; line-height: 2.5;}
@media only screen and (max-width: 767px){
  #concept{margin:0 auto;background-image: url(../../assets/img/home/intro_bg_sp.jpg); background-size: cover; background-position:top center; background-repeat: no-repeat;}
  #concept .inner{padding: 0;}
  #concept .catch_text.large{font-size: 3.733vw; line-height: 2;text-align: justify;padding: 21.333vw 14.5vw 0;}
}

#experience{margin: 0 auto;}
#service{padding: 0 0 150px;margin: 150px auto 0;}
@media only screen and (max-width: 767px){
  #service{padding: 0 0 16vw;margin: 16vw auto 0;}
}


#fourstrengths{margin: 0 auto; padding: 150px 0 0;}
/* ベース */
.content-list{list-style:none;margin:0 auto;padding:0;width:min(100% - 32px, var(--max));}
/* 各ブロック（PCは番号画像 + 本文の2カラム） */
.content-item{display:grid;grid-template-columns: 210px 1fr;align-items:start;padding: 40px 0;position:relative;}
/* 区切り線（1個目以降） */
.content-item + .content-item{border-top:1px solid #DDDDDD;}
/* 番号画像（左） */
.content-item > picture img{max-width:100%; height:auto; display:block}
/* 本文（右） */
.content-item h4{margin:0 0 40px;color:#003391;font-size: 40px;line-height:1.45;font-weight:600;}
/* 1つ目：証書画像 + 情報ボックス */
.content-item .flex_box{flex-wrap: nowrap;display:flex;align-items:flex-start;gap: 20px;}
.content-item:nth-child(1) .flex_box{gap: 30px;}
/* 1つ目 左の証書：やや大きめ */
.content-item:nth-child(1) .flex_box > img{flex: 0 1 320px;max-width: 283px;width: 100%;}
/* 1つ目 右の数値群（画像 + small注釈） */
.content-item:nth-child(1) .flex_box .flex_box_inner{flex: 1 1 420px;min-width: 320px;}
.content-item:nth-child(1) .flex_box .flex_box_inner picture img{width:100%; height:auto; display:block;max-width: 553px;}
.content-item:nth-child(1) .flex_box .flex_box_inner small{display:block;margin-top:30px;font-size:12px;line-height:1.5;}
/* 2つ目：画像2枚 + 説明テキスト */
.content-item:nth-child(2) .flex_box > img{flex: 1 1 280px;max-width:280px;width:100%;}
.content-item:nth-child(2) .flex_box p{flex: 1 1 360px;max-width: 360px;margin:0;text-align: justify;}
/* 3つ目：大きな画像1枚 */
.content-item:nth-child(3) .content-body img{max-width: 100%; width: 915px;}
/* 4つ目：サムネ5枚のグリッド */
.thumb-list{list-style:none;padding: 10px 0 0;margin:0;display:grid;grid-template-columns: repeat(5, minmax(0,1fr));gap:16px;}
.thumb{ text-align:center }
.thumb img{width:100%; height:auto; display:block;border-radius:5px;border:1px solid #DDDDDD;}
.thumb .label{font-size:14px;text-align: left; margin: 5px 0 0;}
/* 画像共通のなめらかさ */
.content-item img{image-rendering:auto}
@media only screen and (max-width: 1279px) {
  .content-item{gap: 10px;}
  .content-item:nth-child(2) .flex_box > img{max-width: calc(50% - 10px);}
  .content-item:nth-child(2) .flex_box{flex-wrap: wrap;}
  .content-item:nth-child(2) .flex_box p{width: 100%;max-width: 100%;}
}
@media only screen and (max-width: 900px) {
  .content-item:nth-child(1) .flex_box{flex-wrap: wrap;}
  .content-item:nth-child(1) .flex_box .flex_box_inner picture img{max-width: 100%;}
  .content-item:nth-child(1) .flex_box > img{flex: 0 1 100%;max-width: 80%;width: 80%; margin: auto;}
  .thumb-list{grid-template-columns: repeat(3, minmax(0,1fr));gap:16px;}
}
@media (max-width: 767px){
  #fourstrengths{margin: 0 auto; padding: 16vw 0 0;}
  .content-list{margin: 5.333vw auto 0;}
  .content-item{grid-template-columns: 1fr;gap: 0;padding: 8vw 0;}
  .content-item h4{font-size: 5.87vw;margin:5.67vw auto 5.33vw;}
  .content-item > picture{order: 0;width: 100%;}
  .content-item .content-body img{width:100%;}
  .content-item .number{margin-left: auto;}
  .content-item:nth-child(1) .number{width: 36.27vw;}
  .content-item:nth-child(2) .number{width: 38.09vw;}
  .content-item:nth-child(3) .number{width: 38.13vw;}
  .content-item:nth-child(4) .number{width: 38.43vw;}
  .content-item:nth-child(1) {padding: 0 0 8vw 0;}
  .content-item:nth-child(1) .flex_box{gap:5.33vw;flex-wrap: wrap;}
  .content-item:nth-child(1) .flex_box > img,.content-item:nth-child(1) .flex_box .flex_box_inner{flex-basis: 100%;width: 100%;max-width: 100%;}
  .content-item:nth-child(1) .flex_box .flex_box_inner small { margin-top: 4vw; font-size: 2.67vw;}
  .content-item:nth-child(2) .flex_box{display:grid;grid-template-columns: 1fr 1fr;gap:1.333vw;}
  .content-item:nth-child(2) .flex_box p{text-align: justify; grid-column: 1 / -1;margin-top:0.53vw; max-width: 100%;margin:2.66vw 0 0;font-size: 3.73vw;line-height: 1.7;;}
  .content-item:nth-child(2) .flex_box > img{flex: 1 1 280px;max-width:100%;width:100%;}
  .content-item:nth-child(4) {padding: 8vw 0 0 0;}
  .thumb-list{ grid-template-columns: repeat(3, 1fr); gap:2vw;padding: 0 0 0;}
  .thumb .label { font-size: 3.2vw; margin: 0 0 0; }
}

#awards{margin: 150px auto 0; padding:0;} 
#awards .container{margin: 60px auto 0; display: flex;justify-content: space-between; align-items: flex-start;}
#awards ul{margin: 0 auto;}
#awards ul li{display: flex;border-bottom: 1px solid #DDDDDD; padding: 20px 0;}
#awards ul li .year{display: block;width: 85px;}
#awards ul li p{width: calc(100% - 85px);}
#awards ul li:first-child{ padding: 0 0 20px;}
#awards ul li:last-child{border-bottom: none; padding: 20px 0 0;}
#awards figure{margin: 0 0 0 20px;}
#awards figcaption{font-size: 12px;}

@media only screen and (max-width: 767px){
  #awards{margin: 16vw auto 0; padding:0;} 
  #awards .container{margin: 10.67vw auto 0; display: block;}
  #awards ul{width:100%;}
  #awards ul li{ padding: 4vw 0; text-align: left;font-size: 3.733vw;line-height: 1.8;}
  #awards ul li .year{width:18.667vw;}
  #awards ul li p{width: calc(100% - 18.667vw);}
  #awards ul li:first-child{ padding: 0 0 4vw;}
  #awards ul li:last-child{ padding: 4vw 0 0;}
  #awards figure{margin: 7vw auto 0;}
  #awards figcaption{font-size: 3.2vw;}
  #awards img{width: 100%;}
}

.bg_black .contact_btn a{border: 1px solid #FFF;color: #FFF;}
.bg_black .contact_btn .arrow{background: url(../../assets/img/common/arrow_white.svg) center center / 100% no-repeat;}
.bg_black #concept .contact_btn {padding:60px 0 0 ;}
.bg_black #experience .contact_btn {padding:70px 0 0 ;}
.bg_black #service .contact_btn {padding:80px 0 0 ;}
.bg_white #fourstrengths .contact_btn {padding:30px 0 0;}
.bg_white .contact_btn.last {padding:70px 0 150px 0;}
@media only screen and (max-width: 767px){
  .bg_black .contact_btn a:hover{background:transparent;}
  .bg_black .contact_btn a:hover .arrow{transform:none;}
  .bg_black .contact_btn a:hover .arrow{background: url(../../assets/img/common/arrow_white.svg) center center / 100% no-repeat;}
  .bg_white .contact_btn a ,
  .bg_black .contact_btn a{width: 100%;}
  .bg_black #concept .contact_btn {padding:16vw 5.33vw;}
  .bg_black #experience .contact_btn {padding:16vw 0 0 ;}  
  .bg_black #service .contact_btn{padding:16vw 0 0;}
  .bg_white #fourstrengths .contact_btn {padding:16vw 0 0;}
  .bg_white .contact_btn.last {padding:16vw 5.33vw;}  
}