@charset "utf-8";

/* ベース設定 */

@media print{
  .print_none{
      display: none;
  }
}

html,body{
  height: 100%;
  font-size: 16px;
  line-height: 1.8;
  font-weight: normal;
  width: 100%;
}

html{
  scroll-behavior: smooth;
}

body{
  overflow-x: hidden;
  background-color: #fff;
}

img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

a {
  transition: 0.3s;
  text-decoration: none;
  color: #222; /* リンクカラー */
}

a:hover {
  text-decoration: none;
  /* opacity: 0.8; */
  transition: 0.3s;
}



/* =========== 文字の指定ここから =========== */

.yakuhan {
  font-family: YakuHanJP, "Hiragino Sans", "Hiragino Kaku Gothic ProN",
    "Noto Sans JP", Meiryo, sans-serif;
}
.txt-white {
  color: #fff;
}
.txt-red {
  color: rgb(163, 0, 0);
}
.txt-yellow{
  color: #ffd800;
}
.txt70p{
font-size: 70%;
}
.txt80p{
font-size: 80%;
}
.txt90p{
font-size: 90%;
}
.txt110p{
font-size: 110%;
}
.txt120p{
font-size: 120%;
}
.txt130p{
font-size: 130%;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 500;
}
.align-center{
  text-align: center;
}
.align-center_sp-left{
  text-align: center;
}
@media screen and (max-width: 834px) {
  .align-center_sp-left{
    text-align: left;
  }
}

/* =========== 文字の指定ここまで =========== */




/* =========== 横幅の指定ここから =========== */

.w1200,.w1100,.w1000,.w960,.w850,.w800,.w750,.w640,.w500,.w400{
  max-width: 90%;
  margin-left: auto;
  margin-right: auto;
}
.w1200{
  width: 1200px;
}
.w1100{
  width: 1100px;
}
.w1000{
  width: 1000px;
}
.w960{
  width: 960px;
}
.w850{
  width: 850px;
}
.w800{
  width: 800px;
}
.w750{
  width: 750px;
}
.w640{
  width: 640px;
}
.w500{
  width: 500px;
}
.w400{
  width: 400px;
}

.mx100 {
  max-width: 100% !important;
}

.mx90 {
  max-width: 90% !important;
}

.mx80 {
  max-width: 80% !important;
}

.mx70 {
  max-width: 70% !important;
}

@media screen and (min-width: 1600px) {
  /* サイズlとする　*/

  .l_mx100 {
    max-width: 100% !important;
  }

  .l_mx90 {
    max-width: 90% !important;
  }

  .l_mx80 {
    max-width: 80% !important;
  }

  .l_mx70 {
    max-width: 70% !important;
  }
}

@media screen and (max-width: 1200px) {
  .m_mx100 {
    max-width: 100% !important;
  }

  .m_mx90 {
    max-width: 90% !important;
  }

  .m_mx80 {
    max-width: 80% !important;
  }

  .m_mx70 {
    max-width: 70% !important;
  }

  .m_w1000,.m_w960,.m_w850,.m_w800,.m_w750,.m_w640,.m_w500,.m_w400{
  max-width: 90%;
  margin-left: auto;
  margin-right: auto;
}
.m_w1000{
  width: 1000px;
}
.m_w960{
  width: 960px;
}
.m_w850{
  width: 850px;
}
.m_w800{
  width: 800px;
}
.m_w750{
  width: 750px;
}
.m_w640{
  width: 640px;
}
.m_w500{
  width: 500px;
}
.m_w400{
  width: 400px;
}
}

@media screen and (max-width: 834px) {
  .s_mx100 {
    max-width: 100% !important;
  }

  .s_mx90 {
    max-width: 90% !important;
  }

  .s_mx80 {
    max-width: 80% !important;
  }

  .s_mx70 {
    max-width: 70% !important;
  }

.s_w800,.s_w750,.s_w640,.s_w500,.s_w400{
  max-width: 90%;
  margin-left: auto;
  margin-right: auto;
}
.s_w800{
  width: 800px;
}
.s_w750{
  width: 750px;
}
.s_w640{
  width: 640px;
}
.s_w500{
  width: 500px;
}
.s_w400{
  width: 400px;
}
}

/* =========== 横幅の指定ここまで =========== */





/* =========== #id名で指定の場所に飛ぶ時の指定ここから =========== */

a.anchor{
  display: block;
  padding-top: 100px;
  margin-top: -100px;
}

@media screen and (max-width: 1200px) {
  a.anchor{
    display: block;
    padding-top: 80px;
    margin-top: -80px;
  }
}

@media screen and (max-width: 834px) {
  a.anchor{
    display: block;
    padding-top: 60px;
    margin-top: -60px;
  }
}

/* =========== #id名で指定の場所に飛ぶ時の指定ここまで =========== */



/* =========== marginの指定ここから =========== */

