@charset "utf-8";
/*
**********************************************************************

* page.css

*********************************************************************
*/
/* ///////////////////////////////////////////////////////////////////

[Contents]

/////////////////////////////////////////////////////////////////// */
#Contents {}
#Contents .artCont {}
@media screen and (max-width: 820px) {
  #Contents {}
  #Contents .artCont {}
}

/* ///////////////////////////////////////////////////////////////////
MvSect
/////////////////////////////////////////////////////////////////// */

#Contents .artCont #MvSect {position: relative;padding: 25px 0 0;margin: 0 0 60px;}

#Contents .artCont #MvSect .slideBlock {padding-bottom: 40px;margin-bottom: 26px;}

#Contents .artCont #MvSect .arrowBox .slick-prev:before,
#Contents .artCont #MvSect .arrowBox .slick-next:before{
    background-image: url(../image/btn_slide_arrow.svg);
    background-size: contain;
}

#Contents .artCont #MvSect .slideBlock .slideItem {padding: 0 5px;}

#Contents .artCont #MvSect .slideBlock .slideItem h1 {
  position: absolute; /* 絶対位置で配置 */
  top: 50%; /* 垂直中央 */
  left: 50%; /* 水平中央 */
  transform: translate(-50%, -50%); /* 中心に配置 */
  color: white; /* テキストの色（必要に応じて変更） */
  font-size: 2em; /* フォントサイズ（必要に応じて変更） */
  text-align: center; /* テキストの中央揃え */
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); /* テキストの影で読みやすく */
}
#Contents .artCont #MvSect .arrowBox {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    max-width: 1270px;
    height: 1px;
}

#Contents .artCont #MvSect .attention {max-width: 1200px;margin: 0 auto;}

#Contents .artCont #MvSect .attention .txt {display: flex;justify-content: center;align-items: center;border: 5px solid #FECA57;height: 80px;}

#Contents .artCont #MvSect .attention .txt a {font-size: 16px;font-weight: bold;}

#Contents .artCont #MvSect .attention .txt .icon {flex: 0 0 auto;margin-right: 10px;}

@media screen and (max-width: 860px) {

  #Contents .artCont #MvSect {padding-top: 95px;margin-bottom: 30px;}

  #Contents .artCont #MvSect .slideBlock {}

#Contents .artCont #MvSect .slideBlock .slick-prev:before,
  #Contents .artCont #MvSect .slideBlock .slick-next:before{}

  #Contents .artCont #MvSect .slideBlock .slideItem {
    padding: 0;
}

#Contents .artCont #MvSect .slideBlock .slideItem h1 {
}

  #Contents .artCont #MvSect .attention {
    padding: 0 5%;
}

  #Contents .artCont #MvSect .attention .txt {
    padding: 0 5%;
}

  #Contents .artCont #MvSect .attention .txt a {
    font-size: 12px;
    align-items: baseline;
}

  #Contents .artCont #MvSect .attention .txt .icon {}

}
/* ///////////////////////////////////////////////////////////////////
Sec01
/////////////////////////////////////////////////////////////////// */
#Sec01{
  min-height: 400px;
}
.txtBlock {
  min-height: 150px;
}

.no-text {
    position: relative;
    font-size: 0; /* テキストのスペースを確保しつつ非表示に */
    line-height: 0;
    text-align: center;
}

#Contents .artCont #Sec01 {padding: 0 0 68px;}

#Contents .artCont #Sec01 .sectMain {display: flex;width: 100%;max-width: 1200px;margin: 0 auto 40px;}

#Contents .artCont #Sec01 .sectMain .img {flex: 0 1 auto;width: 52%;margin-bottom: 10px;}

#Contents .artCont #Sec01 .sectMain .txtBlock {width: 48%;padding: 0 0 0 2.7%;}

#Contents .artCont #Sec01 .sectMain .txtBlock .blockTit {margin-bottom: 44px;}

#Contents .artCont #Sec01 .sectMain .txtBlock .blockTit.type2 {
    max-width: 528px;
    margin: 0 0 0 auto;
}

#Contents .artCont #Sec01 .sectMain .txtBlock .blockTxt {font-size: 16px;line-height: 34px;padding: 0 0 0 6px;margin: 34px 0 0 0;}

#Contents .artCont #Sec01 .sectMain .txtBlock .blockTxt .fontO {font-weight: bold;color: #dc143c;}

#Contents .artCont #Sec01 .sectMain.type2 {
    flex-direction: row-reverse;
    justify-content: space-between;
    margin-bottom: 82px;
}

#Contents .artCont #Sec01 .sectMain.type2 .img {width: 48%;}

#Contents .artCont #Sec01 .sectMain.type2 .txtBlock {
    width: 45.5%;
    padding: 0 0 0 0;
}

