/*-----------------------------------------------------------------------------------------------
reset
-----------------------------------------------------------------------------------------------*/
* {
  margin: 0;
  padding: 0;
  list-style: none;
  text-decoration: none;
  font-size: 14px;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 130px;
}


/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {}


/*-----------------------------------------------------------------------------------------------
display
-----------------------------------------------------------------------------------------------*/
header,
header .logo,
header .logo h1,
header .logo h1 span,
.menu,
.menu ul,
.menu ul li,
.menu .contact_link,
section,
.data_box,
.title_box,
.title_cont,
#contact_bottom div,
#contact_bottom a,
#contact_bottom a dl,
#contact_bottom a dl dt,
#contact_bottom a dl dd,
footer,
footer .footer_box,
footer .logo,
footer .logo p,
.copy {
  display: flex;
}

header,
header ul,
header .logo h1,
section,
.data_box,
.title_box,
.title_cont,
#contact_bottom div,
#contact_bottom a,
#contact_bottom a dl,
#contact_bottom a dl dt,
#contact_bottom a dl dd,
footer,
footer .logo,
footer .logo p {
  flex-wrap: wrap;
}

/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {

  .menu ul li a,
  .contact_link {
    display: flex;
  }

  .contact_link {
    flex-wrap: wrap;
  }
}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {

  .menu ul li a,
  .contact_link,
  .footer_box ul li {
    display: flex;
  }

  .contact_link {
    flex-wrap: wrap;
  }
}

/*【スマホ】 iphone16*/
@media only screen and (max-width: 767px) {

  .menu,
  .menu ul,
  footer .footer_box {
    flex-wrap: wrap;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {}

/*-----------------------------------------------------------------------------------------------
align-items
-----------------------------------------------------------------------------------------------*/
.menu ul li,
.menu .contact_link,
.title_box,
.title_cont,
#contact_bottom div,
#contact_bottom a,
#contact_bottom a dl,
#contact_bottom a dl dt,
#contact_bottom a dl dd,
.copy {
  align-items: center;
}

header .logo h1 {
  align-items: flex-end;
}

header .logo h1 span {
  align-items: flex-start;
}

/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {
  .menu ul li a {
    align-items: center;
  }
}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {}

/*-----------------------------------------------------------------------------------------------
justify-content
-----------------------------------------------------------------------------------------------*/
.menu ul li,
.menu .contact_link,
#contact_bottom div,
#contact_bottom a,
#contact_bottom a dl,
#contact_bottom a dl dt,
#contact_bottom a dl dd,
.footer_box ul li,
.copy {
  justify-content: center;
}

.menu {
  justify-content: flex-end;
}

footer {
  justify-content: flex-start;
}


/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {
  .menu {
    justify-content: flex-start;
  }

  .menu ul li a,
  .menu ul li a:hover,
  .menu ul li a:visited,
  .menu ul li a:link {
    justify-content: center;
  }
}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .menu {
    justify-content: flex-start;
  }

  .menu ul li a,
  .menu ul li a:hover,
  .menu ul li a:visited,
  .menu ul li a:link {
    justify-content: center;
  }
}

/*【スマホ】iphone16*/
@media only screen and (max-width: 767px) {
  .menu {
    justify-content: center;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {}


/*-----------------------------------------------------------------------------------------------
flex-direction
-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------
position
-----------------------------------------------------------------------------------------------*/
header {
  position: fixed;
}

#top_slider {
  position: relative;
}

#top_slider dl,
#top_slider img {
  position: absolute;
}

header {
  top: 0;
}

#top_slider dl {
  top: 40%;
}

header,
#top_slider img {
  left: 0;
}

#top_slider dl {
  left: 15%;
}

#top_slider img {
  bottom: -2px;
}

/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {
  #top_slider dl {
    top: 30%;
  }

  #top_slider img {
    bottom: -1px;
  }
}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #top_slider dl {
    top: 30%;
  }

  #top_slider img {
    bottom: -1px;
  }
}

/*【スマホ】iphone16*/
@media only screen and (max-width: 767px) {
  #top_slider dl {
    top: 34%;
  }

  #top_slider dl {
    left: 12%;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {}


/*-----------------------------------------------------------------------------------------------
width
-----------------------------------------------------------------------------------------------*/
.data_box,
.footer_box {
  width: 1200px;
}

body,
article,
header,
footer,
header .logo h1 span,
.title_box,
.title_box .number span,
#top_slider,
#contact_bottom a dl,
#contact_bottom a dl dt,
#contact_bottom a dl dd,
footer .logo,
footer .logo p span,
.copy {
  width: 100%;
}

.title_box h2,
.menu {
  width: 76%;
}

header .logo h1,
.menu ul {
  width: 70%;
}