.mt0 {
  margin-top: 0px !important;
}
.mt5 {
  margin-top: 5px !important;
}
.mt10 {
  margin-top: 10px !important;
}
.mt20 {
  margin-top: 20px !important;
}
.mt30 {
  margin-top: 30px !important;
}
.mt40 {
  margin-top: 40px !important;
}
.mt50 {
  margin-top: 50px !important;
}
.mt60 {
  margin-top: 60px !important;
}
.mt70 {
  margin-top: 70px !important;
}
.mt80 {
  margin-top: 80px !important;
}
.mt90 {
  margin-top: 90px !important;
}
.mt100 {
  margin-top: 100px !important;
}
.mt110 {
  margin-top: 110px !important;
}
.mt120 {
  margin-top: 120px !important;
}
.mt150 {
  margin-top: 150px !important;
}
.mt200 {
  margin-top: 200px !important;
}
.mt250 {
  margin-top: 250px !important;
}
.mt300 {
  margin-top: 300px !important;
}

.mb0 {
  margin-bottom: 0px !important;
}
.mb5 {
  margin-bottom: 5px !important;
}
.mb10 {
  margin-bottom: 10px !important;
}
.mb20 {
  margin-bottom: 20px !important;
}
.mb30 {
  margin-bottom: 30px !important;
}
.mb40 {
  margin-bottom: 40px !important;
}
.mb50 {
  margin-bottom: 50px !important;
}
.mb60 {
  margin-bottom: 60px !important;
}
.mb70 {
  margin-bottom: 70px !important;
}
.mb80 {
  margin-bottom: 80px !important;
}
.mb90 {
  margin-bottom: 90px !important;
}
.mb100 {
  margin-bottom: 100px !important;
}
.mb110 {
  margin-bottom: 110px !important;
}
.mb120 {
  margin-bottom: 120px !important;
}
.mb150 {
  margin-bottom: 150px !important;
}
.mb200 {
  margin-bottom: 200px !important;
}
.mb250 {
  margin-bottom: 250px !important;
}
.mb300 {
  margin-bottom: 300px !important;
}
.mr0{
  margin-right: 0 !important;
}
.mr5{
  margin-right: 5px !important;
}
.mr10{
  margin-right: 10px !important;
}
.mr20{
  margin-right: 20px !important;
}
.mr30{
  margin-right: 30px !important;
}
.mr40{
  margin-right: 40px !important;
}
.mr50{
  margin-right: 50px !important;
}
.ml0{
  margin-left: 0 !important;
}
.ml5{
  margin-left: 5px !important;
}
.ml10{
  margin-left: 10px !important;
}
.ml20{
  margin-left: 20px !important;
}
.ml30{
  margin-left: 30px !important;
}
.ml40{
  margin-left: 40px !important;
}
.ml50{
  margin-left: 50px !important;
}

@media screen and (max-width: 1200px) {
  /* サイズmとする　*/

  .m_mt0 {
    margin-top: 0px !important;
  }
  .m_mt5 {
    margin-top: 5px !important;
  }
  .m_mt10 {
    margin-top: 10px !important;
  }
  .m_mt20 {
    margin-top: 20px !important;
  }
  .m_mt30 {
    margin-top: 30px !important;
  }
  .m_mt40 {
    margin-top: 40px !important;
  }
  .m_mt50 {
    margin-top: 50px !important;
  }
  .m_mt60 {
    margin-top: 60px !important;
  }
  .m_mt70 {
    margin-top: 70px !important;
  }
  .m_mt75 {
    margin-top: 75px !important;
  }
  .m_mt80 {
    margin-top: 80px !important;
  }
  .m_mt90 {
    margin-top: 90px !important;
  }
  .m_mt100 {
    margin-top: 100px !important;
  }
  .m_mt110 {
    margin-top: 110px !important;
  }
  .m_mt120 {
    margin-top: 120px !important;
  }
  .m_mt150 {
    margin-top: 150px !important;
  }
  .m_mt200 {
    margin-top: 200px !important;
  }
  .m_mt250 {
    margin-top: 250px !important;
  }
  .m_mt300 {
    margin-top: 300px !important;
  }

  .m_mb0 {
    margin-bottom: 0px !important;
  }
  .m_mb5 {
    margin-bottom: 5px !important;
  }
  .m_mb10 {
    margin-bottom: 10px !important;
  }
  .m_mb20 {
    margin-bottom: 20px !important;
  }
  .m_mb30 {
    margin-bottom: 30px !important;
  }
  .m_mb40 {
    margin-bottom: 40px !important;
  }
  .m_mb50 {
    margin-bottom: 50px !important;
  }
  .m_mb60 {
    margin-bottom: 60px !important;
  }
  .m_mb70 {
    margin-bottom: 70px !important;
  }
  .m_mb80 {
    margin-bottom: 80px !important;
  }
  .m_mb90 {
    margin-bottom: 90px !important;
  }
  .m_mb100 {
    margin-bottom: 100px !important;
  }
  .m_mb110 {
    margin-bottom: 110px !important;
  }
  .m_mb120 {
    margin-bottom: 120px !important;
  }
  .m_mb150 {
    margin-bottom: 150px !important;
  }
  .m_mb200 {
    margin-bottom: 200px !important;
  }
  .m_mb250 {
    margin-bottom: 250px !important;
  }
  .m_mb300 {
    margin-bottom: 300px !important;
  }
  .m_mr0{
    margin-right: 0 !important;
  }
  .m_mr5{
    margin-right: 5px !important;
  }
  .m_mr10{
    margin-right: 10px !important;
  }
  .m_mr20{
    margin-right: 20px !important;
  }
  .m_mr30{
    margin-right: 30px !important;
  }
  .m_mr40{
    margin-right: 40px !important;
  }
  .m_mr50{
    margin-right: 50px !important;
  }
  .m_ml0{
    margin-left: 0 !important;
  }
  .m_ml5{
    margin-left: 5px !important;
  }
  .m_ml10{
    margin-left: 10px !important;
  }
  .m_ml20{
    margin-left: 20px !important;
  }
  .m_ml30{
    margin-left: 30px !important;
  }
  .m_ml40{
    margin-left: 40px !important;
  }
  .m_ml50{
    margin-left: 50px !important;
  }
}