#Contents .artCont #Sec01 .sectMain.type2 .blockTit{
    max-width: 526px;
}

#Contents .artCont #Sec01 .youtube {padding: 52px 0 64px;background: #E5FAFF;margin-bottom: 73px;}

#Contents .artCont #Sec01 .youtube .tit {
    width: 165px;
    margin: 0 auto 48px;
}

#Contents .artCont #Sec01 .youtube .tubeBlock {display: flex;justify-content: center;max-width: 1010px;margin: 0 auto;padding: 0 2%;}

@media screen and (max-width: 860px) {

  #Contents .artCont #Sec01 {
    padding-bottom: 34px;
}

  #Contents .artCont #Sec01 .sectMain {
    flex-direction: column;
    padding: 0 5%;
}

  #Contents .artCont #Sec01 .sectMain .img {
    width: 100%;
    margin-bottom: 20px;
    text-align: center;
}

  #Contents .artCont #Sec01 .sectMain .txtBlock {
    width: 100%;
    padding: 0;
}

  #Contents .artCont #Sec01 .sectMain .txtBlock .blockTit {
    margin-bottom: 20px;
}

  #Contents .artCont #Sec01 .sectMain .txtBlock .blockTit.type2 {}

  #Contents .artCont #Sec01 .sectMain .txtBlock .blockTxt {
    margin: 20px 0 0 0;
    font-size: 14px;
    line-height: 2;
}

  #Contents .artCont #Sec01 .sectMain .txtBlock .blockTxt .fontO {}

  #Contents .artCont #Sec01 .sectMain.type2 {
    flex-direction: column;
    margin-bottom: 40px;
}

  #Contents .artCont #Sec01 .sectMain.type2 .img {
    width: 100%;
}

  #Contents .artCont #Sec01 .sectMain.type2 .txtBlock {
    width: 100%;
}

  #Contents .artCont #Sec01 .sectMain.type2 .blockTit{}

  #Contents .artCont #Sec01 .youtube {
    padding: 25px 5% 30px;
    margin-bottom: 40px;
}

  #Contents .artCont #Sec01 .youtube .tit {
    width: 100px;
    margin-bottom: 24px;
}

  #Contents .artCont #Sec01 .youtube .tubeBlock {
    padding: 0;
}

}
/* ///////////////////////////////////////////////////////////////////
Sec02
/////////////////////////////////////////////////////////////////// */
#Contents .artCont #Sec02 {position: relative;margin-bottom: 22px;}
#Contents .artCont #Sec02:before {position: absolute;top: -21px;content:"";display: block;width: 100%;height: 22px;background-image: url("../image/nami_bg.svg");}
#Contents .artCont #Sec02:after {position: absolute;bottom: -21px;content:"";display: block;width: 100%;height: 22px;background-image: url("../image/nami_bg.svg");transform: rotate(180deg);}

#Contents .artCont #Sec02 .bgWrap {background: #E5FAFF;padding: 0 5%;}

#Contents .artCont #Sec02 .inner {width: 100%;max-width: 1200px;margin: 0 auto;padding: 52px 0 12px;}

#Contents .artCont #Sec02 .inner .sectMain {background: #fff;padding: 30px 4% 52px;margin-bottom: 8px;}

#Contents .artCont #Sec02 .inner .sectMain .sectTit {max-width: 524px;margin: 0 auto 68px;}

#Contents .artCont #Sec02 .inner .sectMain .sectList {max-width: 764px;margin: 0 auto;}

#Contents .artCont #Sec02 .inner .sectMain .sectList li {display: flex;align-items: center;margin: 47px auto 0;}

#Contents .artCont #Sec02 .inner .sectMain .sectList li .num {display: block;width: 106px;flex: 0 0 auto;}

#Contents .artCont #Sec02 .inner .sectMain .sectList li .num img {
    height: auto;
    padding: 0;
    width: 100%;
}

#Contents .artCont #Sec02 .inner .sectMain .sectList li .txt img {padding: 0 0 10px 36px;flex: 0 1 auto;}

#Contents .artCont #Sec02 .inner .sectMain .sectList li:nth-child(1) .txt img {
    max-width: 566px;
}
#Contents .artCont #Sec02 .inner .sectMain .sectList li:nth-child(2) .txt img {
    max-width: 660px;
}
#Contents .artCont #Sec02 .inner .sectMain .sectList li:nth-child(3) .txt img {
    max-width: 660px;
}

#Contents .artCont #Sec02 .inner .icon {width: 124px;margin: 0 auto 40px;}

#Contents .artCont #Sec02 .inner .sectBlock {display: flex;width: 100%;background: #fff;margin-bottom: 82px;}

#Contents .artCont #Sec02 .inner .sectBlock .imgBox {flex: 0 0 auto;width: 50%;}

