@charset "utf-8";

/*メディアクエリー
min-width:768px*/

body { font-family: "dnp-shuei-anti-std", sans-serif;font-weight: 400;font-style: normal;letter-spacing:0.05em; overflow-x: hidden;}


/*PCスマホ表示切り替え用*/
.br_pc {display: none !important;}
.pc {display: none;}
.sp {display: block;}
.inline_sp { display:inline; }
.inline_pc { display:none; }
@media screen and (min-width: 768px) {
    .sp {display: none !important;}
    .pc {display: block;}
    .br_sp {display: none !important;}
    .br_pc {display: inline !important;}
    .inline_sp { display:none; }
    .inline_pc { display:inline; }
}


/*共通*/
.contents_wrap { width:100%; padding-bottom:100px; }
.contents { width:90%; margin:0 auto; }
@media screen and (min-width: 768px) {
  .contents_wrap { padding-bottom:100px;}
  .contents { width:90%; }
}
@media screen and (min-width:1281px) {
  .contents { width:1080px;  }
}




/*フォント*/
.gothic { font-family:"Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN","メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;font-weight: 400; }
.oswald { font-family:"Oswald", sans-serif;font-optical-sizing: auto;font-weight:800;font-style: normal;}
p,strong { display:inline-block; }
.bold { font-weight:bold; }
.contents p { text-align: justify;}
@media screen and (max-width: 768px) {
  p { line-height:1.7em; }
}
p { line-height:2em; letter-spacing:0.05;}

/*フォント_色*/
.color_w { color:#fff; }
.color_b { color:#000; }
.color_red { color:#B3212B; }

.back_gray { background:#F5F5F5; }

.text_center { width:100%; text-align:center; display:inline-block; }
.text_left { width:100%; text-align:left; display:inline-block; }

/*フォント_見出し*/
.headline-xl {font-size:32px;} /*大見出し*/
.headline-lg {font-size:24px;} /*中見出し*/
.headline-md { font-size:18px;} /*小見出し*/ 
@media screen and (min-width: 768px) {
  .headline-xl {font-size:55px;} /*大見出し*/
  .headline-lg {font-size:40px;} /*中見出し*/
  .headline-md { font-size:18px;} /*小見出し*/ 
}
@media screen and (min-width:1024px) {
  .headline-xl {font-size:60px;} /*大見出し*/
}

/*フォント_サイズ*/
.font-sm { font-size: 14px; }  /* 小さめ */
.font-caption { font-size:14px; color:#696D70;} /* キャプション */



/*メインコピー*/
.title_copy { font-size:32px; letter-spacing:0.05; line-height:1.875em; }
@media screen and (min-width: 768px) {
  .title_copy { font-size:54px; letter-spacing:0.05; line-height:1.5em; }
}
@media screen and (min-width:1080px) {
  .title_copy { font-size:60px;}
}

.text-animation {
  opacity: 1;
}

.text-animation-span span {
  display: inline-block;
  transform: translateX(100%);
  opacity: 0;
  animation: showText 0.5s ease-out forwards;
  animation-delay: var(--delay);
}

@keyframes showText {
  to {
    transform: translateX(0);
    opacity: 1;
  }
}





.top_photo {
  width: 100%;
  height: 30vh;
  overflow: hidden;
  position: relative;
  margin-bottom: 50px;
  transition: height 0.3s ease-out;
}

@media screen and (min-width:768px) {
  .top_photo {
    height: 100vh;
    margin-bottom: 100px;
  }
}

.top_photo img {
  width: 100vw;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  will-change: filter;
  transition: filter 0.5s ease;
}

/* ぼかし効果用クラス */
.top_photo img.blur {
  filter: blur(10px);
}

/* マスクアニメーション */
.top_photo .mask {
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  background: white;
  animation: maskUp 1.5s ease-out forwards;
}

@keyframes maskUp {
  from {
    transform: translateY(0%);
  }
  to {
    transform: translateY(-100%);
  }
}

.top_photo img {
  width: 100vw;
  height:100%; 
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  transition: filter 0.3s ease;
  filter: blur(0); /* 初期状態くっきり */
}

  
@media screen and (min-width: 768px) {
  .top_photo img { width:100vw; height:auto; }
}

.top_photo img.blur {
  filter: blur(10px);
}






/*ボタン*/
.button_more, .button_more.entry {
  width: 250px;
  display: inline-block;
  text-align: center;
  text-decoration: none;
  line-height: 50px;
  outline: none;
  background-color: #000;
  position: relative;
  z-index: 1;
  overflow: hidden;
  transition: all 0.3s ease;
  color: #fff;
}

.button_more::before, .button_more.entry::before {
  content: '';
  width: 120%;
  padding-top: 120%;
  border-radius: 100%;
  background-color: rgba(219, 38, 44, 1);
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: -1;
  transform-origin: top left;
  transform: scale(0) translate(-50%, -50%);
  transition: inherit;
}

.button_more:hover::before, .button_more.entry:hover::before {
  transform: scale(1) translate(-50%, -50%);
}

.button_more span, .button_more.entry span {
  width: 100%;
  color: #fff;
  line-height: 50px;
  text-align: center;
  display: block;
  letter-spacing: 0.1em;
  position: relative;
}

.button_more:hover span, .button_more.entry:hover span {
  color: #fff;
}

.button_more .arrow, .button_more.entry .arrow {
  width: 5px;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}

/* Specific entry styles */
.button_more.entry {
  background-color: rgba(219, 38, 44, 0.9);
}

.button_more.entry:hover::before {
  background-color: rgba(0, 0, 0, 0.9);
}

.button_more.entry {
  width: 80%;
  height: 80px;
  border: none;
  transition: all 0.3s ease-in-out;
  margin: 410px auto 0 auto;
  display: block;
}





@media (min-width: 768px) {
  .button_more.entry {width: 390px;height: 80px;  margin:20% auto 0 auto; z-index:3; }
}

.button_more.entry span { width:100%; font-weight:bold; font-size:18px; line-height:80px; z-index:3; }



.gaiyo { width:100%; display:flex; flex-wrap:wrap; align-items:center; border-top:1px solid #ccc; padding:15px 0; }
.gaiyo:last-child { border-bottom:1px solid #ccc; }
.gaiyo dt { width:100%; font-weight:bold; margin-bottom:10px; }
.gaiyo dd { width:100%; }
@media screen and (min-width: 768px) {
    .gaiyo { width:90%; max-width:960px; margin:0 auto; padding:16px 0; }
    .gaiyo dt { width:25%; font-weight:normal; margin-bottom:initial; padding-left:50px; }
    .gaiyo dd { width:75%; }
}



/*下層のトップ*/
.introduction{margin-bottom: 60px;font-weight: bold;line-height: 1.8; letter-spacing:0.1em; }
.title_wrap { width:100%; height:auto; display:block; padding-top:70px; }
.title { width:100%; margin:0px auto 40px auto; display:flex; flex-wrap:wrap; position:relative; }
.title .title_text { width:90%; margin:0 auto; display:block; }
.title .title_text h1 { width:100%; font-size:18px; color:#B3212B; position:absolute; top:2vh; }
.title_english {display: inline-flex;font-size:80px; line-height:1.1em; font-family: "Oswald", sans-serif;font-optical-sizing: auto;font-weight:800;font-style: normal;  margin-top:-15px; color:#F5F5F5; }
  
@media screen and (min-width: 768px) {
    .introduction{text-align: center;line-height: 2;margin-bottom: 120px;}
    .title_wrap { padding-top:80px; }
    .title { width:100%; max-width:1366px; height:100%; margin:0 auto 60px auto; display:block; }
    .title .title_text { width:90%; max-width:1080px; margin:0 auto; }
    .title .title_text h1 { font-size:18px; margin-left:0; top:50px; }
    .title_english  { font-size:192px; margin-top:-50px;}
}


/*ボタン （枠線が赤、文字が赤）*/
.button_with_arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 300px;
  height: 60px;
  border-radius: 30px;
  border: 2px solid #B3212B;
  font-weight: bold;
  font-size: 16px;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  color:#B3212B; 
}
.button_with_arrow:visited {
  color: #B3212B; /* ←これが必要 */
}

.button_with_arrow:hover,
.button_with_arrow:visited:hover {

  color:#B3212B; 
}

.button_with_arrow .arrow_icon {width: 24px;height: auto;transition opacity 0.3s ease;transition: transform 0.4s ease; }
.button_with_arrow .arrow_icon.white {position: absolute;right: 20px;opacity: 0;}
.button_with_arrow .arrow_icon.red {position: absolute;right: 20px;opacity: 1;}
.button_with_arrow:hover .arrow_icon.white {opacity:1;}
.button_with_arrow:hover .arrow_icon.red {opacity: 1;}


.button_with_arrow:hover .arrow_icon {
  transform: translateX(10px);
  /*filter: brightness(0) invert(1);  矢印画像を白に見せる */
  transition: transform 0.4s ease; /* 矢印の位置をスムーズに変える */
}

@media screen and (max-width: 768px) {
  .button_with_arrow { margin:0 auto; }
}















/*電話のリンク*/
@media screen and (min-width: 768px) {
    .contentsTel { pointer-events:none; }
}

/*エントリーボタン*/
.contentsEntry { width:90%; max-width:460px; height:70px; margin:50px auto; display:flex; justify-content:center; align-items:center; background:#FF5800; color:#fff; position: relative; }
.contentsEntry::before { content: ''; width: 50%; height: 100%; position: absolute; top: 0; left: -75%; background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%); transform: skewX(-25deg); }
.contentsEntry:hover::before { animation: shine 0.7s; }
.contentsEntryEng { font-family: "din-2014-narrow", sans-serif; font-weight:700; font-size:28px; margin-right:10px; }
.contentsEntryJpn { margin:0 5px; font-size:14px; }
.contentsEntry span.btnarrow{width:50px;position: relative;display: inline-block;padding: 0 20px;color: #fff; text-decoration: none;outline: none;margin-bottom:10px; right:0; transition: all 0.35s ;}
.contentsEntry span.btnarrow::before{content: '';position: absolute;bottom:-8px;left:10%; width: 90%; height: 1px; background:#fff; transition: all 0.35s;}
.contentsEntry span.btnarrow::after{content: '';position: absolute;bottom:-5px;right:0;width: 10px;height:1px; background:#fff;transform: rotate(35deg);transition: all 0.35s;}
.contentsEntry:hover span.btnarrow{ right:-20px; transition: all 0.35s;}
.contentsEntry:hover span.btnarrow::before{ transition: all 0.35s;}
.contentsEntry:hover span.btnarrow::after{ transition: all 0.35s;}
@media screen and (min-width: 600px){
    .contentsEntry { height:90px; }
    .contentsEntryEng { font-size:36px; }
    .contentsEntryJpn { margin:0 10px; }
}
@media screen and (min-width: 768px){
    .contentsEntry { margin:100px auto; }
    .contentsEntryEng { font-size:48px; }
}

@keyframes shine {
100% { left: 125%; }
}

.li_photo { overflow: hidden;}


/*エントリーフォーム*/
.div_entry { display:none; }


.div_entry .a_entry .contents span { display:block; color:#FFFF02; text-align:center; }
.div_entry .a_entry .contents strong { width:100%; line-height:1.7em; text-align:left; display:block; font-size:75px;  font-family: "futura-pt-bold", sans-serif; color:#fff;}
.div_entry_text { width:100%; display:flex; justify-content:space-between; color:#fff; }
.div_entry_text p { font-size:22px; font-weight:bold; color:#fff; display:inline-block; text-align:left; }
.div_entry .a_entry .contents span.sp_entryform { text-align:left; }
@media screen and (min-width: 768px){
    .div_entry.pc { width:100%; height:300px; position:relative; display:block; overflow:hidden;  display: flex;justify-content: center;align-items: center;}
    .div_entry.pc .a_entry .contents { width:90%; height:100%; padding:0; margin:0 5% 0 5%; }
    .div_entry.pc .video { width:100%; position:absolute; top:-50px; }
    .div_entry.pc .video {
        width: 100%;
        height: 300px;
        position: absolute;
        top: 0; /* 必要に応じて調整 */
        object-fit: cover;
    }

    .div_entry.pc .a_entry .contents { width:45%; height:100%; padding:50px 0; margin:0 auto; display:flex; flex-wrap:wrap; }
    @media screen and (min-width:900px){
        .div_entry.pc .a_entry .contents { width:80%; }
    }
    @media screen and (min-width:1200px){
        .div_entry.pc .a_entry .contents { width:45%;}
    }
    .div_entry_text p { font-size:35px;  white-space: nowrap; }
    .div_entry.pc .a_entry .contents strong { width:40%; line-height:1.2em; }
    .div_entry.pc .a_entry .contents span.sp_entryform { width:80%; text-align:left; margin-bottom:30px; }
    .div_entry.pc .circle { margin-top:20px; }
}


.ul_column3 { width:100%; display:flex; justify-content:space-between; flex-wrap:wrap; }
.ul_column3 li { width:33%;  }
.ul_column3 li img { width:100%; }
.ul_column3 li.li_long { width:49.7%; }
.ul_column3 li.li_long img { width:100%; }




@media screen and (max-width: 840px) {
    .tel:link { color:#000; }
    .tel:visited { color:#000; }
}

.banner_entry_wrap { width:100%; text-align:center; margin:0 auto; display:block; float:left; }
.banner_entry { width:390px; height:80px; margin:0 auto;   background-color: rgba(219, 38, 44, 1); position:relative;  mix-blend-mode: multiply;}
.banner_entry span { width:100%; line-height:80px; text-align:center; font-size:18px; font-weight:bold; letter-spacing:0.1em; font-weight:bold; color:#fff; display:inline-block; font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
.banner_entry .arrow { position:absolute; right:20px; top: 50%; transform: translateY(-50%);}
.banner_entry:hover { background-color: rgba(219, 38, 44, 0.5);}

/*ブログ用*/
.entry-header { width:90%; margin:0 auto; display:block; text-align:left; }
.entry-title.default-max-width { width:100%; margin:0; text-align:left; }
.entry-content { width:90%; margin:0 auto; display:block; }
.entry-footer.default-max-width { width:100%; margin:0 auto; display:block; text-align:left; }
@media screen and (min-width:1080px) {
  .entry-header{ width:1080px; }
  .entry-content { width:1080px; }
  .entry-footer.default-max-width { width:1080px; }
}