@media screen and (max-width: 834px) {
  /* サイズsとする　*/
  .s_mt0 {
    margin-top: 0px !important;
  }
  .s_mt5 {
    margin-top: 5px !important;
  }
  .s_mt10 {
    margin-top: 10px !important;
  }
  .s_mt20 {
    margin-top: 20px !important;
  }
  .s_mt30 {
    margin-top: 30px !important;
  }
  .s_mt40 {
    margin-top: 40px !important;
  }
  .s_mt50 {
    margin-top: 50px !important;
  }
  .s_mt60 {
    margin-top: 60px !important;
  }
  .s_mt70 {
    margin-top: 70px !important;
  }
  .s_mt75 {
    margin-top: 75px !important;
  }
  .s_mt80 {
    margin-top: 80px !important;
  }
  .s_mt90 {
    margin-top: 90px !important;
  }
  .s_mt100 {
    margin-top: 100px !important;
  }
  .s_mt110 {
    margin-top: 110px !important;
  }
  .s_mt120 {
    margin-top: 120px !important;
  }
  .s_mt150 {
    margin-top: 150px !important;
  }
  .s_mt200 {
    margin-top: 200px !important;
  }
  .s_mt250 {
    margin-top: 250px !important;
  }
  .s_mt300 {
    margin-top: 300px !important;
  }

  .s_mb0 {
    margin-bottom: 0px !important;
  }
  .s_mb5 {
    margin-bottom: 5px !important;
  }
  .s_mb10 {
    margin-bottom: 10px !important;
  }
  .s_mb20 {
    margin-bottom: 20px !important;
  }
  .s_mb30 {
    margin-bottom: 30px !important;
  }
  .s_mb40 {
    margin-bottom: 40px !important;
  }
  .s_mb50 {
    margin-bottom: 50px !important;
  }
  .s_mb60 {
    margin-bottom: 60px !important;
  }
  .s_mb70 {
    margin-bottom: 70px !important;
  }
  .s_mb80 {
    margin-bottom: 80px !important;
  }
  .s_mb90 {
    margin-bottom: 90px !important;
  }
  .s_mb100 {
    margin-bottom: 100px !important;
  }
  .s_mb110 {
    margin-bottom: 110px !important;
  }
  .s_mb120 {
    margin-bottom: 120px !important;
  }
  .s_mb150 {
    margin-bottom: 150px !important;
  }
  .s_mb200 {
    margin-bottom: 200px !important;
  }
  .s_mb250 {
    margin-bottom: 250px !important;
  }
  .s_mb300 {
    margin-bottom: 300px !important;
  }
  .s_mr0{
    margin-right: 0 !important;
  }
  .s_mr5{
    margin-right: 5px !important;
  }
  .s_mr10{
    margin-right: 10px !important;
  }
  .s_mr20{
    margin-right: 20px !important;
  }
  .s_mr30{
    margin-right: 30px !important;
  }
  .s_mr40{
    margin-right: 40px !important;
  }
  .s_mr50{
    margin-right: 50px !important;
  }
  .s_ml0{
    margin-left: 0 !important;
  }
  .s_ml5{
    margin-left: 5px !important;
  }
  .s_ml10{
    margin-left: 10px !important;
  }
  .s_ml20{
    margin-left: 20px !important;
  }
  .s_ml30{
    margin-left: 30px !important;
  }
  .s_ml40{
    margin-left: 40px !important;
  }
  .s_ml50{
    margin-left: 50px !important;
  }
}