#Contents .artCont #Sec02 .inner .sectBlock .txtBox {position: relative;display: flex;flex-direction: column;flex: 0 0 auto;width: 50%;padding: 36px 26px 20px 42px;}

#Contents .artCont #Sec02 .inner .sectBlock .txtBox .blockTit01 {max-width: 442px;margin-bottom: 36px;}

#Contents .artCont #Sec02 .inner .sectBlock .txtBox .blockTit02 {max-width: 420px;margin-bottom: 36px;}

#Contents .artCont #Sec02 .inner .sectBlock .txtBox .txt {margin-bottom: 30px;font-size: 16px;line-height: 30px;}

#Contents .artCont #Sec02 .inner .sectBlock .txtBox .boxList {padding-bottom: 80px;}

#Contents .artCont #Sec02 .inner .sectBlock .txtBox .boxList li {font-size: 16px;font-weight: bold;line-height: 30px;}

#Contents .artCont #Sec02 .inner .sectBlock .txtBox .btn {position: absolute;bottom: 20px;left: 0;width: 100%;padding: 0 26px 0 42px;}

#Contents .artCont #Sec02 .inner .sectBlock .txtBox .btn a {position: relative;display: flex;justify-content: flex-end;align-items: center;background: #FECA57;font-size: 18px;font-weight: bold;height: 69px;padding: 0 48px 0 0;}

#Contents .artCont #Sec02 .inner .sectBlock .txtBox .btn a:after {position: absolute;top: 0;right: 28px;bottom: 0;content:"";width: 7px;height: 12px;margin: auto;background-image: url("../image/icon_arrow_b.svg");background-repeat: no-repeat;background-size: contain;}

@media screen and (max-width: 860px) {

  #Contents .artCont #Sec02 {}
  #Contents .artCont #Sec02:before {}
  #Contents .artCont #Sec02:after {}

  #Contents .artCont #Sec02 .bgWrap {}

  #Contents .artCont #Sec02 .inner {
    padding: 30px 5% 12px;
}

  #Contents .artCont #Sec02 .inner .sectMain {}

  #Contents .artCont #Sec02 .inner .sectMain .sectTit {
    max-width: 250px;
    margin-bottom: 30px;
}

  #Contents .artCont #Sec02 .inner .sectMain .sectList {max-width: 360px;}

  #Contents .artCont #Sec02 .inner .sectMain .sectList li {
    margin-top: 30px;
}

  #Contents .artCont #Sec02 .inner .sectMain .sectList li .txt{display: flex;height: 16px;}

  #Contents .artCont #Sec02 .inner .sectMain .sectList li .num {
    width: 40px;
}

  #Contents .artCont #Sec02 .inner .sectMain .sectList li .num img {
}

  #Contents .artCont #Sec02 .inner .sectMain .sectList li .txt img {
    padding: 0 0 0 3%;
}

  #Contents .artCont #Sec02 .inner .sectMain .sectList li:nth-child(1) .txt img {width: 92%;}
  #Contents .artCont #Sec02 .inner .sectMain .sectList li:nth-child(2) .txt img {
    width: 100%;
}
  #Contents .artCont #Sec02 .inner .sectMain .sectList li:nth-child(3) .txt img {
    width: 100%;
}

  #Contents .artCont #Sec02 .inner .icon {
    width: 60px;
    margin-bottom: 20px;
}

  #Contents .artCont #Sec02 .inner .sectBlock {
    flex-direction: column-reverse;
    margin-bottom: 40px;
}

  #Contents .artCont #Sec02 .inner .sectBlock .imgBox {
    width: 100%;
    text-align: center;
}

  #Contents .artCont #Sec02 .inner .sectBlock .txtBox {
    width: 100%;
    padding: 20px 5%;
}

  #Contents .artCont #Sec02 .inner .sectBlock .txtBox .blockTit01 {
    margin-bottom: 10px;
}

  #Contents .artCont #Sec02 .inner .sectBlock .txtBox .blockTit02 {}

  #Contents .artCont #Sec02 .inner .sectBlock .txtBox .txt {
    font-size: 14px;
    line-height: 1.8;
}
  #Contents .artCont #Sec02 .inner .sectBlock .txtBox .boxList {}

  #Contents .artCont #Sec02 .inner .sectBlock .txtBox .boxList li {
    font-size: 14px;
    line-height: 1.8;
    text-indent: -14px;
    margin-left: 14px;
}

  #Contents .artCont #Sec02 .inner .sectBlock .txtBox .btn {
    padding: 0 5%;
}

  #Contents .artCont #Sec02 .inner .sectBlock .txtBox .btn a {
    font-size: 16px;
    height: 60px;
}
  #Contents .artCont #Sec02 .inner .sectBlock .txtBox .btn a:after {}

}


