/* BASIC css start */
.intro_content article:not(.page_title) + article{margin-top:120px;}
.intro_content article.page_title + article{margin-top:20px;}

.page_title {padding: 32px 0 0; text-align: center; font-size: 32px; color: var(--main_black); background: none;
    font-family: 'Noto Sans';}
.intro_text .img_wrap figure{overflow: hidden;}
.intro_text .text_wrap{margin-top:24px; line-height: 1.5;}
.intro_text .text_wrap h3{font-size: 24px; font-weight: 500; color: var(--main_color);}
.intro_text .text_wrap > strong{margin:20px 0; display: block; font-size: 20px; font-weight:400;}
.intro_text .text_wrap p{margin-top:8px; font-size: var(--basic_font_size);}
.intro_text .text_wrap p > strong{font-weight: 500; color: var(--main_black);}

.intro_process .process{--preocess_gap:247px; display: flex; justify-content: center; align-items: center; gap:0 var(--preocess_gap) ;}
.intro_process .process li{position:relative; display: flex; flex-direction: column; align-items: center; gap:8px}
.intro_process .process li + li::before{content: ""; position: absolute; top:50%; left: calc(-1 * (var(--preocess_gap) / 2)); transform: translate(-50%, -50%); display: block; width:40px; aspect-ratio: 1; background:url("/design/nhmelchi/new_images/icons/40_arrow_right.svg"); background-position: center; background-repeat: no-repeat; background-size: cover;  }
.intro_process .process li .text_wrap{font-size: 20px; font-weight: 500; color: var(--main_black);}

.intro_process .biz{margin-top:48px; display: flex; flex-wrap: wrap; gap:8px;}
.intro_process .biz li{padding:20px; width:calc((100% - (8px * 3)) / 4); border:1px solid var(--line_color); border-radius:var(--radius_5);  box-sizing: border-box; text-align: center; font-size: var(--basic_font_size); color: var(--main_black);}

.intro_directions .directions_info{display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 48px;}
.intro_directions .directions_info li{font-size: var(--basic_font_size); color: var(--main_black);}
.intro_directions .directions_map{margin-top:24px; border: 1px solid var(--line_color); border-radius: var(--radius_5); overflow: hidden;}
.intro_directions .directions_map .img_wrap figure{width:100%; height: 560px; overflow: hidden;}
.intro_directions .directions_map .img_wrap figure img{width:100%; height: 100%; object-fit: cover;}
.intro_directions .directions_map iframe {width:100%; height:400px;}


@media(max-width:1020px){
  .intro_content article:not(.page_title) + article{margin-top:80px;}

  .intro_text .img_wrap figure{height: 300px;}
  .intro_text .img_wrap figure img{height: 100%; object-fit: cover;}
  .intro_text .text_wrap{margin-top:20px;}
  .intro_text .text_wrap h3{font-size: 20px;}
  .intro_text .text_wrap > strong{margin:12px 0; font-size: 18px;}
  .intro_text .text_wrap p{margin-top:6px; font-size: var(--mini_font_size);}

  .intro_process .process{--preocess_gap:120px;}
  .intro_process .process li + li::before{width:28px; }
  .intro_process .process li i{width:40px;}
  .intro_process .process li .text_wrap{font-size: var(--mini_font_size);}  
  .intro_process .biz{margin-top:40px;}
  .intro_process .biz li{padding:16px; width:calc((100% - (8px * 2)) / 3); font-size: var(--small_font_size); }

  .intro_directions .directions_info{justify-content: flex-start;}
  .intro_directions .directions_map{margin-top:16px;}
  .intro_directions .directions_map iframe {height:360px;}
  .intro_directions .directions_map .img_wrap figure{height: 400px;}

}
@media(max-width:540px){
  .intro_content article:not(.page_title) + article{margin-top:64px;}
  
  .page_title {font-size: 24px;}

  .intro_text .img_wrap figure{height: auto;}
  .intro_text .text_wrap{margin-top:16px;}
  .intro_text .text_wrap > strong{margin:8px 0; font-size: 17px;}

  
  .intro_process .process{--preocess_gap:48px;}
  .intro_process .process li + li::before{width:20px; }
  .intro_process .process li i{width:32px;}
  .intro_process .process li .text_wrap{font-size: var(--small_font_size);}  
  .intro_process .biz{margin-top:20px;}
  .intro_process .biz li{padding:12px; width:calc((100% - (8px * 1)) / 2); font-size: var(--mini_font_size); }

  .intro_directions .directions_info{flex-direction: column; gap:4px;}
  .intro_directions .directions_map .img_wrap figure{height: 320px;}
  .intro_directions .directions_map iframe {height:280px;}
}
/* BASIC css end */