@media screen and (max-width: 500px) {
  /* サイズxsとする　*/
  .xs_mt0 {
    margin-top: 0px !important;
  }
  .xs_mt5 {
    margin-top: 5px !important;
  }
  .xs_mt10 {
    margin-top: 10px !important;
  }
  .xs_mt20 {
    margin-top: 20px !important;
  }
  .xs_mt30 {
    margin-top: 30px !important;
  }
  .xs_mt40 {
    margin-top: 40px !important;
  }
  .xs_mt50 {
    margin-top: 50px !important;
  }
  .xs_mt60 {
    margin-top: 60px !important;
  }
  .xs_mt70 {
    margin-top: 70px !important;
  }
  .xs_mt75 {
    margin-top: 75px !important;
  }
  .xs_mt80 {
    margin-top: 80px !important;
  }
  .xs_mt90 {
    margin-top: 90px !important;
  }
  .xs_mt100 {
    margin-top: 100px !important;
  }
  .xs_mt110 {
    margin-top: 110px !important;
  }
  .xs_mt120 {
    margin-top: 120px !important;
  }
  .xs_mt150 {
    margin-top: 150px !important;
  }
  .xs_mt200 {
    margin-top: 200px !important;
  }
  .xs_mt250 {
    margin-top: 250px !important;
  }
  .xs_mt300 {
    margin-top: 300px !important;
  }

  .xs_mb0 {
    margin-bottom: 0px !important;
  }
  .xs_mb5 {
    margin-bottom: 5px !important;
  }
  .xs_mb10 {
    margin-bottom: 10px !important;
  }
  .xs_mb20 {
    margin-bottom: 20px !important;
  }
  .xs_mb30 {
    margin-bottom: 30px !important;
  }
  .xs_mb40 {
    margin-bottom: 40px !important;
  }
  .xs_mb50 {
    margin-bottom: 50px !important;
  }
  .xs_mb60 {
    margin-bottom: 60px !important;
  }
  .xs_mb70 {
    margin-bottom: 70px !important;
  }
  .xs_mb80 {
    margin-bottom: 80px !important;
  }
  .xs_mb90 {
    margin-bottom: 90px !important;
  }
  .xs_mb100 {
    margin-bottom: 100px !important;
  }
  .xs_mb110 {
    margin-bottom: 110px !important;
  }
  .xs_mb120 {
    margin-bottom: 120px !important;
  }
  .xs_mb150 {
    margin-bottom: 150px !important;
  }
  .xs_mb200 {
    margin-bottom: 200px !important;
  }
  .xs_mb250 {
    margin-bottom: 250px !important;
  }
  .xs_mb300 {
    margin-bottom: 300px !important;
  }
  .xs_mr0{
    margin-right: 0 !important;
  }
  .xs_mr5{
    margin-right: 5px !important;
  }
  .xs_mr10{
    margin-right: 10px !important;
  }
  .xs_mr20{
    margin-right: 20px !important;
  }
  .xs_mr30{
    margin-right: 30px !important;
  }
  .xs_mr40{
    margin-right: 40px !important;
  }
  .xs_mr50{
    margin-right: 50px !important;
  }
  .xs_ml0{
    margin-left: 0 !important;
  }
  .xs_ml5{
    margin-left: 5px !important;
  }
  .xs_ml10{
    margin-left: 10px !important;
  }
  .xs_ml20{
    margin-left: 20px !important;
  }
  .xs_ml30{
    margin-left: 30px !important;
  }
  .xs_ml40{
    margin-left: 40px !important;
  }
  .xs_ml50{
    margin-left: 50px !important;
  }
}


/* =========== marginの指定ここまで =========== */




/* =========== paddingの指定ここから =========== */

.pt0 {
  padding-top: 0px !important;
}
.pt5 {
  padding-top: 5px !important;
}
.pt10 {
  padding-top: 10px !important;
}
.pt20 {
  padding-top: 20px !important;
}
.pt30 {
  padding-top: 30px !important;
}
.pt40 {
  padding-top: 40px !important;
}
.pt50 {
  padding-top: 50px !important;
}
.pt60 {
  padding-top: 60px !important;
}
.pt70 {
  padding-top: 70px !important;
}
.pt80 {
  padding-top: 80px !important;
}
.pt90 {
  padding-top: 90px !important;
}
.pt100 {
  padding-top: 100px !important;
}
.pt110 {
  padding-top: 110px !important;
}
.pt120 {
  padding-top: 120px !important;
}
.pt150 {
  padding-top: 150px !important;
}
.pt200 {
  padding-top: 200px !important;
}
.pt250 {
  padding-top: 250px !important;
}
.pt300 {
  padding-top: 300px !important;
}