#contact_bottom div .bottom_tel {
  width: 60%;
}

#contact_bottom div {
  width: 50%;
}

#contact_bottom div .bottom_mail,
footer .address {
  width: 40%;
}

header .logo img {
  width: 30%;
}

.title_cont {
  width: 25%;
}

header .logo,
.number,
footer .logo img {
  width: 20%;
}

#contact_bottom .bottom_mail img {
  width: 15%;
}

.menu ul li {
  width: 14%;
}

.menu .contact_link {
  width: 12.5%;
}

.contact_link img {
  width: 10%;
}

#contact_bottom .bottom_tel img {
  width: 7%;
}

/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {

  #top_slider img,
  .menu,
  .menu ul li a,
  .contact_link span {
    width: 100%;
  }

  .menu ul,
  #contact_bottom div {
    width: 90%;
  }

  .data_box,
  .footer_box {
    width: 80%;
  }

  .contact_link img {
    width: 30%;
  }

  header .logo,
  .title_cont {
    width: 45%;
  }

  #greeting .number {
    width: 14%;
  }

  .menu ul li {
    width: 14.2%;
  }

  .contact_link {
    width: 10%;
  }
}


/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {

  #top_slider img,
  .menu,
  .contact_link span {
    width: 100%;
  }

  .menu ul,
  #contact_bottom div,
  .data_box,
  .footer_box {
    width: 90%;
  }

  .contact_link img {
    width: 30%;
  }

  header .logo,
  .title_cont {
    width: 40%;
  }

  #greeting .number {
    width: 10%;
  }

  .menu ul li {
    width: 14.2%;
  }

  .contact_link {
    width: 10%;
  }
}

/*【スマホ】iphone16*/
@media only screen and (max-width: 767px) {
  body {
    width: 100vw;
  }

  .menu ul,
  .menu ul li,
  #top_slider img,
  .title_box,
  #contact_bottom div .bottom_tel,
  footer .address,
  .footer_box ul,
  .footer_box ul li {
    width: 100%;
  }

  #contact_bottom div,
  #contact_bottom div .bottom_mail,
  footer .footer_box {
    width: 90%;
  }

  header .logo,
  footer .address .logo p {
    width: 80%;
  }

  .menu .contact_link {
    width: 70%;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {}

/*-----------------------------------------------------------------------------------------------
height
-----------------------------------------------------------------------------------------------*/
img {
  height: auto;
}

.menu ul li {
  height: 100%;
}

header .logo {
  height: 60px;
}

.menu {
  height: 40px;
}

/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {

  .menu,
  .menu ul,
  .menu ul li,
  .menu ul li a {
    height: 100%;
  }

  .contact_link span {
    height: 30px;
  }
}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {

  .menu,
  .menu ul,
  .menu ul li,
  .menu ul li a {
    height: 100%;
  }

  .contact_link span {
    height: 30px;
  }
}


/*【スマホ】iphone16*/
@media only screen and (max-width: 767px) {

  .menu,
  .menu ul,
  .menu ul li {
    height: auto;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {}


/*-----------------------------------------------------------------------------------------------
font-szie
-----------------------------------------------------------------------------------------------*/
#top_slider dl dt,
.title_box .number,
#contact_bottom div .bottom_tel dd {
  font-size: 300%;
}

header .logo h1,
footer .logo p {
  font-size: 178%;
}

#top_slider dl dd,
.title_box h2,
#contact_bottom div .bottom_tel dt,
#contact_bottom div .bottom_mail {
  font-size: 150%;
}



/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {
  #contact_bottom div .bottom_tel dt {
    font-size: 120%;
  }
}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {}

/*【スマホ】iphone16*/
@media only screen and (max-width: 767px) {
  #contact_bottom div .bottom_tel dd {
    font-size: 250%;
  }

  header .logo h1,
  footer .logo p {
    font-size: 170%;
  }

  #top_slider dl dt {
    font-size: 160%;
  }

  .title_box h2,
  .menu a {
    font-size: 130%;
  }

  #contact_bottom div .bottom_tel dt,
  footer ul li a {
    font-size: 100%;
  }

  #top_slider dl dd,
  .copy {
    font-size: 70%;
  }

  header .logo h1 span {
    font-size: 50%;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {
  #contact_bottom div .bottom_tel dd {
    font-size: 245%;
  }

  .title_box h2,
  .menu a {
    font-size: 125%;
  }
}

/*-----------------------------------------------------------------------------------------------
font-szie
-----------------------------------------------------------------------------------------------*/
#top_slider dl,
#contact_bottom div .bottom_tel dd,
footer .logo p {
  font-weight: bold;
}

/*-----------------------------------------------------------------------------------------------
margin
-----------------------------------------------------------------------------------------------*/
section {
  margin: 100px 0;
}