/* ///////////////////////////////////////////////////////////////////
Sec03
/////////////////////////////////////////////////////////////////// */
#Contents .artCont #Sec03 {
}

#Contents .artCont #Sec03 .inner {max-width: 1200px;width: 100%;margin: 0 auto;padding: 114px 4% 0;}

#Contents .artCont #Sec03 .inner .sectTit {position: relative;padding: 0 0 12px;margin-bottom: 20px;font-size: 24px;font-weight: bold;text-align: center;}

#Contents .artCont #Sec03 .inner .sectTit:after {position: absolute;bottom: 0;left: 0;right: 0;content:"";display: block;width: 60px;height: 5px;margin: auto;background: #00A0DA;}

#Contents .artCont #Sec03 .inner .sectList {max-width: 830px;margin: 0 auto;}

#Contents .artCont #Sec03 .inner .sectList li {margin-bottom: 20px;padding: 0 0 8px;border-bottom: 1px solid #CCCCCC;}

#Contents .artCont #Sec03 .inner .sectList li .inList {
}

#Contents .artCont #Sec03 .inner .sectList li .inList dt {font-size: 16px;font-weight: bold;}

#Contents .artCont #Sec03 .inner .sectList li .inList dd {font-size: 16px;line-height: 34px;}

@media screen and (max-width: 860px) {

#Contents .artCont #Sec03 {
}

  #Contents .artCont #Sec03 .inner {
    padding: 50px 5% 0;
}

  #Contents .artCont #Sec03 .inner .sectTit {
    font-size: 20px;
}

  #Contents .artCont #Sec03 .inner .sectTit:after {}

  #Contents .artCont #Sec03 .inner .sectList {}

  #Contents .artCont #Sec03 .inner .sectList li {}

#Contents .artCont #Sec03 .inner .sectList li .inList {
}

  #Contents .artCont #Sec03 .inner .sectList li .inList dt {}

  #Contents .artCont #Sec03 .inner .sectList li .inList dd {
    font-size: 14px;
}

}
/* ///////////////////////////////////////////////////////////////////
Sec04
/////////////////////////////////////////////////////////////////// */
#Contents .artCont #Sec04 {
}

#Contents .artCont #Sec04 .inner {max-width: 1200px;width: 100%;margin: 0 auto 274px;padding: 97px 0 0;}

#Contents .artCont #Sec04 .inner .sectTit {position: relative;padding: 0 0 12px;margin-bottom: 42px;font-size: 24px;font-weight: bold;text-align: center;}

#Contents .artCont #Sec04 .inner .sectTit:after {position: absolute;bottom: 0;left: 0;right: 0;content:"";display: block;width: 60px;height: 5px;margin: auto;background: #00A0DA;}


#Contents .artCont #Sec04 .inner .sectList {display: flex;justify-content: space-between;margin-bottom: 22px;width: 100%;}

#Contents .artCont #Sec04 .inner .sectList li {flex: 0 1 auto;width: 18.7%;}

#Contents .artCont #Sec04 .inner .insta {display: flex;justify-content: flex-end;}

#Contents .artCont #Sec04 .inner .insta a {position: relative;display: flex;align-items: center;padding: 0 0 0 36px;height: 30px;font-size: 16px;font-weight: bold;}

#Contents .artCont #Sec04 .inner .insta a:before {content:"";position: absolute;display: block;left: 0;width: 30px;height: 30px;background-image: url(../image/icon_Insta.svg);}


@media screen and (max-width: 860px) {

#Contents .artCont #Sec04 {
}

  #Contents .artCont #Sec04 .inner {
    padding: 50px 5% 0;
    margin-bottom: 130px;
}

  #Contents .artCont #Sec04 .inner .sectTit {
    font-size: 20px;
    margin-bottom: 30px;
}

  #Contents .artCont #Sec04 .inner .sectTit:after {}


  #Contents .artCont #Sec04 .inner .sectList {
    flex-wrap: wrap;
    margin-bottom: 0;
}

  #Contents .artCont #Sec04 .inner .sectList li {width: 48%;margin-bottom: 4%;}

  #Contents .artCont #Sec04 .inner .sectList li img {width:100%;}

  #Contents .artCont #Sec04 .inner .insta {}

  #Contents .artCont #Sec04 .inner .insta a {}
  #Contents .artCont #Sec04 .inner .insta a:before {}

}
.lazy-load {
  content-visibility: auto;
}


/* ///////////////////////////////////////////////////////////////////
IE font
/////////////////////////////////////////////////////////////////// */
@media screen and (min-width: 0\0) and (min-resolution: +72dpi) {
  .selector {
    property: value;
  }
  /* IE向けのCSS～START */
  body {
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif, "Roboto";
    font-display: swap;
  }
  /* IE向けのCSS～END */
}