.pb0 {
  padding-bottom: 0px !important;
}
.pb5 {
  padding-bottom: 5px !important;
}
.pb10 {
  padding-bottom: 10px !important;
}
.pb20 {
  padding-bottom: 20px !important;
}
.pb30 {
  padding-bottom: 30px !important;
}
.pb40 {
  padding-bottom: 40px !important;
}
.pb50 {
  padding-bottom: 50px !important;
}
.pb60 {
  padding-bottom: 60px !important;
}
.pb70 {
  padding-bottom: 70px !important;
}
.pb80 {
  padding-bottom: 80px !important;
}
.pb90 {
  padding-bottom: 90px !important;
}
.pb100 {
  padding-bottom: 100px !important;
}
.pb110 {
  padding-bottom: 110px !important;
}
.pb120 {
  padding-bottom: 120px !important;
}
.pb150 {
  padding-bottom: 150px !important;
}
.pb200 {
  padding-bottom: 200px !important;
}
.pb250 {
  padding-bottom: 250px !important;
}
.pb300 {
  padding-bottom: 300px !important;
}
.pr0{
  padding-right: 0 !important;
}
.pr5{
  padding-right: 5px !important;
}
.pr10{
  padding-right: 10px !important;
}
.pr20{
  padding-right: 20px !important;
}
.pr30{
  padding-right: 30px !important;
}
.pr40{
  padding-right: 40px !important;
}
.pr50{
  padding-right: 50px !important;
}
.pl0{
  padding-left: 0 !important;
}
.pl5{
  padding-left: 5px !important;
}
.pl10{
  padding-left: 10px !important;
}
.pl20{
  padding-left: 20px !important;
}
.pl30{
  padding-left: 30px !important;
}
.pl40{
  padding-left: 40px !important;
}
.pl50{
  padding-left: 50px !important;
}

@media screen and (max-width: 1200px) {
  /* サイズmとする　*/
  .m_pt0 {
    padding-top: 0px !important;
  }
  .m_pt5 {
    padding-top: 5px !important;
  }
  .m_pt10 {
    padding-top: 10px !important;
  }
  .m_pt20 {
    padding-top: 20px !important;
  }
  .m_pt30 {
    padding-top: 30px !important;
  }
  .m_pt40 {
    padding-top: 40px !important;
  }
  .m_pt50 {
    padding-top: 50px !important;
  }
  .m_pt60 {
    padding-top: 60px !important;
  }
  .m_pt70 {
    padding-top: 70px !important;
  }
  .m_pt80 {
    padding-top: 80px !important;
  }
  .m_pt90 {
    padding-top: 90px !important;
  }
  .m_pt100 {
    padding-top: 100px !important;
  }
  .m_pt110 {
    padding-top: 110px !important;
  }
  .m_pt120 {
    padding-top: 120px !important;
  }
  .m_pt150 {
    padding-top: 150px !important;
  }
  .m_pt200 {
    padding-top: 200px !important;
  }
  .m_pt250 {
    padding-top: 250px !important;
  }
  .m_pt300 {
    padding-top: 300px !important;
  }

  .m_pb0 {
    padding-bottom: 0px !important;
  }
  .m_pb5 {
    padding-bottom: 5px !important;
  }
  .m_pb10 {
    padding-bottom: 10px !important;
  }
  .m_pb20 {
    padding-bottom: 20px !important;
  }
  .m_pb30 {
    padding-bottom: 30px !important;
  }
  .m_pb40 {
    padding-bottom: 40px !important;
  }
  .m_pb50 {
    padding-bottom: 50px !important;
  }
  .m_pb60 {
    padding-bottom: 60px !important;
  }
  .m_pb70 {
    padding-bottom: 70px !important;
  }
  .m_pb80 {
    padding-bottom: 80px !important;
  }
  .m_pb90 {
    padding-bottom: 90px !important;
  }
  .m_pb100 {
    padding-bottom: 100px !important;
  }
  .m_pb110 {
    padding-bottom: 110px !important;
  }
  .m_pb120 {
    padding-bottom: 120px !important;
  }
  .m_pb150 {
    padding-bottom: 150px !important;
  }
  .m_pb200 {
    padding-bottom: 200px !important;
  }
  .m_pb250 {
    padding-bottom: 250px !important;
  }
  .m_pb300 {
    padding-bottom: 300px !important;
  }
  .m_pr0{
    padding-right: 0 !important;
  }
  .m_pr5{
    padding-right: 5px !important;
  }
  .m_pr10{
    padding-right: 10px !important;
  }
  .m_pr20{
    padding-right: 20px !important;
  }
  .m_pr30{
    padding-right: 30px !important;
  }
  .m_pr40{
    padding-right: 40px !important;
  }
  .m_pr50{
    padding-right: 50px !important;
  }
  .m_pl0{
    padding-left: 0 !important;
  }
  .m_pl5{
    padding-left: 5px !important;
  }
  .m_pl10{
    padding-left: 10px !important;
  }
  .m_pl20{
    padding-left: 20px !important;
  }
  .m_pl30{
    padding-left: 30px !important;
  }
  .m_pl40{
    padding-left: 40px !important;
  }
  .m_pl50{
    padding-left: 50px !important;
  }
}