#contact_bottom div,
footer .footer_box {
  margin: 0 auto;
}

.data_box {
  margin: 0 auto;
}

.menu {
  margin: 10px 0 10px auto;
}

.menu ul {
  margin: 0 1%;
}

footer .address p,
footer .address a {
  margin-top: 10px;
}

#top_slider {
  margin-top: 80px;
}

.title_box .number,
#contact_bottom a img {
  margin-right: 10px;
}

.title_box {
  margin-bottom: 30px;
}

.contact_link img {
  margin-right: 5px;
}


/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {
  .openbtn {
    margin-left: auto;
  }

  .contact_link img {
    margin: 0 30%;
  }

  .menu,
  .menu ul {
    margin: 0;
  }
}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .openbtn {
    margin-left: auto;
  }

  .contact_link img {
    margin: 0 30%;
  }

  .menu,
  .menu ul {
    margin: 0;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 767px) {
  .openbtn {
    margin-left: auto;
  }

  .contact_link {
    margin-top: 30px;
  }

  footer .footer_box {
    margin: 0 auto;
  }

  section {
    margin: 50px 0;
  }

  footer ul li {
    margin-top: 20px;
  }

  #contact_bottom div .bottom_tel {
    margin-bottom: 20px;
  }

  /*.menu .contact_link,
  .menu ul li{
    margin: 20px 0;
  }*/

  .menu,
  .menu ul {
    margin: 0;
  }
}


/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {}

/*-----------------------------------------------------------------------------------------------
padding
-----------------------------------------------------------------------------------------------*/
header {
  padding: 10px 2%;
}

.chid_box {
  padding-top: 80px;
}

header .logo h1 {
  padding-left: 10px;
}

#contact_bottom {
  padding: 50px 0;
}

#contact_bottom .bottom_mail,
.copy {
  padding: 20px 0;
}

#contact_bottom div {
  padding: 20px;
}

footer,
.copy {
  padding-top: 50px;
}

/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {
  .contact_link {
    padding: 20px 0;
  }
}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .contact_link {
    padding: 20px 0;
  }
}

/*【スマホ】iphone16*/
@media only screen and (max-width: 767px) {
  .menu .contact_link {
    padding: 20px 0;
  }

  .menu ul li {
    padding: 30px 0 0;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {}

/*-----------------------------------------------------------------------------------------------
color
-----------------------------------------------------------------------------------------------*/
header .logo,
header .logo:hover,
header .logo:visited,
header .logo:link,
.menu ul li a,
.menu ul li a:hover,
.menu ul li a:visited,
.menu ul li a:link {
  color: #000;
}

.menu .contact_link,
#top_slider dl dt,
#top_slider dl dd,
#contact_bottom .bottom_mail,
#contact_bottom .bottom_mail:hover,
#contact_bottom .bottom_mail:visited,
#contact_bottom .bottom_mail:link,
footer a:hover,
footer a:visited,
footer a:link,
footer {
  color: #fff;
}

.number {
  color: #DEE3EE;
}

.title_box h2 span {
  color: #D6B365;
}

#contact_bottom .bottom_tel,
#contact_bottom .bottom_tel:hover,
#contact_bottom .bottom_tel:visited,
#contact_bottom .bottom_tel:link {
  color: #03225C;
}

/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {

  .menu ul li a,
  .menu ul li a:hover,
  .menu ul li a:visited,
  .menu ul li a:link {
    color: #fff;
  }
}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {

  .menu ul li a,
  .menu ul li a:hover,
  .menu ul li a:visited,
  .menu ul li a:link {
    color: #fff;
  }
}

/*【スマホ】iphone16*/
@media only screen and (max-width: 767px) {

  .menu ul li a,
  .menu ul li a:hover,
  .menu ul li a:link,
  .menu ul li a:visited {
    color: #fff;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {}

/*-----------------------------------------------------------------------------------------------
background
-----------------------------------------------------------------------------------------------*/
header {
  background-color: #fff;
}

.menu .contact_link,
#contact_bottom .bottom_mail,
footer {
  background-color: #03225C;
}

.menu .contact_link:hover,
#contact_bottom .bottom_mail:hover {
  background-color: #294777;
}

#contact_bottom div {
  background: #fff;
}

#contact_bottom {
  background-image: url(../../img/contact_bottom_bk.webp);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center center;
}

/*【スマホ】iphone16*/
@media only screen and (max-width: 767px) {
  #contact_bottom {
    background-size: 200%;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {}

/*-----------------------------------------------------------------------------------------------
text-shadow
-----------------------------------------------------------------------------------------------*/
#top_slider dl,
.slick-prev,
.slick-next {
  text-shadow: #294777 1px 0 10px;
}

/*-----------------------------------------------------------------------------------------------
border
-----------------------------------------------------------------------------------------------*/
.menu li:hover {
  border-bottom: 2px solid #03225C;
}

/*-----------------------------------------------------------------------------------------------
border-radius
-----------------------------------------------------------------------------------------------*/
.menu .contact_link {
  border-radius: 5px;
}

#contact_bottom div,
#contact_bottom div .bottom_mail {
  border-radius: 10px;
}

/*-----------------------------------------------------------------------------------------------
z-index
-----------------------------------------------------------------------------------------------*/
header {
  z-index: 10000;
}

#top_slider dl,
#top_slider img {
  z-index: 7777;
}

/*-----------------------------------------------------------------------------------------------
line-height
-----------------------------------------------------------------------------------------------*/
.title_box h2 {
  line-height: 20px
}

/*-----------------------------------------------------------------------------------------------
overflow
-----------------------------------------------------------------------------------------------*/
#top_slider {
  overflow: hidden;
}

/*-----------------------------------------------------------------------------------------------
スライダーのためのcss
-----------------------------------------------------------------------------------------------*/
#top_slider,
.slick-slide {
  height: 600px !important;
}

.slider {
  position: relative;
  z-index: 1;
}

.slider-item01 {
  background: url(../../img/top_01.webp);
}

.slider-item02 {
  background: url(../../img/top_01_2.webp);
}

.slider-item03 {
  background: url(../../img/top_02.webp);
}

.slider-item04 {
  background: url(../../img/top_02_2.webp);
}

.slider-item05 {
  background: url(../../img/top_03.webp);
}

.slider-item06 {
  background: url(../../img/top_03_2.webp);
}

.slider-item {
  width: 100%;
  /*各スライダー全体の横幅を画面の高さいっぱい（100%）にする*/
  height: 100vh;
  /*各スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
  background-repeat: no-repeat;
  /*背景画像をリピートしない*/
  background-position: center;
  /*背景画像の位置を中央に*/
  background-size: cover;
  /*背景画像が.slider-item全体を覆い表示*/
}

/*矢印の設定*/

.slick-prev,
.slick-next {
  position: absolute;
  z-index: 3;
  top: 42%;
  cursor: pointer;
  /*マウスカーソルを指マークに*/
  outline: none;
  /*クリックをしたら出てくる枠線を消す*/
  border-top: 2px solid #fff;
  /*矢印の色*/
  border-right: 2px solid #fff;
  /*矢印の色*/
  height: 25px;
  width: 25px;
}

.slick-prev {
  /*戻る矢印の位置と形状*/
  left: 2.5%;
  transform: rotate(-135deg);
}

.slick-next {
  /*次へ矢印の位置と形状*/
  right: 2.5%;
  transform: rotate(45deg);
}


/*【iPad 縦向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {

  #top_slider,
  .slick-slide {
    height: 240px !important;
  }
}

/*【iPad 横向きのみ】*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {

  #top_slider,
  .slick-slide {
    height: 340px !important;
  }
}

/*【スマホ】iphone16*/
@media only screen and (max-width: 767px) {

  #top_slider,
  .slick-slide {
    height: 150px !important;
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {}

/*-----------------------------------------------------------------------------------------------
global_manu.css
-----------------------------------------------------------------------------------------------*/
/*========= ナビゲーションのためのCSS ===============*/

#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 8888;
  /*ナビのスタート位置と形状*/
  left: 0;
  top: -120%;
  width: 100%;
  height: 10vh;
  /*ナビの高さ*/
  background: #294777;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 80px;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  z-index: 8888;
  width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}


/*【スマホ】iphone16*/
@media only screen and (max-width: 767px) {
  #g-nav {
    height: 100vh;
    /*ナビの高さ*/
  }
}

/*【スマホ】iphone12*/
@media only screen and (max-width: 375px) {
  #g-nav {
    height: 100vh;
    /*ナビの高さ*/
  }
}


/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: relative;
  z-index: 8888;
  /*ボタンを最前面に*/
  top: 5px;
  right: 10px;
  cursor: pointer;
  width: 50px;
  height: 50px;
}

/*×に変化*/
.openbtn span {
  display: inline-block;
  transition: all .4s;
  position: absolute;
  left: 14px;
  height: 3px;
  border-radius: 2px;
  background-color: #294777;
  width: 45%;
}

.openbtn span:nth-of-type(1) {
  top: 15px;
}

.openbtn span:nth-of-type(2) {
  top: 23px;
}

.openbtn span:nth-of-type(3) {
  top: 31px;
}

.openbtn.active span:nth-of-type(1) {
  top: 18px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 30%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

.openbtn.active span:nth-of-type(3) {
  top: 30px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 30%;
}