@media screen and (max-width: 834px) {
  /* サイズsとする　*/
  .s_pt0 {
    padding-top: 0px !important;
  }
  .s_pt5 {
    padding-top: 5px !important;
  }
  .s_pt10 {
    padding-top: 10px !important;
  }
  .s_pt20 {
    padding-top: 20px !important;
  }
  .s_pt30 {
    padding-top: 30px !important;
  }
  .s_pt40 {
    padding-top: 40px !important;
  }
  .s_pt50 {
    padding-top: 50px !important;
  }
  .s_pt60 {
    padding-top: 60px !important;
  }
  .s_pt70 {
    padding-top: 70px !important;
  }
  .s_pt80 {
    padding-top: 80px !important;
  }
  .s_pt90 {
    padding-top: 90px !important;
  }
  .s_pt100 {
    padding-top: 100px !important;
  }
  .s_pt110 {
    padding-top: 110px !important;
  }
  .s_pt120 {
    padding-top: 120px !important;
  }
  .s_pt150 {
    padding-top: 150px !important;
  }
  .s_pt200 {
    padding-top: 200px !important;
  }
  .s_pt250 {
    padding-top: 250px !important;
  }
  .s_pt300 {
    padding-top: 300px !important;
  }

  .s_pb0 {
    padding-bottom: 0px !important;
  }
  .s_pb5 {
    padding-bottom: 5px !important;
  }
  .s_pb10 {
    padding-bottom: 10px !important;
  }
  .s_pb20 {
    padding-bottom: 20px !important;
  }
  .s_pb30 {
    padding-bottom: 30px !important;
  }
  .s_pb40 {
    padding-bottom: 40px !important;
  }
  .s_pb50 {
    padding-bottom: 50px !important;
  }
  .s_pb60 {
    padding-bottom: 60px !important;
  }
  .s_pb70 {
    padding-bottom: 70px !important;
  }
  .s_pb80 {
    padding-bottom: 80px !important;
  }
  .s_pb90 {
    padding-bottom: 90px !important;
  }
  .s_pb100 {
    padding-bottom: 100px !important;
  }
  .s_pb110 {
    padding-bottom: 110px !important;
  }
  .s_pb120 {
    padding-bottom: 120px !important;
  }
  .s_pb150 {
    padding-bottom: 150px !important;
  }
  .s_pb200 {
    padding-bottom: 200px !important;
  }
  .s_pb250 {
    padding-bottom: 250px !important;
  }
  .s_pb300 {
    padding-bottom: 300px !important;
  }
  .s_pr0{
    padding-right: 0 !important;
  }
  .s_pr5{
    padding-right: 5px !important;
  }
  .s_pr10{
    padding-right: 10px !important;
  }
  .s_pr20{
    padding-right: 20px !important;
  }
  .s_pr30{
    padding-right: 30px !important;
  }
  .s_pr40{
    padding-right: 40px !important;
  }
  .s_pr50{
    padding-right: 50px !important;
  }
  .s_pl0{
    padding-left: 0 !important;
  }
  .s_pl5{
    padding-left: 5px !important;
  }
  .s_pl10{
    padding-left: 10px !important;
  }
  .s_pl20{
    padding-left: 20px !important;
  }
  .s_pl30{
    padding-left: 30px !important;
  }
  .s_pl40{
    padding-left: 40px !important;
  }
  .s_pl50{
    padding-left: 50px !important;
  }
}

@media screen and (max-width: 500px) {
  /* サイズxsとする　*/
  .xs_pt0 {
    padding-top: 0px !important;
  }
  .xs_pt5 {
    padding-top: 5px !important;
  }
  .xs_pt10 {
    padding-top: 10px !important;
  }
  .xs_pt20 {
    padding-top: 20px !important;
  }
  .xs_pt30 {
    padding-top: 30px !important;
  }
  .xs_pt40 {
    padding-top: 40px !important;
  }
  .xs_pt50 {
    padding-top: 50px !important;
  }
  .xs_pt60 {
    padding-top: 60px !important;
  }
  .xs_pt70 {
    padding-top: 70px !important;
  }
  .xs_pt80 {
    padding-top: 80px !important;
  }
  .xs_pt90 {
    padding-top: 90px !important;
  }
  .xs_pt100 {
    padding-top: 100px !important;
  }
  .xs_pt110 {
    padding-top: 110px !important;
  }
  .xs_pt120 {
    padding-top: 120px !important;
  }
  .xs_pt150 {
    padding-top: 150px !important;
  }
  .xs_pt200 {
    padding-top: 200px !important;
  }
  .xs_pt250 {
    padding-top: 250px !important;
  }
  .xs_pt300 {
    padding-top: 300px !important;
  }

  .xs_pb0 {
    padding-bottom: 0px !important;
  }
  .xs_pb5 {
    padding-bottom: 5px !important;
  }
  .xs_pb10 {
    padding-bottom: 10px !important;
  }
  .xs_pb20 {
    padding-bottom: 20px !important;
  }
  .xs_pb30 {
    padding-bottom: 30px !important;
  }
  .xs_pb40 {
    padding-bottom: 40px !important;
  }
  .xs_pb50 {
    padding-bottom: 50px !important;
  }
  .xs_pb60 {
    padding-bottom: 60px !important;
  }
  .xs_pb70 {
    padding-bottom: 70px !important;
  }
  .xs_pb80 {
    padding-bottom: 80px !important;
  }
  .xs_pb90 {
    padding-bottom: 90px !important;
  }
  .xs_pb100 {
    padding-bottom: 100px !important;
  }
  .xs_pb110 {
    padding-bottom: 110px !important;
  }
  .xs_pb120 {
    padding-bottom: 120px !important;
  }
  .xs_pb150 {
    padding-bottom: 150px !important;
  }
  .xs_pb200 {
    padding-bottom: 200px !important;
  }
  .xs_pb250 {
    padding-bottom: 250px !important;
  }
  .xs_pb300 {
    padding-bottom: 300px !important;
  }
  .xs_pr0{
    padding-right: 0 !important;
  }
  .xs_pr5{
    padding-right: 5px !important;
  }
  .xs_pr10{
    padding-right: 10px !important;
  }
  .xs_pr20{
    padding-right: 20px !important;
  }
  .xs_pr30{
    padding-right: 30px !important;
  }
  .xs_pr40{
    padding-right: 40px !important;
  }
  .xs_pr50{
    padding-right: 50px !important;
  }
  .xs_pl0{
    padding-left: 0 !important;
  }
  .xs_pl5{
    padding-left: 5px !important;
  }
  .xs_pl10{
    padding-left: 10px !important;
  }
  .xs_pl20{
    padding-left: 20px !important;
  }
  .xs_pl30{
    padding-left: 30px !important;
  }
  .xs_pl40{
    padding-left: 40px !important;
  }
  .xs_pl50{
    padding-left: 50px !important;
  }
}


/* =========== paddingの指定ここまで =========== */




/*============ アニメーションここから ===========*/

/* スクロールがトリガー&下から表示 */
.scroll_bottom_show{
  opacity: 0;
  transition-duration: 800ms;
  transition-property: opacity, transform;
  transform: translate(0, 50px);
  transition-timing-function:ease;
}

/* スクロールがトリガー&その場で表示 */
.scroll_fade_sllow_show{
  opacity: 0;
  transition-duration: 800ms;
  transition-property: opacity, transform;
  transform: translate(0, 0);
  transition-timing-function:ease;
}

/* ロードがトリガー&下から表示 */
.scroll_bottom_show_load{
  opacity: 0;
  transition-duration: 800ms;
  transition-property: opacity, transform;
  transform: translate(0, 50px);
  transition-timing-function:ease;
}

.fade_bottom_show{
  opacity: 0;
  transition-duration: 800ms;
  transition-property: opacity, transform;
  /* transform: translate(0, 50px); */
  transition-timing-function:ease;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
	  transform: translateY(100px);
  }

  to {
    opacity: 1;
	  transform: translateY(0);
  }
}

.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
}

.fade-show{
  opacity: 0;
  transition-duration: 800ms;
  transition-property: opacity, transform;
  transition-timing-function:ease;
}

.fade-in {
  opacity: 1;
  transition-duration: 800ms;
}

/*============ アニメーションここまで ===========*/




/*============ <br>がかかるサイズ指定ここから ===========*/
.br-u1200,.br-u1100,.br-u1000,.br-u900,.br-u834,.br-u640,.br-u500,.br-u400{
  display: none;
}
@media screen and (max-width: 1200px) {
.br-u1200{
  display: inline-block;
}
}
@media screen and (max-width: 1100px) {
.br-u1100{
  display: inline-block;
}
}
@media screen and (max-width: 1000px) {
.br-u1000{
  display: inline-block;
}
}
@media screen and (max-width: 900px) {
.br-u900{
  display: inline-block;
}
}
@media screen and (max-width: 834px) {
.br-u834{
  display: inline-block;
}
}
@media screen and (max-width: 640px) {
.br-u640{
  display: inline-block;
}
}
@media screen and (max-width: 500px) {
.br-u500{
  display: inline-block;
}
}
@media screen and (max-width: 400px) {
.br-u400{
  display: inline-block;
}
}
/*============ <br>がかかるサイズ指定ここまで ===========*/



/*============ flexの指定ここから ===========*/
.base__flex{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
/* 2行以上のflexの場合は.justify-content-flex-startをつける */
.justify-content-flex-start{
  justify-content: flex-start;
}
.justify-content-space-around{
  justify-content: space-around;
}
.justify-content-flex-end{
  justify-content: flex-end;
}
.justify-content-center{
  justify-content: center;
}
.align-items-center{
  align-items: center;
}
.align-items-flex-start{
  align-items: flex-start;
}
.align-items-flex-end{
  align-items: flex-end;
}
.flex-direction-row{
  flex-direction: row;
}
.flex-direction-row-reverse{
  flex-direction: row-reverse;
}
.flex-direction-column{
  flex-direction: column;
}
.flex-direction-column-reverse{
  flex-direction: column-reverse;
}

.base__flex-item{
  width: 48.5%;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.justify-content-flex-start .base__flex-item{
  margin-right: 3%;
  margin-bottom: 40px;
}
.justify-content-flex-start .base__flex-item:nth-of-type(2n){
  margin-right: 0;
}

.base__flex-50p-item{
  width: 50%;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.base__flex-3column-item{
  width: 31%;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.justify-content-flex-start .base__flex-3column-item{
  margin-right: 3.5%;
  margin-bottom: 40px;
}
.justify-content-flex-start .base__flex-3column-item:nth-of-type(3n){
  margin-right: 0;
}

.base__flex-4column-item{
  width: 23%;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.justify-content-flex-start .base__flex-4column-item{
  margin-right: 2.666%;
  margin-bottom: 40px;
}
.justify-content-flex-start .base__flex-4column-item:nth-of-type(4n){
  margin-right: 0;
}

.base__flex-5column-item{
  width: 18.5%;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.justify-content-flex-start .base__flex-5column-item{
  margin-right: 1.875%;
  margin-bottom: 40px;
}
.justify-content-flex-start .base__flex-5column-item:nth-of-type(5n){
  margin-right: 0;
}

.base__flex-6column-item{
  width: 16%;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.justify-content-flex-start .base__flex-6column-item{
  margin-right: 0.8%;
  margin-bottom: 40px;
}
.justify-content-flex-start .base__flex-6column-item:nth-of-type(5n){
  margin-right: 0;
}

@media screen and (max-width: 834px) {
.base__flex{
  flex-direction: column;
}
.base__flex-item,
.base__flex-50p-item,
.base__flex-3column-item,
.base__flex-4column-item,
.base__flex-5column-item,
.base__flex-6column-item{
  width: 100%;
  margin-bottom: 30px;
}
.base__flex-item:last-of-type,
.base__flex-50p-item:last-of-type,
.base__flex-3column-item:last-of-type,
.base__flex-4column-item:last-of-type,
.base__flex-5column-item:last-of-type,
.base__flex-6column-item:last-of-type{
  margin-bottom: 0;
}
.justify-content-flex-start .base__flex-item,
.justify-content-flex-start .base__flex-50p-item,
.justify-content-flex-start .base__flex-3column-item,
.justify-content-flex-start .base__flex-4column-item,
.justify-content-flex-start .base__flex-5column-item,
.justify-content-flex-start .base__flex-6column-item{
  margin-right: 0;
  margin-bottom: 30px;
}
.justify-content-flex-start .base__flex-item:last-of-type,
.justify-content-flex-start .base__flex-50p-item:last-of-type,
.justify-content-flex-start .base__flex-3column-item:last-of-type,
.justify-content-flex-start .base__flex-4column-item:last-of-type,
.justify-content-flex-start .base__flex-5column-item:last-of-type,
.justify-content-flex-start .base__flex-6column-item:last-of-type{
  margin-bottom: 0;
}
.s_justify-content-flex-start{
  justify-content: flex-start;
}
.s_justify-content-space-around{
  justify-content: space-around;
}
.s_justify-content-flex-end{
  justify-content: flex-end;
}
.s_justify-content-center{
  justify-content: center;
}
.s_align-items-center{
  align-items: center;
}
.s_align-items-flex-start{
  align-items: flex-start;
}
.s_align-items-flex-end{
  align-items: flex-end;
}
.s_flex-direction-row{
  flex-direction: row;
}
.s_flex-direction-row-reverse{
  flex-direction: row-reverse;
}
.s_flex-direction-column{
  flex-direction: column;
}
.s_flex-direction-column-reverse{
  flex-direction: column-reverse;
}
}

/*============ flexの指定ここまで ===========*/



/*============ 浮いたタイトル ===========*/

.flow-top-title{
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%,-50%);
  background-color: #222;
  color: #fff;
  border-radius: 50px;
  width: fit-content;
  padding: 5px 20px;
  white-space: nowrap;
}

.flow-bottom-title{
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate(-50%,50%);
  background-color: #222;
  color: #fff;
  border-radius: 50px;
  width: fit-content;
  padding: 5px 20px;
  white-space: nowrap;
}

/*============ SP時スライダー画像 ===========*/
@media screen and (max-width: 834px) {
  .slider-bl{
    overflow-x: scroll;
    padding-bottom: 30px;
    margin-bottom: 10px;
  }

  .slider-img{
    width: 800px;
  }
}

@media screen and (max-width: 500px) {
  .slider-bl{
    padding-bottom: 20px;
  }
  .slider-img{
    width: 600px;
  }
}