@charset "utf-8";
/*
  Theme Name: fuminoha camera
  Author: Chibariyo
  Author URI: https://chibariyo.okinawa/
  Description: fuminoha camera
*/




/*======================================

  ------------------------------------
    カラー
  ------------------------------------

    Main       : #
    Accent     : #
    Base       : #

  ------------------------------------
    フォント
  ------------------------------------

    * 
    *

  ------------------------------------
    構造
  ------------------------------------

    1. 基本
    2. header
    3. main
    4. footer
    5. contact
    6. 各ページ

  ------------------------------------
    ログ
  ------------------------------------

    2023/09/12 : 開始
    2023/09/XX : 
    2023/09/XX : 
    2023/09/XX : 
    2023/09/XX : 
    2023/09/XX : 

======================================*/




/*======================================

  1. 基本

======================================*/

/*
  要素
======================================*/

*,
*::before,
*::after {
  box-sizing: inherit;
}
html {
  box-sizing: border-box;
  color: #21646F;
  font-family: 'Shippori Mincho', serif;
  font-size: calc(100vw / 153.6);
}
h1, h2, h3, h4, h5, h6, ul, p {
  margin: 0;
}
p {
  text-align: justify;
}
a {
  color: #21646F;
  text-decoration: none;
}
img {
  width: 100%;
  vertical-align: bottom;
}
.wrap {
  overflow: hidden;
  background-image: url('../img/cmn/bg-all.jpg');
  background-size: 100%;
}
@media screen and (max-width: 1024px) {
  .wrap {
    overflow: hidden;
    background-image: url('../img/cmn/bg-all-sp.jpg');
    background-size: 100%;
  }
}

/* webview */
.webview {
  padding: 0 !important;
}

.wv_inner{
  padding: auto;
}


/*
  inner
======================================*/

/* inner-1140 */
.inner-1140 {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 20px;
}

/* inner-800 */
.inner-800 {
  max-width: 800px;
  margin: 0 auto;
}




/*
  color
======================================*/

.clr-gray {
  color: #606060;
}




/*
  font-family
======================================*/

.ff-sm {
  font-family: 'Shippori Mincho', serif !important;
}
.ff-b {
  font-family: 'Barlow', sans-serif !important;
}
.ff-nsj {
  font-family: 'Noto Sans JP', sans-serif !important;
}




/*
  width
======================================*/

.w200 {
  min-width: 200px !important;
  width: 200px !important;
}
.w100p {
  width: 100% !important;
}
@media screen and (max-width: 1024px) {
  .w200-sp {
    min-width: 200px !important;
    width: 200px !important;
  }
  .w100p-sp {
    width: 100% !important;
  }
}




/*
  height
======================================*/

.h100p {
  height: 100%;
}




/*
  line-height
======================================*/

.lh-100 {
  line-height: 1;
}
.lh-125 {
  line-height: 1.25;
}
.lh-150 {
  line-height: 1.5;
}
.lh-175 {
  line-height: 1.75;
}
.lh-200 {
  line-height: 2;
}




/*
  position
======================================*/

.p-r {
  position: relative;
}




/*
  border
======================================*/

.b-t { border-top: none !important; }
.b-r { border-right: none !important; }
.b-b { border-bottom: none !important; }
.b-l { border-left: none !important; }
@media screen and (max-width: 1024px) {
  .b-t-sp { border-top: none !important; }
  .b-r-sp { border-right: none !important; }
  .b-b-sp { border-bottom: none !important; }
  .b-l-sp { border-left: none !important; }
}




/*
  flex
======================================*/

.flex { display: flex; }
.flex-pc { display: flex; }

/* ■ 値 */
.fd-r { flex-direction: row; }
.fd-rr { flex-direction: row-reverse; }
.fd-c { flex-direction: column; }
.fd-cr { flex-direction: column-reverse; }
.fw-n { flex-wrap: nowrap; }
.fw-w { flex-wrap: wrap; }
.fw-wr { flex-wrap: wrap-reverse; }
.jc-fs { justify-content: flex-start; }
.jc-fe { justify-content: flex-end; }
.jc-c { justify-content: center; }
.jc-sb { justify-content: space-between; }
.jc-sa { justify-content: space-around; }
.ai-s { align-items: stretch; }
.ai-fs { align-items: flex-start; }
.ai-fe { align-items: flex-end; }
.ai-c { align-items: center; }
.ai-b { align-items: baseline; }
.ac-s { align-content: stretch; }
.ac-fs { align-content: flex-start; }
.ac-fe { align-content: flex-end; }
.ac-c { align-content: center; }
.ac-sb { align-content: space-between; }
.ac-sa { align-content: space-around; }
@media screen and (max-width: 1024px) {
  .flex-pc { display: block; }
  .flex-sp { display: flex; }

  /* ■ 値 */
  .fd-r-sp { flex-direction: row; }
  .fd-rr-sp { flex-direction: row-reverse; }
  .fd-c-sp { flex-direction: column; }
  .fd-cr-sp { flex-direction: column-reverse; }
  .fw-n-sp { flex-wrap: nowrap; }
  .fw-w-sp { flex-wrap: wrap; }
  .fw-wr-sp { flex-wrap: wrap-reverse; }
  .jc-fs-sp { justify-content: flex-start; }
  .jc-fe-sp { justify-content: flex-end; }
  .jc-c-sp { justify-content: center; }
  .jc-sb-sp { justify-content: space-between; }
  .jc-sa-sp { justify-content: space-around; }
  .ai-s-sp { align-items: stretch; }
  .ai-fs-sp { align-items: flex-start; }
  .ai-fe-sp { align-items: flex-end; }
  .ai-c-sp { align-items: center; }
  .ai-b-sp { align-items: baseline; }
  .ac-s-sp { align-content: stretch; }
  .ac-fs-sp { align-content: flex-start; }
  .ac-fe-sp { align-content: flex-end; }
  .ac-c-sp { align-content: center; }
  .ac-sb-sp { align-content: space-between; }
  .ac-sa-sp { align-content: space-around; }
}




/*
  表示/非表示/pcのみ表示/spのみ表示
======================================*/

.dp-b {
  display: block;
}
.dp-n {
  display: none;
}
.spview {
  display: none;
}
@media screen and (max-width: 1024px) {
  .pcview {
    display: none;
  }
  .spview {
    display: block;
  }
}




/*
  margin
======================================*/

/* ■ margin (auto) */
.mt-a { margin-top: auto !important; }
.mb-a { margin-bottom: auto !important; }
.mr-a { margin-right: auto !important; }
.ml-a { margin-left: auto !important; }

/* ■ margin-top */
.mt0 { margin-top: 0 !important; }
.mt5 { margin-top: 5px !important; }
.mt10 { margin-top: 10px !important; }
.mt15 { margin-top: 15px !important; }
.mt20 { margin-top: 20px !important; }
.mt25 { margin-top: 25px !important; }
.mt30 { margin-top: 30px !important; }
.mt35 { margin-top: 35px !important; }
.mt40 { margin-top: 40px !important; }
.mt45 { margin-top: 45px !important; }
.mt50 { margin-top: 50px !important; }
.mt55 { margin-top: 55px !important; }
.mt60 { margin-top: 60px !important; }
.mt65 { margin-top: 65px !important; }
.mt70 { margin-top: 70px !important; }
.mt75 { margin-top: 75px !important; }
.mt80 { margin-top: 80px !important; }
.mt85 { margin-top: 85px !important; }
.mt90 { margin-top: 90px !important; }
.mt95 { margin-top: 95px !important; }
.mt100 { margin-top: 100px !important; }
.mt105 { margin-top: 105px !important; }
.mt110 { margin-top: 110px !important; }
.mt115 { margin-top: 115px !important; }
.mt120 { margin-top: 120px !important; }

/* ■ margin-bottom */
.mb0 { margin-bottom: 0 !important; }
.mb5 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb35 { margin-bottom: 35px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb45 { margin-bottom: 45px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb55 { margin-bottom: 55px !important; }
.mb60 { margin-bottom: 60px !important; }
.mb65 { margin-bottom: 65px !important; }
.mb70 { margin-bottom: 70px !important; }
.mb75 { margin-bottom: 75px !important; }
.mb80 { margin-bottom: 80px !important; }
.mb85 { margin-bottom: 85px !important; }
.mb90 { margin-bottom: 90px !important; }
.mb95 { margin-bottom: 95px !important; }
.mb100 { margin-bottom: 100px !important; }
.mb105 { margin-bottom: 105px !important; }
.mb110 { margin-bottom: 110px !important; }
.mb115 { margin-bottom: 115px !important; }
.mb120 { margin-bottom: 120px !important; }

/* ■ margin-right */
.mr0 { margin-right: 0 !important; }
.mr5 { margin-right: 5px !important; }
.mr10 { margin-right: 10px !important; }
.mr15 { margin-right: 15px !important; }
.mr20 { margin-right: 20px !important; }
.mr25 { margin-right: 25px !important; }
.mr30 { margin-right: 30px !important; }
.mr35 { margin-right: 35px !important; }
.mr40 { margin-right: 40px !important; }
.mr45 { margin-right: 45px !important; }
.mr50 { margin-right: 50px !important; }
.mr55 { margin-right: 55px !important; }
.mr60 { margin-right: 60px !important; }
.mr65 { margin-right: 65px !important; }
.mr70 { margin-right: 70px !important; }
.mr75 { margin-right: 75px !important; }
.mr80 { margin-right: 80px !important; }
.mr85 { margin-right: 85px !important; }
.mr90 { margin-right: 90px !important; }
.mr95 { margin-right: 95px !important; }
.mr100 { margin-right: 100px !important; }
.mr105 { margin-right: 105px !important; }
.mr110 { margin-right: 110px !important; }
.mr115 { margin-right: 115px !important; }
.mr120 { margin-right: 120px !important; }

/* ■ margin-left */
.ml0 { margin-left: 0 !important; }
.ml5 { margin-left: 5px !important; }
.ml10 { margin-left: 10px !important; }
.ml15 { margin-left: 15px !important; }
.ml20 { margin-left: 20px !important; }
.ml25 { margin-left: 25px !important; }
.ml30 { margin-left: 30px !important; }
.ml35 { margin-left: 35px !important; }
.ml40 { margin-left: 40px !important; }
.ml45 { margin-left: 45px !important; }
.ml50 { margin-left: 50px !important; }
.ml55 { margin-left: 55px !important; }
.ml60 { margin-left: 60px !important; }
.ml65 { margin-left: 65px !important; }
.ml70 { margin-left: 70px !important; }
.ml75 { margin-left: 75px !important; }
.ml80 { margin-left: 80px !important; }
.ml85 { margin-left: 85px !important; }
.ml90 { margin-left: 90px !important; }
.ml95 { margin-left: 95px !important; }
.ml100 { margin-left: 100px !important; }
.ml105 { margin-left: 105px !important; }
.ml110 { margin-left: 110px !important; }
.ml115 { margin-left: 115px !important; }
.ml120 { margin-left: 120px !important; }
@media screen and (max-width: 1024px) {
  /* ■ margin (auto) */
  .mt-a-sp { margin-top: auto !important; }
  .mb-a-sp { margin-bottom: auto !important; }
  .mr-a-sp { margin-right: auto !important; }
  .ml-a-sp { margin-left: auto !important; }

  /* ■ margin-top */
  .mt0-sp { margin-top: 0 !important; }
  .mt5-sp { margin-top: 5px !important; }
  .mt10-sp { margin-top: 10px !important; }
  .mt15-sp { margin-top: 15px !important; }
  .mt20-sp { margin-top: 20px !important; }
  .mt25-sp { margin-top: 25px !important; }
  .mt30-sp { margin-top: 30px !important; }
  .mt35-sp { margin-top: 35px !important; }
  .mt40-sp { margin-top: 40px !important; }
  .mt45-sp { margin-top: 45px !important; }
  .mt50-sp { margin-top: 50px !important; }
  .mt55-sp { margin-top: 55px !important; }
  .mt60-sp { margin-top: 60px !important; }
  .mt65-sp { margin-top: 65px !important; }
  .mt70-sp { margin-top: 70px !important; }
  .mt75-sp { margin-top: 75px !important; }
  .mt80-sp { margin-top: 80px !important; }
  .mt85-sp { margin-top: 85px !important; }
  .mt90-sp { margin-top: 90px !important; }
  .mt95-sp { margin-top: 95px !important; }
  .mt100-sp { margin-top: 100px !important; }
  .mt105-sp { margin-top: 105px !important; }
  .mt110-sp { margin-top: 110px !important; }
  .mt115-sp { margin-top: 115px !important; }
  .mt120-sp { margin-top: 120px !important; }

  /* ■ margin-bottom */
  .mb0-sp { margin-bottom: 0 !important; }
  .mb5-sp { margin-bottom: 5px !important; }
  .mb10-sp { margin-bottom: 10px !important; }
  .mb15-sp { margin-bottom: 15px !important; }
  .mb20-sp { margin-bottom: 20px !important; }
  .mb25-sp { margin-bottom: 25px !important; }
  .mb30-sp { margin-bottom: 30px !important; }
  .mb35-sp { margin-bottom: 35px !important; }
  .mb40-sp { margin-bottom: 40px !important; }
  .mb45-sp { margin-bottom: 45px !important; }
  .mb50-sp { margin-bottom: 50px !important; }
  .mb55-sp { margin-bottom: 55px !important; }
  .mb60-sp { margin-bottom: 60px !important; }
  .mb65-sp { margin-bottom: 65px !important; }
  .mb70-sp { margin-bottom: 70px !important; }
  .mb75-sp { margin-bottom: 75px !important; }
  .mb80-sp { margin-bottom: 80px !important; }
  .mb85-sp { margin-bottom: 85px !important; }
  .mb90-sp { margin-bottom: 90px !important; }
  .mb95-sp { margin-bottom: 95px !important; }
  .mb100-sp { margin-bottom: 100px !important; }
  .mb105-sp { margin-bottom: 105px !important; }
  .mb110-sp { margin-bottom: 110px !important; }
  .mb115-sp { margin-bottom: 115px !important; }
  .mb120-sp { margin-bottom: 120px !important; }

  /* ■ margin-right */
  .mr0-sp { margin-right: 0 !important; }
  .mr5-sp { margin-right: 5px !important; }
  .mr10-sp { margin-right: 10px !important; }
  .mr15-sp { margin-right: 15px !important; }
  .mr20-sp { margin-right: 20px !important; }
  .mr25-sp { margin-right: 25px !important; }
  .mr30-sp { margin-right: 30px !important; }
  .mr35-sp { margin-right: 35px !important; }
  .mr40-sp { margin-right: 40px !important; }
  .mr45-sp { margin-right: 45px !important; }
  .mr50-sp { margin-right: 50px !important; }
  .mr55-sp { margin-right: 55px !important; }
  .mr60-sp { margin-right: 60px !important; }
  .mr65-sp { margin-right: 65px !important; }
  .mr70-sp { margin-right: 70px !important; }
  .mr75-sp { margin-right: 75px !important; }
  .mr80-sp { margin-right: 80px !important; }
  .mr85-sp { margin-right: 85px !important; }
  .mr90-sp { margin-right: 90px !important; }
  .mr95-sp { margin-right: 95px !important; }
  .mr100-sp { margin-right: 100px !important; }
  .mr105-sp { margin-right: 105px !important; }
  .mr110-sp { margin-right: 110px !important; }
  .mr115-sp { margin-right: 115px !important; }
  .mr120-sp { margin-right: 120px !important; }

  /* ■ margin-left */
  .ml0-sp { margin-left: 0 !important; }
  .ml5-sp { margin-left: 5px !important; }
  .ml10-sp { margin-left: 10px !important; }
  .ml15-sp { margin-left: 15px !important; }
  .ml20-sp { margin-left: 20px !important; }
  .ml25-sp { margin-left: 25px !important; }
  .ml30-sp { margin-left: 30px !important; }
  .ml35-sp { margin-left: 35px !important; }
  .ml40-sp { margin-left: 40px !important; }
  .ml45-sp { margin-left: 45px !important; }
  .ml50-sp { margin-left: 50px !important; }
  .ml55-sp { margin-left: 55px !important; }
  .ml60-sp { margin-left: 60px !important; }
  .ml65-sp { margin-left: 65px !important; }
  .ml70-sp { margin-left: 70px !important; }
  .ml75-sp { margin-left: 75px !important; }
  .ml80-sp { margin-left: 80px !important; }
  .ml85-sp { margin-left: 85px !important; }
  .ml90-sp { margin-left: 90px !important; }
  .ml95-sp { margin-left: 95px !important; }
  .ml100-sp { margin-left: 100px !important; }
  .ml105-sp { margin-left: 105px !important; }
  .ml110-sp { margin-left: 110px !important; }
  .ml115-sp { margin-left: 115px !important; }
  .ml120-sp { margin-left: 120px !important; }
}




/*
  padding
======================================*/

/* ■ padding-top */
.pt0 { padding-top: 0 !important; }
.pt5 { padding-top: 5px !important; }
.pt10 { padding-top: 10px !important; }
.pt15 { padding-top: 15px !important; }
.pt20 { padding-top: 20px !important; }
.pt25 { padding-top: 25px !important; }
.pt30 { padding-top: 30px !important; }
.pt35 { padding-top: 35px !important; }
.pt40 { padding-top: 40px !important; }
.pt45 { padding-top: 45px !important; }
.pt50 { padding-top: 50px !important; }
.pt55 { padding-top: 55px !important; }
.pt60 { padding-top: 60px !important; }
.pt65 { padding-top: 65px !important; }
.pt70 { padding-top: 70px !important; }
.pt75 { padding-top: 75px !important; }
.pt80 { padding-top: 80px !important; }
.pt85 { padding-top: 85px !important; }
.pt90 { padding-top: 90px !important; }
.pt95 { padding-top: 95px !important; }
.pt100 { padding-top: 100px !important; }
.pt105 { padding-top: 105px !important; }
.pt110 { padding-top: 110px !important; }
.pt115 { padding-top: 115px !important; }
.pt120 { padding-top: 120px !important; }

/* ■ padding-bottom */
.pb0 { padding-bottom: 0 !important; }
.pb5 { padding-bottom: 5px !important; }
.pb10 { padding-bottom: 10px !important; }
.pb15 { padding-bottom: 15px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb25 { padding-bottom: 25px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb35 { padding-bottom: 35px !important; }
.pb40 { padding-bottom: 40px !important; }
.pb45 { padding-bottom: 45px !important; }
.pb50 { padding-bottom: 50px !important; }
.pb55 { padding-bottom: 55px !important; }
.pb60 { padding-bottom: 60px !important; }
.pb65 { padding-bottom: 65px !important; }
.pb70 { padding-bottom: 70px !important; }
.pb75 { padding-bottom: 75px !important; }
.pb80 { padding-bottom: 80px !important; }
.pb85 { padding-bottom: 85px !important; }
.pb90 { padding-bottom: 90px !important; }
.pb95 { padding-bottom: 95px !important; }
.pb100 { padding-bottom: 100px !important; }
.pb105 { padding-bottom: 105px !important; }
.pb110 { padding-bottom: 110px !important; }
.pb115 { padding-bottom: 115px !important; }
.pb120 { padding-bottom: 120px !important; }

/* ■ padding-right */
.pr0 { padding-right: 0 !important; }
.pr5 { padding-right: 5px !important; }
.pr10 { padding-right: 10px !important; }
.pr15 { padding-right: 15px !important; }
.pr20 { padding-right: 20px !important; }
.pr25 { padding-right: 25px !important; }
.pr30 { padding-right: 30px !important; }
.pr35 { padding-right: 35px !important; }
.pr40 { padding-right: 40px !important; }
.pr45 { padding-right: 45px !important; }
.pr50 { padding-right: 50px !important; }
.pr55 { padding-right: 55px !important; }
.pr60 { padding-right: 60px !important; }
.pr65 { padding-right: 65px !important; }
.pr70 { padding-right: 70px !important; }
.pr75 { padding-right: 75px !important; }
.pr80 { padding-right: 80px !important; }
.pr85 { padding-right: 85px !important; }
.pr90 { padding-right: 90px !important; }
.pr95 { padding-right: 95px !important; }
.pr100 { padding-right: 100px !important; }
.pr105 { padding-right: 105px !important; }
.pr110 { padding-right: 110px !important; }
.pr115 { padding-right: 115px !important; }
.pr120 { padding-right: 120px !important; }

/* ■ padding-left */
.pl0 { padding-left: 0 !important; }
.pl5 { padding-left: 5px !important; }
.pl10 { padding-left: 10px !important; }
.pl15 { padding-left: 15px !important; }
.pl20 { padding-left: 20px !important; }
.pl25 { padding-left: 25px !important; }
.pl30 { padding-left: 30px !important; }
.pl35 { padding-left: 35px !important; }
.pl40 { padding-left: 40px !important; }
.pl45 { padding-left: 45px !important; }
.pl50 { padding-left: 50px !important; }
.pl55 { padding-left: 55px !important; }
.pl60 { padding-left: 60px !important; }
.pl65 { padding-left: 65px !important; }
.pl70 { padding-left: 70px !important; }
.pl75 { padding-left: 75px !important; }
.pl80 { padding-left: 80px !important; }
.pl85 { padding-left: 85px !important; }
.pl90 { padding-left: 90px !important; }
.pl95 { padding-left: 95px !important; }
.pl100 { padding-left: 100px !important; }
.pl105 { padding-left: 105px !important; }
.pl110 { padding-left: 110px !important; }
.pl115 { padding-left: 115px !important; }
.pl120 { padding-left: 120px !important; }
@media screen and (max-width: 1024px) {
  /* ■ padding-top */
  .pt0-sp { padding-top: 0 !important; }
  .pt5-sp { padding-top: 5px !important; }
  .pt10-sp { padding-top: 10px !important; }
  .pt15-sp { padding-top: 15px !important; }
  .pt20-sp { padding-top: 20px !important; }
  .pt25-sp { padding-top: 25px !important; }
  .pt30-sp { padding-top: 30px !important; }
  .pt35-sp { padding-top: 35px !important; }
  .pt40-sp { padding-top: 40px !important; }
  .pt45-sp { padding-top: 45px !important; }
  .pt50-sp { padding-top: 50px !important; }
  .pt55-sp { padding-top: 55px !important; }
  .pt60-sp { padding-top: 60px !important; }
  .pt65-sp { padding-top: 65px !important; }
  .pt70-sp { padding-top: 70px !important; }
  .pt75-sp { padding-top: 75px !important; }
  .pt80-sp { padding-top: 80px !important; }
  .pt85-sp { padding-top: 85px !important; }
  .pt90-sp { padding-top: 90px !important; }

  /* ■ padding-bottom */
  .pb0-sp { padding-bottom: 0 !important; }
  .pb5-sp { padding-bottom: 5px !important; }
  .pb10-sp { padding-bottom: 10px !important; }
  .pb15-sp { padding-bottom: 15px !important; }
  .pb20-sp { padding-bottom: 20px !important; }
  .pb25-sp { padding-bottom: 25px !important; }
  .pb30-sp { padding-bottom: 30px !important; }
  .pb35-sp { padding-bottom: 35px !important; }
  .pb40-sp { padding-bottom: 40px !important; }
  .pb45-sp { padding-bottom: 45px !important; }
  .pb50-sp { padding-bottom: 50px !important; }
  .pb55-sp { padding-bottom: 55px !important; }
  .pb60-sp { padding-bottom: 60px !important; }
  .pb65-sp { padding-bottom: 65px !important; }
  .pb70-sp { padding-bottom: 70px !important; }
  .pb75-sp { padding-bottom: 75px !important; }
  .pb80-sp { padding-bottom: 80px !important; }
  .pb85-sp { padding-bottom: 85px !important; }
  .pb90-sp { padding-bottom: 90px !important; }

  /* ■ padding-right */
  .pr0-sp { padding-right: 0 !important; }
  .pr5-sp { padding-right: 5px !important; }
  .pr10-sp { padding-right: 10px !important; }
  .pr15-sp { padding-right: 15px !important; }
  .pr20-sp { padding-right: 20px !important; }
  .pr25-sp { padding-right: 25px !important; }
  .pr30-sp { padding-right: 30px !important; }
  .pr35-sp { padding-right: 35px !important; }
  .pr40-sp { padding-right: 40px !important; }
  .pr45-sp { padding-right: 45px !important; }
  .pr50-sp { padding-right: 50px !important; }
  .pr55-sp { padding-right: 55px !important; }
  .pr60-sp { padding-right: 60px !important; }
  .pr65-sp { padding-right: 65px !important; }
  .pr70-sp { padding-right: 70px !important; }
  .pr75-sp { padding-right: 75px !important; }
  .pr80-sp { padding-right: 80px !important; }
  .pr85-sp { padding-right: 85px !important; }
  .pr90-sp { padding-right: 90px !important; }

  /* ■ padding-left */
  .pl0-sp { padding-left: 0 !important; }
  .pl5-sp { padding-left: 5px !important; }
  .pl10-sp { padding-left: 10px !important; }
  .pl15-sp { padding-left: 15px !important; }
  .pl20-sp { padding-left: 20px !important; }
  .pl25-sp { padding-left: 25px !important; }
  .pl30-sp { padding-left: 30px !important; }
  .pl35-sp { padding-left: 35px !important; }
  .pl40-sp { padding-left: 40px !important; }
  .pl45-sp { padding-left: 45px !important; }
  .pl50-sp { padding-left: 50px !important; }
  .pl55-sp { padding-left: 55px !important; }
  .pl60-sp { padding-left: 60px !important; }
  .pl65-sp { padding-left: 65px !important; }
  .pl70-sp { padding-left: 70px !important; }
  .pl75-sp { padding-left: 75px !important; }
  .pl80-sp { padding-left: 80px !important; }
  .pl85-sp { padding-left: 85px !important; }
  .pl90-sp { padding-left: 90px !important; }
}




/*
  font-size
======================================*/

.fs10 { font-size: 10px !important; }
.fs11 { font-size: 11px !important; }
.fs12 { font-size: 12px !important; }
.fs13 { font-size: 13px !important; }
.fs14 { font-size: 14px !important; }
.fs15 { font-size: 15px !important; }
.fs16 { font-size: 16px !important; }
.fs17 { font-size: 17px !important; }
.fs18 { font-size: 18px !important; }
.fs19 { font-size: 19px !important; }
.fs20 { font-size: 20px !important; }
.fs21 { font-size: 21px !important; }
.fs22 { font-size: 22px !important; }
.fs23 { font-size: 23px !important; }
.fs24 { font-size: 24px !important; }
.fs25 { font-size: 25px !important; }
.fs26 { font-size: 26px !important; }
.fs27 { font-size: 27px !important; }
.fs28 { font-size: 28px !important; }
.fs29 { font-size: 29px !important; }
.fs30 { font-size: 30px !important; }
.fs31 { font-size: 31px !important; }
.fs32 { font-size: 32px !important; }
.fs33 { font-size: 33px !important; }
.fs34 { font-size: 34px !important; }
.fs35 { font-size: 35px !important; }
.fs36 { font-size: 36px !important; }
.fs37 { font-size: 37px !important; }
.fs38 { font-size: 38px !important; }
.fs39 { font-size: 39px !important; }
.fs40 { font-size: 40px !important; }
.fs41 { font-size: 41px !important; }
.fs42 { font-size: 42px !important; }
.fs43 { font-size: 43px !important; }
.fs44 { font-size: 44px !important; }
.fs45 { font-size: 45px !important; }
.fs46 { font-size: 46px !important; }
.fs47 { font-size: 47px !important; }
.fs48 { font-size: 48px !important; }
.fs49 { font-size: 49px !important; }
.fs50 { font-size: 50px !important; }
.fs51 { font-size: 51px !important; }
.fs52 { font-size: 52px !important; }
.fs53 { font-size: 53px !important; }
.fs54 { font-size: 54px !important; }
.fs55 { font-size: 55px !important; }
.fs56 { font-size: 56px !important; }
.fs57 { font-size: 57px !important; }
.fs58 { font-size: 58px !important; }
.fs59 { font-size: 59px !important; }
.fs60 { font-size: 60px !important; }
@media screen and (max-width: 1024px) {
  .fs10-sp { font-size: 10px !important; }
  .fs11-sp { font-size: 11px !important; }
  .fs12-sp { font-size: 12px !important; }
  .fs13-sp { font-size: 13px !important; }
  .fs14-sp { font-size: 14px !important; }
  .fs15-sp { font-size: 15px !important; }
  .fs16-sp { font-size: 16px !important; }
  .fs17-sp { font-size: 17px !important; }
  .fs18-sp { font-size: 18px !important; }
  .fs19-sp { font-size: 19px !important; }
  .fs20-sp { font-size: 20px !important; }
  .fs21-sp { font-size: 21px !important; }
  .fs22-sp { font-size: 22px !important; }
  .fs23-sp { font-size: 23px !important; }
  .fs24-sp { font-size: 24px !important; }
  .fs25-sp { font-size: 25px !important; }
  .fs26-sp { font-size: 26px !important; }
  .fs27-sp { font-size: 27px !important; }
  .fs28-sp { font-size: 28px !important; }
  .fs29-sp { font-size: 29px !important; }
  .fs30-sp { font-size: 30px !important; }
  .fs31-sp { font-size: 31px !important; }
  .fs32-sp { font-size: 32px !important; }
  .fs33-sp { font-size: 33px !important; }
  .fs34-sp { font-size: 34px !important; }
  .fs35-sp { font-size: 35px !important; }
  .fs36-sp { font-size: 36px !important; }
  .fs37-sp { font-size: 37px !important; }
  .fs38-sp { font-size: 38px !important; }
  .fs39-sp { font-size: 39px !important; }
  .fs40-sp { font-size: 40px !important; }
  .fs41-sp { font-size: 41px !important; }
  .fs42-sp { font-size: 42px !important; }
  .fs43-sp { font-size: 43px !important; }
  .fs44-sp { font-size: 44px !important; }
  .fs45-sp { font-size: 45px !important; }
  .fs46-sp { font-size: 46px !important; }
  .fs47-sp { font-size: 47px !important; }
  .fs48-sp { font-size: 48px !important; }
  .fs49-sp { font-size: 49px !important; }
  .fs50-sp { font-size: 50px !important; }
  .fs51-sp { font-size: 51px !important; }
  .fs52-sp { font-size: 52px !important; }
  .fs53-sp { font-size: 53px !important; }
  .fs54-sp { font-size: 54px !important; }
  .fs55-sp { font-size: 55px !important; }
  .fs56-sp { font-size: 56px !important; }
  .fs57-sp { font-size: 57px !important; }
  .fs58-sp { font-size: 58px !important; }
  .fs59-sp { font-size: 59px !important; }
  .fs60-sp { font-size: 60px !important; }
}




/*
  font-weight
======================================*/

.fw1 { font-weight: 100 !important; }
.fw2 { font-weight: 200 !important; }
.fw3 { font-weight: 300 !important; }
.fw4 { font-weight: 400 !important; }
.fw5 { font-weight: 500 !important; }
.fw6 { font-weight: 600 !important; }
.fw7 { font-weight: 700 !important; }
.fw8 { font-weight: 800 !important; }
.fw9 { font-weight: 900 !important; }
@media screen and (max-width: 1024px) {
  .fw1-sp { font-weight: 100 !important; }
  .fw2-sp { font-weight: 200 !important; }
  .fw3-sp { font-weight: 300 !important; }
  .fw4-sp { font-weight: 400 !important; }
  .fw5-sp { font-weight: 500 !important; }
  .fw6-sp { font-weight: 600 !important; }
  .fw7-sp { font-weight: 700 !important; }
  .fw8-sp { font-weight: 800 !important; }
  .fw9-sp { font-weight: 900 !important; }
}




/*
  text-align
======================================*/

.ta-j { text-align: justify !important; }
.ta-r { text-align: right !important; }
.ta-l { text-align: left !important; }
.ta-c { text-align: center !important; }
@media screen and (max-width: 1024px) {
  .ta-j-sp { text-align: justify !important; }
  .ta-r-sp { text-align: right !important; }
  .ta-l-sp { text-align: left !important; }
  .ta-c-sp { text-align: center !important; }
}




/*
  共通
======================================*/

/* ■ ページトップ */
.page-top {
  width: 60px;
  height: 64px;
  background-color: #21646F;
  border: 2px solid #21646F;
  border-right: none;
  border-radius: 10px 0 0 10px;
  position: fixed;
  bottom: 80px;
  right: 0;
  transition: .4s;
}
.page-top:hover {
  background-color: #ffffff;
}
.page-top svg {
  margin: 0 0 6px;
}
.page-top:hover svg rect {
  fill: #21646F;
}
.page-top span {
  font-family: 'Barlow', sans-serif;
  font-size: 10px;
  color: #ffffff;
}
.page-top:hover span {
  color: #21646F;
}
@media screen and (max-width: 1024px) {
.page-top {
    width: 50px;
    height: 50px;
    background-color: #21646F;
    border: 2px solid #21646F;
    border-right: none;
    border-radius: 10px 0 0 10px;
    position: fixed;
    bottom: 30px;
    right: 0;
    transition: .4s;
  }
  .page-top:hover {
    background-color: #ffffff;
  }
  .page-top svg {
    margin: 0 0 2px;
  }
  .page-top:hover svg rect {
    fill: #21646F;
  }
  .page-top span {
    font-family: 'Barlow', sans-serif;
    font-size: 10px;
    color: #ffffff;
  }
  .page-top:hover span {
    color: #21646F;
  }
}


/* ■ ナビゲーション */
#g-nav {
  position: fixed;
  top: 0;
  left: -460px;
  width: 460px;
  height: 100vh;
  background-color: #21646F;
  transition: all .8s;
}
#g-nav.panelactive {
  left: 80px;
}
#g-nav ul {
  height: 100%;
  padding: 0 0 0 75px;
  list-style-type: none;
}
#g-nav ul li {
  margin: 0 0 40px;
}
#g-nav ul li:last-child {
  margin: 0 0 0;
}
#g-nav ul li a {
  color: #ffffff;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: .15em;
}
#g-nav ul li a img {
  width: 24px;
  margin: 0 20px 0 0;
}
#g-nav ul li ul li:first-child {
  margin-top: 30px;
}
@media screen and (max-width: 1024px) {
  #g-nav {
    position: fixed;
    top: 0;
    right: -80%;
    left: auto;
    width: 80%;
    height: 100vh;
    background-color: #21646F;
    transition: all .8s;
  }
  #g-nav.panelactive {
    right: 0;
    left: auto;
  }
  #g-nav ul {
    height: 100%;
    padding: 0 0 0 60px;
    list-style-type: none;
  }
  #g-nav ul li {
    margin: 0 0 30px;
  }
  #g-nav ul li:last-child {
    margin: 0 0 0;
  }
  #g-nav ul li a {
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .15em;
  }
  #g-nav ul li a img {
    width: 24px;
    margin: 0 20px 0 0;
  }
  #g-nav ul li ul li:first-child {
    margin-top: 20px;
  }
}


/* ■ btn-list */
.btn-list .app-store {
  width: 148px;
  transition: .4s;
}
.btn-list .app-store:hover {
  opacity: .6;
}
.btn-list .google-play {
  width: 148px;
  transition: .4s;
}
.btn-list .google-play:hover {
  opacity: .6;
}
.btn-list .corporation {
  width: 25：：0px;
  background-color: #E8591F;
  border: 2px solid #E8591F;
  border-radius: 6px;
  transition: .4s;
}
.btn-list .corporation:hover {
  background-color: #ffffff;
}
.btn-list .corporation svg {
  margin: 0 5px 0 0;
}
.btn-list .corporation:hover svg rect {
  fill: #E8591F;
}
.btn-list .corporation p {
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
}
.btn-list .corporation:hover p {
  color: #E8591F;
}
@media screen and (max-width: 1024px) {
  .btn-list .app-store {
    width: 136px;
    transition: .4s;
  }
  .btn-list .app-store:hover {
    opacity: .6;
  }
  .btn-list .google-play {
    width: 136px;
    transition: .4s;
  }
  .btn-list .google-play:hover {
    opacity: .6;
  }
  .btn-list .corporation {
    width: 282px;
    padding: 8px 0;
    background-color: #E8591F;
    border: 2px solid #E8591F;
    border-radius: 6px;
    transition: .4s;
  }
  .btn-list .corporation:hover {
    background-color: #ffffff;
  }
  .btn-list .corporation svg {
    margin: 0 5px 0 0;
  }
  .btn-list .corporation:hover svg rect {
    fill: #E8591F;
  }
  .btn-list .corporation p {
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
  }
  .btn-list .corporation:hover p {
    color: #E8591F;
  }
}








/*======================================

  2. header

======================================*/

header {
  width: 80px;
  height: 100%;
  padding: 30px 0;
  border-right: 1px solid #F2F2F2;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #ffffff;
  z-index: 10;
}
header h1 {
  writing-mode: vertical-rl;
  margin: 0 0 25px;
}
header h1 .jp {
  display: block;
  margin: 0 0 10px;
  font-size: 19px;
  letter-spacing: .15em;
}
header h1 .en {
  display: block;
  font-family: 'Barlow', sans-serif;
  font-size: 10px;
  font-weight: 400;
  letter-spacing: .25em;
}
header .menu-btn {
  width: 25px;
  height: 25px;
  transition: .4s;
}
header .menu-btn:hover {
  cursor: pointer;
  opacity: .6;
}
header .copyright {
  writing-mode: vertical-rl;
  margin: auto 0 0;
  font-family: 'Barlow', sans-serif;
  font-size: 10px;
  letter-spacing: .25em;
}
@media screen and (max-width: 1024px) {
}








/*======================================

  3. main

======================================*/

/*
  共通
======================================*/

/* ■ main */
main {
  width: calc(100% - 80px);
  margin: 0 0 0 auto;
}
@media screen and (max-width: 1024px) {
  main {
    width: 100%;
    margin: 0 0 0 auto;
  }
}


/* ■ h1~h6 */
/* h-p1 */
main .h-p1 {
  min-width: 90px;
  width: 90px;
}
main .h-p1 .img-blk {
  margin: 0 0 10px;
}
main .h-p1 .txt-blk h2 {
  writing-mode: vertical-rl;
  padding: 0 0 0 10px;
}
main .h-p1 .txt-blk h2 .en {
  display: block;
  padding: 10px 0 0;
  font-family: 'Barlow', sans-serif;
  font-size: 10px;
  font-weight: 400;
  letter-spacing: .25em;
}
main .h-p1 .txt-blk h2 .jp {
  display: block;
  font-size: 33px;
  letter-spacing: .15em;
}
@media screen and (max-width: 1024px) {
  main .h-p1 {
    min-width: 42px;
    width: 42px;
  }
  main .h-p1 .img-blk {
    margin: 0 0 10px;
  }
  main .h-p1 .txt-blk h2 {
    writing-mode: vertical-rl;
    padding: 0 0 0 0;
  }
  main .h-p1 .txt-blk h2 .en {
    display: block;
    padding: 10px 0 0;
    font-family: 'Barlow', sans-serif;
    font-size: 10px;
    font-weight: 400;
    letter-spacing: .25em;
  }
  main .h-p1 .txt-blk h2 .jp {
    display: block;
    font-size: 22px;
    letter-spacing: .15em;
  }
}

/* h-p2 */
main .h-p2 {
  margin: 0 0 30px;
  padding: 0 0 20px;
  border-bottom: 2px solid #21646F;
}
main .h-p2 .article {
  margin: 0 15px 0 0;
  text-align: center;
}
main .h-p2 .article img {
  display: block;
  width: 52px;
  margin: 0 0 5px;
}
main .h-p2 .article span {
  display: block;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 18px;
  font-weight: 500;
}
main .h-p2 .h-p2-in {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 18px;
  font-weight: 500;
}
@media screen and (max-width: 1024px) {
  main .h-p2 {
    margin: 0 0 15px;
    padding: 0 0 15px;
    border-bottom: 2px solid #21646F;
  }
  main .h-p2 .article {
    margin: 0 15px 0 0;
    text-align: center;
  }
  main .h-p2 .article img {
    display: block;
    width: 40px;
    margin: 0 0 5px;
  }
  main .h-p2 .article span {
    display: block;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 14px;
    font-weight: 500;
  }
  main .h-p2 .h-p2-in {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    font-weight: 500;
  }
}

/* h-p2-faq */
main .h-p2-faq {
  padding: 25px 105px 25px 50px;
  background-color: #F9F9F9;
  position: relative;
}
main .h-p2-faq:hover {
  cursor: pointer;
}
main .h-p2-faq .article {
  margin: 0 15px 0 0;
  text-align: center;
}
main .h-p2-faq .article img {
  display: block;
  width: 52px;
  margin: 0 0 5px;
}
main .h-p2-faq .article span {
  display: block;
  font-family: 'Barlow', sans-serif;
  font-size: 20px;
}
main .h-p2-faq .h-p2-faq-in {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 18px;
  line-height: 1.5;
  font-weight: 500;
}
main .h-p2-faq .faq-oac {
  width: 25px;
  height: 25px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 50px;
  transition: .4s;
}
main .h-p2-faq:hover .faq-oac {
  opacity: .6;
}
main .h-p2-faq .faq-oac .vertical {
  display: block;
  content: '';
  width: 100%;
  height: 2px;
  background-color: #E8591F;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}
main .h-p2-faq .faq-oac .beside {
  height: 2px;
  top: 50%;
  transition: .4s;
}
main .h-p2-faq .faq-oac.open .beside {
  display: block;
  content: '';
  width: 2px;
  height: 100%;
  background-color: #E8591F;
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  left: 50%;
}
@media screen and (max-width: 1024px) {
  main .h-p2-faq {
    padding: 15px 60px 15px 25px;
    background-color: #F9F9F9;
  }
  main .h-p2-faq:hover {
    cursor: pointer;
  }
  main .h-p2-faq .article {
    margin: 0 15px 0 0;
    text-align: center;
  }
  main .h-p2-faq .article img {
    display: block;
    width: 40px;
    margin: 0 0 5px;
  }
  main .h-p2-faq .article span {
    display: block;
    font-family: 'Barlow', sans-serif;
    font-size: 15px;
  }
  main .h-p2-faq .h-p2-faq-in {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
  }
  main .h-p2-faq .faq-oac {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 25px;
    transition: .4s;
  }
  main .h-p2-faq:hover .faq-oac {
    opacity: .6;
  }
  main .h-p2-faq .faq-oac .vertical {
    display: block;
    content: '';
    width: 100%;
    height: 2px;
    background-color: #E8591F;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
  }
  main .h-p2-faq .faq-oac .beside {
    height: 2px;
    top: 50%;
    transition: .4s;
  }
  main .h-p2-faq .faq-oac.open .beside {
    display: block;
    content: '';
    width: 2px;
    height: 100%;
    background-color: #E8591F;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    left: 50%;
  }
}

/* h-p3 */
main .h-p3 {
  margin: 0 0 10px;
  padding: 0 0 0 14px;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  font-weight: 700;
  position: relative;
}
main .h-p3::before,
main .h-p3::after {
  display: block;
  content: '';
  width: 4px;
  height: 9px;
  position: absolute;
  left: 0;
}
main .h-p3::before {
  background-color: #B4D7D4;
  bottom: 50%;
}
main .h-p3::after {
  background-color: #21646F;
  top: 50%;
}
@media screen and (max-width: 1024px) {
}

/* h-p4 */
main .h-p4 {
  padding: 25px 70px;
  background-color: #F9F9F9;
}
main .h-p4 .year {
  font-family: 'Barlow', sans-serif;
  font-size: 12px;
}
main .h-p4 .moon-day {
  font-family: 'Barlow', sans-serif;
  font-size: 17px;
}
main .h-p4 .h-p4-in {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 18px;
  line-height: 1.5;
  font-weight: 500;
}
@media screen and (max-width: 1024px) {
  main .h-p4 {
    padding: 15px 25px;
    background-color: #F9F9F9;
  }
  main .h-p4 .year {
    font-family: 'Barlow', sans-serif;
    font-size: 12px;
  }
  main .h-p4 .moon-day {
    font-family: 'Barlow', sans-serif;
    font-size: 17px;
  }
  main .h-p4 .h-p4-in {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
  }
}

/* h-p5 */
main .h-p5 {
  margin: 0 0 25px;
  padding: 0 0 15px;
  border-bottom: 1px solid #B4D7D4;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 18px;
  line-height: 1.5;
  position: relative;
}
main .h-p5::after {
  display: block;
  content: '';
  width: 100px;
  height: 1px;
  background-color: #21646F;
  position: absolute;
  bottom: -1px;
  left: 0;
}
@media screen and (max-width: 1024px) {
}


/* ■ a */
/* a-p1 */
main .a-p1 {
  transition: .4s;
}
main .a-p1:hover {
  opacity: .6;
}
main .a-p1 span {
  writing-mode: vertical-rl;
  display: block;
  margin: 0 0 25px;
  color: #E8591F;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .25em;
}
@media screen and (max-width: 1024px) {
  main .a-p1 {
    transition: .4s;
  }
  main .a-p1:hover {
    opacity: .6;
  }
  main .a-p1 span {
    writing-mode: vertical-rl;
    display: block;
    margin: 0 0 15px;
    color: #E8591F;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: .25em;
  }
}

/* a-p2 */
main .a-p2 {
  text-align: center;
}
main .a-p2 a {
  display: inline-block;
  padding: 4px 20px;
  background-color: #E8591F;
  border: 2px solid #E8591F;
  border-radius: 6px;
  transition: .4s;
}
main .a-p2 a:hover {
  background-color: #ffffff;
}
main .a-p2 a p {
  color: #ffffff !important;
  font-size: 17px !important;
  font-weight: 500;
}
main .a-p2 a:hover p {
  color: #E8591F !important;
}
main .a-p2 a svg {
  margin: 0 0 0 10px;
}
main .a-p2 a:hover svg rect {
  fill: #E8591F;
}
@media screen and (max-width: 1024px) {
  main .a-p2 {
    text-align: center;
  }
  main .a-p2 a {
    display: inline-block;
    padding: 4px 18px;
    background-color: #E8591F;
    border: 2px solid #E8591F;
    border-radius: 6px;
    transition: .4s;
  }
  main .a-p2 a:hover {
    background-color: #ffffff;
  }
  main .a-p2 a p {
    color: #ffffff !important;
    font-size: 17px !important;
    font-weight: 500;
  }
  main .a-p2 a:hover p {
    color: #E8591F !important;
  }
  main .a-p2 a svg {
    margin: 0 0 0 10px;
  }
  main .a-p2 a:hover svg rect {
    fill: #E8591F;
  }
}


/* ■ ul */
/* ul-p1 */
main .ul-p1 {
  padding: 0;
}
main .ul-p1 li {
  margin: 0 0 20px;
}
main .ul-p1 li:last-child {
  margin: 0 0 0;
}
@media screen and (max-width: 1024px) {
  main .ul-p1 {
    padding: 0;
  }
  main .ul-p1 li {
    margin: 0 0 10px;
  }
  main .ul-p1 li:last-child {
    margin: 0 0 0;
  }
}


/* ■ ol */
/* ol-p1 */
main .ol-p1 {
  margin: 0;
  padding: 0;
  list-style-type: none;
  counter-reset: my-counter;
}
main .ol-p1 li {
  margin: 0 0 20px;
  padding: 0;
  color: #606060;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  line-height: 2;
  position: relative;
  list-style: none;
}
main .ol-p1 ol {
  padding-inline-start: 20px;
}
/* main .ol-p1 li:last-child {
  margin: 0 0 0;
} */
/* main .ol-p1 li::before {
  content: counter(my-counter);
  counter-increment: my-counter;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 16px;
  width: 16px;
  border: 1px solid #606060;
  border-radius: 50%;
  color: #606060;
  font-size: 14px;
  line-height: 1;
  position: absolute;
  top: 8px;
  left: 0;
} */
@media screen and (max-width: 1024px) {
  main .ol-p1 {
    margin: 0;
    padding: 0;
    list-style-type: none;
    counter-reset: my-counter;
  }
  main .ol-p1 li {
    margin: 0 0 15px;
    padding: 0;
    color: #606060;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    line-height: 2;
    position: relative;
    list-style: none;
  }
  main .ol-p1 ol {
    padding-inline-start: 20px;
  }
  /* main .ol-p1 li:last-child {
    margin: 0 0 0;
  } */
  /* main .ol-p1 li::before {
    content: counter(my-counter);
    counter-increment: my-counter;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 16px;
    width: 16px;
    border: 1px solid #606060;
    border-radius: 50%;
    color: #606060;
    font-size: 14px;
    line-height: 1;
    position: absolute;
    top: 8px;
    left: 0;
  } */
}

/* ol-p1 */
main .ol-p2 {
  margin: 0;
  padding: 0 0 0 20px;
}
main .ol-p2 li {
  margin: 0 0 25px;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  line-height: 2;
}
main .ol-p2 li:last-child {
  margin: 0 0 0;
}
main .ol-p2 li p {
  padding: 0 0 0 15px;
}
@media screen and (max-width: 1024px) {
  main .ol-p2 {
    margin: 0;
    padding: 0 0 0 20px;
  }
  main .ol-p2 li {
    margin: 0 0 10px;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    line-height: 2;
  }
  main .ol-p2 li:last-child {
    margin: 0 0 0;
  }
  main .ol-p2 li p {
    padding: 0 0 0 15px;
  }
}


/* ■ mv */
main .mv {
  margin: 0 0 60px;
  position: relative;
}
.page main .mv {
  margin: 0 0 0;
}
main .mv .mv-cont {
  position: absolute;
  top: 42px;
  right: 0;
  left: 0;
}
.page main .mv .mv-cont {
  top: auto;
  bottom: 20px;
}
main .mv .mv-cont .txt-area h2 {
  margin: 0 0 50px;
  font-size: 100px;
  line-height: 1;
}
main .mv .mv-cont .txt-area h3 {
  margin: 0 0 15px;
  font-size: 22px;
}
main .mv .mv-cont .txt-area p {
  font-size: 14px;
  line-height: 2.5;
  font-weight: 700;
}
.page main .mv .mv-cont .txt-area-page {
  margin: 0 0 30px;
}
.page main .mv .mv-cont .txt-area-page h2 {
  font-size: 36px;
  line-height: 1.5;
}
.page main .mv .mv-cont .txt-area-page span {
  font-family: 'Barlow', sans-serif;
  font-size: 15px;
  letter-spacing: .25em;
  line-height: 1.5;
}
main .mv .mv-scroll {
  position: absolute;
  bottom: 45px;
  left: 50%;
  transform: translateX(-50%);
  animation: fluffy 2s ease infinite;
}
@keyframes fluffy {
  0%   { transform: translateX(-50%) translateY(0); }
  5%   { transform: translateX(-50%) translateY(0); }
  10%  { transform: translateX(-50%) translateY(0); }
  20%  { transform: translateX(-50%) translateY(-10px); }
  25%  { transform: translateX(-50%) translateY(0); }
  30%  { transform: translateX(-50%) translateY(-10px); }
  50%  { transform: translateX(-50%) translateY(0); }
  100% { transform: translateX(-50%) translateY(0); }
}
main .mv .mv-scroll p {
  writing-mode: vertical-rl;
  font-family: 'Barlow', sans-serif;
  font-size: 10px;
  letter-spacing: .25em;
  position: relative;
}
main .mv .mv-scroll p::after {
  display: block;
  content: '';
  width: 1px;
  height: 70px;
  background-color: #21646F;
  position: absolute;
  bottom: -85px;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 1024px) {
  main .mv {
    margin: 0 0 50px;
    position: relative;
  }
  .page main .mv {
    margin: 0 0 0;
  }
  main .mv .mv-cont {
    position: absolute;
    top: 30px;
    right: 0;
    left: 0;
  }
  .page main .mv .mv-cont {
    top: 30px;
    bottom: auto;
  }
  main .mv .mv-cont .menu-btn {
    width: 25px;
    height: 25px;
    z-index: 2;
    position: fixed;
    top: 30px;
    right: 20px;
  }
  main .mv .mv-cont .txt-area h2 {
    margin: 0 0 15px;
    font-size: 44px;
    line-height: 1;
    text-align: center;
  }
  main .mv .mv-cont .txt-area h3 {
    margin: 0 0 15px;
    font-size: 22px;
    text-align: center;
  }
  main .mv .mv-cont .txt-area p {
    font-size: 14px;
    line-height: 1.75;
    font-weight: 700;
    text-align: center;
  }
  main .mv .mv-cont .txt-area span {
    display: block;
    margin: 0 0 10px;
    font-family: 'Barlow', sans-serif;
    font-size: 10px;
    text-align: center;
    letter-spacing: .25em;
  }
  .page main .mv .mv-cont .txt-area-page {
    margin: 0 0 0;
  }
  .page main .mv .mv-cont .txt-area-page h2 {
    font-size: 22px;
    line-height: 1.5;
  }
  .page main .mv .mv-cont .txt-area-page span {
    font-family: 'Barlow', sans-serif;
    font-size: 13px;
    letter-spacing: .25em;
    line-height: 1.5;
  }
  main .mv .mv-scroll {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    animation: fluffy 2s ease infinite;
  }
  @keyframes fluffy {
    0%   { transform: translateX(-50%) translateY(0); }
    5%   { transform: translateX(-50%) translateY(0); }
    10%  { transform: translateX(-50%) translateY(0); }
    20%  { transform: translateX(-50%) translateY(-10px); }
    25%  { transform: translateX(-50%) translateY(0); }
    30%  { transform: translateX(-50%) translateY(-10px); }
    50%  { transform: translateX(-50%) translateY(0); }
    100% { transform: translateX(-50%) translateY(0); }
  }
  main .mv .mv-scroll p {
    writing-mode: vertical-rl;
    font-family: 'Barlow', sans-serif;
    font-size: 10px;
    letter-spacing: .25em;
    position: relative;
  }
  main .mv .mv-scroll p::after {
    display: block;
    content: '';
    width: 1px;
    height: 50px;
    background-color: #21646F;
    position: absolute;
    bottom: -60px;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (max-width: 768px) {
  main .mv {
    background-color: #ffffff;
  }
  main .mv .mv-sp-top {
    margin: 0 0 215px;
  }
}


/* ■ breadcrumb */
main .breadcrumb {
  margin: 0 0 50px;
  padding: 12px 0;
  background-color: #ffffff;
}
main .breadcrumb ul {
  padding: 0;
  list-style-type: none;
}
main .breadcrumb ul li {
  margin: 0 30px 0 0;
  position: relative;
}
main .breadcrumb ul li:last-child {
  margin: 0 0 0 0;
}
main .breadcrumb ul li::after {
  display: block;
  content: '';
  width: 10px;
  height: 1px;
  background-color: #21646F;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -20px;
}
main .breadcrumb ul li:last-child::after {
  display: none;
}
main .breadcrumb ul li a {
  color: #E8591F;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 12px;
  font-weight: 500;
  transition: .4s;
}
main .breadcrumb ul li a:hover {
  opacity: .6;
}
main .breadcrumb ul li a svg {
  margin: 0 2px 0 0;
}
main .breadcrumb ul li span {
  color: #21646F;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 12px;
  font-weight: 500;
}
@media screen and (max-width: 1024px) {
  main .breadcrumb {
    margin: 0 0 20px;
    padding: 12px 0;
    background-color: #ffffff;
  }
  main .breadcrumb ul {
    padding: 0;
    list-style-type: none;
  }
  main .breadcrumb ul li {
    margin: 0 30px 0 0;
    position: relative;
  }
  main .breadcrumb ul li:last-child {
    margin: 0 0 0 0;
  }
  main .breadcrumb ul li::after {
    display: block;
    content: '';
    width: 10px;
    height: 1px;
    background-color: #21646F;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -20px;
  }
  main .breadcrumb ul li:last-child::after {
    display: none;
  }
  main .breadcrumb ul li a {
    color: #E8591F;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 12px;
    font-weight: 500;
    transition: .4s;
  }
  main .breadcrumb ul li a:hover {
    opacity: .6;
  }
  main .breadcrumb ul li a svg {
    margin: 0 2px 0 0;
  }
  main .breadcrumb ul li span {
    color: #21646F;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 12px;
    font-weight: 500;
  }
}


/* ■ ページネーション */
main .pagination ul {
  padding: 0;
  list-style-type: none;
}
main .pagination ul li {
  margin: 0 15px 0 0;
}
main .pagination ul li:last-child {
  margin: 0 0 0 0;
}
main .pagination ul li a {
  display: block;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  color: #E8591F;
  font-family: 'Barlow', sans-serif;
  font-size: 16px;
  line-height: 40px;
  text-align: center;
}
main .pagination ul li a.current {
  background-color: #21646F;
  color: #ffffff;
}
main .pagination .prev a,
main .pagination .next a {
  padding: 10px 0;
}
main .pagination .prev {
  margin: 0 60px 0 0;
}
main .pagination .prev .first {
  margin: 0 30px 0 0;
}
main .pagination .next {
  margin: 0 0 0 60px;
}
main .pagination .next .last {
  margin: 0 0 0 30px;
}
@media screen and (max-width: 1024px) {
  main .pagination ul {
    padding: 0;
    list-style-type: none;
  }
  main .pagination ul li {
    margin: 0 15px 0 0;
  }
  main .pagination ul li:last-child {
    margin: 0 0 0 0;
  }
  main .pagination ul li a {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    color: #E8591F;
    font-family: 'Barlow', sans-serif;
    font-size: 16px;
    line-height: 40px;
    text-align: center;
  }
  main .pagination ul li a.current {
    background-color: #21646F;
    color: #ffffff;
  }
  main .pagination .prev a,
  main .pagination .next a {
    padding: 10px 0;
  }
  main .pagination .prev {
    margin: 0 15px 0 0;
  }
  main .pagination .prev .first {
    margin: 0 10px 0 0;
  }
  main .pagination .next {
    margin: 0 0 0 15px;
  }
  main .pagination .next .last {
    margin: 0 0 0 10px;
  }
}


/* ■ table */
/* table-p1 */
main .table-p1 table {
  border-collapse: collapse;
  width: 100%;
  border-radius: 20px;
  overflow: hidden;
}
main .table-p1 table tr th,
main .table-p1 table tr td {
  padding: 12px;
  border: 1px solid #ffffff;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  line-height: 1.5;
}
main .table-p1 table tr th {
  background-color: #DCEFED;
  color: #21646F;
  font-weight: 500;
}
main .table-p1 table tr:nth-child(n + 2) th,
main .table-p1 table tr td {
  background-color: #F9F9F9;
  color: #606060;
  font-weight: 400;
  text-align: center;
}
main .table-p1 table tr th:first-child {
  width: 78px;
}
@media screen and (max-width: 1024px) {
  main .table-p1 {
    overflow-x: scroll;
    padding: 0 0 20px;
  }
  main .table-p1::-webkit-scrollbar {
    height: 20px;
  }
  main .table-p1::-webkit-scrollbar-track {
    background-color: #DCEFED;
  }
  main .table-p1::-webkit-scrollbar-thumb {
    background-color: #21646F;
  }
  main .table-p1 table {
    border-collapse: collapse;
    width: 800px;
    border-radius: 20px;
    overflow: hidden;
  }
  main .table-p1 table tr th,
  main .table-p1 table tr td {
    padding: 12px;
    border: 1px solid #ffffff;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    line-height: 1.5;
  }
  main .table-p1 table tr th {
    background-color: #DCEFED;
    color: #21646F;
    font-weight: 500;
  }
  main .table-p1 table tr:nth-child(n + 2) th,
  main .table-p1 table tr td {
    background-color: #F9F9F9;
    color: #606060;
    font-weight: 400;
    text-align: center;
  }
  main .table-p1 table tr th:first-child {
    width: 78px;
  }
}


/* ■ sns-list */
main .sns-list a {
  display: block;
  margin: 0 30px 0 0;
  transition: .4s;
}
main .sns-list a.line {
  width: 20px;

}
main .sns-list a.twitter {
  width: 20px;
}
main .sns-list a.facebook {
  width: 14px;
}
main .sns-list a.instagram {
  width: 20px;
}
main .sns-list a:last-child {
  margin: 0 0 0 0;
}
main .sns-list a:hover {
  opacity: .6;
}
@media screen and (max-width: 1024px) {
}


/* ■ tab */
main .tab-list {
  overflow: hidden;
}
main .tab-list .tab-list-item {
  width: 220px;
  margin: 0 5px 0 0;
  padding: 20px 0;
  background-color: #21646F;
  border-radius: 8px 8px 0 0;
  border: none;
  color: #ffffff;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 17px;
  line-height: 1.5;
  font-weight: 500;
  box-shadow: 0 0 15px rgb(35 100 111 / 15%);
  cursor: pointer;
  position: relative;
}
main .tab-list .tab-list-item:last-child {
  margin: 0 0 0 0;
}
main .tab-list .tab-list-item.is-btn-active {
  background-color: #ffffff;
  color: #21646F;
}
main .tab-list .tab-list-item svg {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 20px;
}
main .tab-list .tab-list-item.is-btn-active svg path {
  fill: #21646f;
}
main .tab-contents-wrap .tab-contents {
  display: none;
}
main .tab-contents-wrap .is-contents-active {
  display: block;
}
@media screen and (max-width: 1024px) {
  main .tab-list {
    display: none;
    overflow: hidden;
  }
  main .tab-list .tab-list-item {
    width: 300px;
    margin: 0 5px 0 0;
    padding: 20px 0;
    background-color: #21646F;
    border-radius: 8px 8px 0 0;
    border: none;
    color: #ffffff;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 17px;
    line-height: 1.5;
    font-weight: 500;
    box-shadow: 0 0 15px rgb(35 100 111 / 15%);
    cursor: pointer;
    position: relative;
  }
  main .tab-list .tab-list-item:last-child {
    margin: 0 0 0 0;
  }
  main .tab-list .tab-list-item.is-btn-active {
    background-color: #ffffff;
    color: #21646F;
  }
  main .tab-list .tab-list-item svg {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 30px;
  }
  main .tab-list .tab-list-item.is-btn-active svg path {
    fill: #21646f;
  }
  main .tab-contents-wrap .tab-contents {
    display: block;
    margin: 0 0 30px;
    padding: 0 0 30px;
    border-bottom: 3px solid #21646F;
  }
  main .tab-contents-wrap .tab-contents:last-child {
    margin: 0 0 0;
    padding: 0 0 0;
    border-bottom: none;
  }
  main .tab-contents-wrap .is-contents-active {
    display: block;
  }
}








/*======================================

  4. footer

======================================*/

footer {
  width: calc(100% - 80px);
  margin: 0 0 0 auto;
  padding: 0 0 80px;
  background-color: #ffffff;
}
.page footer {
  background-color: transparent;
}
footer h2 {
  margin: 0 0 15px;
  font-size: 22px;
}
footer .nav-list {
  padding: 0;
  list-style-type: none;
}
footer .nav-list .nl-li {
  padding: 0 20px;
  border-right: 1px solid #21646F;
}
footer .nav-list .nl-li:first-child {
  padding-left: 0;
}
footer .nav-list .nl-li:last-child {
  padding-right: 0;
  border-right: none;
}
footer .nav-list .nl-li a {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 12px;
  font-weight: 500;
  transition: .4s;
}
footer .nav-list .nl-li a:hover {
  opacity: .6;
}
footer .nav-list .clm-01 {
  padding: 0 20px 0 0;
  border-right: 1px solid #21646F;
}
footer .nav-list .clm-02 {
  padding: 0 0 0 20px;
}
@media screen and (max-width: 1024px) {
  footer {
    width: 100%;
    margin: 0 0 0 auto;
    padding: 0 0 80px;
    background-color: #ffffff;
  }
  .page footer {
    background-color: transparent;
  }
  footer h2 {
    margin: 0 0 15px;
    font-size: 22px;
    text-align: center;
  }
  footer .nav-list {
    padding: 0;
    list-style-type: none;
  }
  footer .nav-list .nl-li {
    padding: 0 20px;
    border-right: 1px solid #21646F;
  }
  footer .nav-list .nl-li:first-child {
    padding-left: 0;
  }
  footer .nav-list .nl-li:last-child {
    padding-right: 0;
    border-right: none;
  }
  footer .nav-list .nl-li a {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 14px;
    font-weight: 500;
    transition: .4s;
  }
  footer .nav-list .nl-li a:hover {
    opacity: .6;
  }
  footer .nav-list .clm-01 {
    padding: 0 0 0 0;
    border-right: none;
  }
  footer .nav-list .clm-02 {
    padding: 0 0 0 0;
  }
  footer .copyright {
    font-family: 'Barlow', sans-serif;
    font-size: 10px;
    text-align: center;
    letter-spacing: .25em;
  }
}








/*======================================

  5. contact

======================================*/

/*
  入力
======================================*/

/*
  確認
======================================*/




/*
  完了
======================================*/


/*
  エラー
======================================*/

/*======================================

  6. 各ページ

======================================*/

/*
  home
======================================*/

/* feature */
.home main .feature {
  margin-bottom: 70px;
}
.home main .feature .cont {
  width: 85.96491228%;
  position: relative;
}
.home main .feature .cont .clm {
  width: 28.571428571%;
  margin: 0 7.1428571435% 0 0;
  padding: 145px 0 0;
  background-repeat: no-repeat;
  background-position: top center;
}
.home main .feature .cont .clm img {
  margin: 0 0 20px;
}
.home main .feature .cont .clm h3 {
  margin: 0 0 20px;
  font-size: 24px;
  line-height: 1.5;
  font-weight: 600;
  text-align: center;
}
.home main .feature .cont .clm p {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 15px;
  line-height: 2;
}
.home main .feature .cont .clm.clm-01 {
  background-image: url('../img/home/feature-bg-01.png');
  background-size: 150px;
}
.home main .feature .cont .clm.clm-02 {
  margin-top: 40px;
  background-image: url('../img/home/feature-bg-02.png');
  background-size: 184px;
}
.home main .feature .cont .clm.clm-03 {
  margin-top: 80px;
  margin-right: 0;
  background-image: url('../img/home/feature-bg-03.png');
  background-size: 180px;
}
.home main .feature .cont .feature-deco-01 {
  width: 200px;
  position: absolute;
  top: -10px;
  right: 0;
}
@media screen and (max-width: 1024px) {
  .home main .feature {
    margin-bottom: 40px;
  }
  .home main .feature .cont {
    width: 100%;
  }
  .home main .feature .cont .clm {
    width: 100%;
    margin: 0 0 30px 0;
    padding: 70px 0 0;
    background-repeat: no-repeat;
    background-position: top center;
  }
  .home main .feature .cont .clm img {
    margin: 0 0 10px;
  }
  .home main .feature .cont .clm h3 {
    margin: 0 0 10px;
    font-size: 20px;
    line-height: 1.5;
    font-weight: 600;
    text-align: center;
  }
  .home main .feature .cont .clm p {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    line-height: 2;
  }
  .home main .feature .cont .clm.clm-01 {
    background-image: url('../img/home/feature-bg-01-sp.png');
    background-size: 80px;
  }
  .home main .feature .cont .clm.clm-02 {
    margin-top: 0;
    background-image: url('../img/home/feature-bg-02-sp.png');
    background-size: 104px;
  }
  .home main .feature .cont .clm.clm-03 {
    margin-top: 0;
    background-image: url('../img/home/feature-bg-03-sp.png');
    background-size: 102px;
  }
  .home main .feature .cont .feature-deco-01 {
    width: 100px;
    position: absolute;
    top: -35px;
    right: 0;
  }
}


/* video-commentary */
.home main .video-commentary {
  margin: 0;
}
.home main .video-commentary .bg-white {
  padding: 20px 0 45px;
  background-color: #ffffff;
}
.home main .video-commentary .bg-white .youtube {
  width: 82.45614035%;
  aspect-ratio: 16 / 9;
  margin: 0 auto;
  position: relative;
}
.home main .video-commentary .bg-white .youtube iframe {
  width: 100%;
  height: 100%;
  position: relative;
}
.home main .video-commentary .bg-white .youtube .video-commentary-youtube-deco-01 {
  width: 582px;
  position: absolute;
  top: -120px;
  right: -100px;
}
.home main .video-commentary .bg-white .youtube .video-commentary-youtube-deco-02 {
  width: 478px;
  position: absolute;
  bottom: -80px;
  left: -100px;
}
.home main .video-commentary .bg-white .video-commentary-deco-01 {
  width: 158px;
  position: absolute;
  top: -270px;
  right: 130px;
}
.home main .video-commentary .bg-white .video-commentary-deco-02 {
  width: 158px;
  position: absolute;
  top: 0;
  left: 0;
}
.home main .video-commentary .bg-white .video-commentary-deco-03 {
  width: 222px;
  position: absolute;
  bottom: -300px;
  right: 60px;
}
@media screen and (max-width: 1024px) {
  .home main .video-commentary {
    margin: 0;
  }
  .home main .video-commentary .bg-white {
    padding: 20px 0 0px;
    background-color: #ffffff;
  }
  .home main .video-commentary .bg-white .youtube {
    width: 100%;
    aspect-ratio: 16 / 9;
    margin: 0 auto;
    position: relative;
  }
  .home main .video-commentary .bg-white .youtube iframe {
    width: 100%;
    height: 100%;
    position: relative;
  }
  .home main .video-commentary .bg-white .youtube .video-commentary-youtube-deco-01 {
    width: 73.103448275%;
    position: absolute;
    top: -30%;
    right: -20px;
  }
  .home main .video-commentary .bg-white .youtube .video-commentary-youtube-deco-02 {
    width: 61.379310344%;
    position: absolute;
    bottom: -20%;
    left: -20px;
  }
  .home main .video-commentary .bg-white .video-commentary-deco-01 {
    width: 60px;
    position: absolute;
    top: -95px;
    right: 0;
  }
  .home main .video-commentary .bg-white .video-commentary-deco-02 {
    width: 66px;
    position: absolute;
    top: 35px;
    left: 0;
  }
  .home main .video-commentary .bg-white .video-commentary-deco-03 {
    width: 84px;
    position: absolute;
    bottom: -255px;
    right: 0;
  }
}


/* character-introduction */
.home main .character-introduction {
  margin: 0 0 70px;
}
.home main .character-introduction .left-area {
  min-width: 418px;
  width: 418px;
  margin-right: 15px;
}
.home main .character-introduction .left-area p {
  margin: 0 0 60px;
  font-size: 22px;
  line-height: 2;
  font-weight: 700;
}
.home main .character-introduction .left-area table {
  border-collapse: collapse;
}
.home main .character-introduction .left-area table tr th,
.home main .character-introduction .left-area table tr td {
  padding: 0 30px;
  border-right: 1px solid #21646F;
  font-size: 18px;
  letter-spacing: .25em;
}
.home main .character-introduction .left-area table tr th:first-child,
.home main .character-introduction .left-area table tr td:first-child {
  padding-left: 0;
}
.home main .character-introduction .left-area table tr th:last-child,
.home main .character-introduction .left-area table tr td:last-child {
  border-right: none;
  padding-right: 0;
}
.home main .character-introduction .left-area table tr th {
  text-align: center;
  vertical-align: top;
}
.home main .character-introduction .left-area table tr th img {
  width: 28px;
  margin: 0 0 10px;
}
.home main .character-introduction .left-area table tr th span {
  writing-mode: vertical-rl;
  white-space: pre;
}
.home main .character-introduction .left-area table tr td {
  padding-top: 15px;
  font-weight: 500;
  text-align: center;
  vertical-align: top;
}
.home main .character-introduction .left-area table tr td span {
  writing-mode: vertical-rl;
  white-space: pre;
}
.home main .character-introduction .right-area {
  width: 675px;
}
.home main .character-introduction .right-area .img-area {
  width: 83.555555555%;
  margin: 0 20px 0 0;
}
@media screen and (max-width: 1024px) {
  .home main .character-introduction {
    margin: 0 0 65px;
  }
  .home main .character-introduction .left-area {
    min-width: 100%;
    width: 100%;
    margin-right: 15px;
  }
  .home main .character-introduction .left-area p {
    margin: 0 0 30px;
    font-size: 16px;
    line-height: 2;
    font-weight: 700;
    text-align: center;
  }
  .home main .character-introduction .left-area table {
    border-collapse: collapse;
    margin: 0 auto;
  }
  .home main .character-introduction .left-area table tr th,
  .home main .character-introduction .left-area table tr td {
    writing-mode: vertical-rl;
    padding: 0 22px;
    border-right: 1px solid #21646F;
    font-size: 16px;
    letter-spacing: .25em;
  }
  .home main .character-introduction .left-area table tr th:first-child,
  .home main .character-introduction .left-area table tr td:first-child {
    padding-left: 0;
  }
  .home main .character-introduction .left-area table tr th:last-child,
  .home main .character-introduction .left-area table tr td:last-child {
    border-right: none;
    padding-right: 0;
  }
  .home main .character-introduction .left-area table tr th {
    text-align: left;
  }
  .home main .character-introduction .left-area table tr th img {
    width: 20px;
    margin: 0 0 10px;
  }
  .home main .character-introduction .left-area table tr td {
    padding-top: 10px;
    font-weight: 500;
  }
  .home main .character-introduction .right-area {
    width: 100%;
    margin: 0 0 30px;
  }
  .home main .character-introduction .right-area .img-area {
    width: 100%;
    margin: 0 30px 0 0;
  }
}


/* news */
.home main .news .bg-white {
  padding: 20px 0 80px;
  background-color: #ffffff;
}
.home main .news .bg-white .cont {
  width: 89.824561403%;
  margin-left: 15px;
}
.home main .news .bg-white .cont .news-list {
  width: 60.9375%;
  padding: 0 40px 0 0;
  position: relative;
}
.home main .news .bg-white .cont .news-list .news-list-bg {
  display: block;
  content: '';
  width: calc(100% - 72px);
  height: 100%;
  background-color: #F9F9F9;
  border-radius: 20px;
  position: absolute;
  top: 0;
  right: 0;
}
.home main .news .bg-white .cont .news-list table {
  border-collapse: collapse;
  position: relative;
}
.home main .news .bg-white .cont .news-list table tr th,
.home main .news .bg-white .cont .news-list table tr td {
  border-bottom: 1px solid #21646F;
}
.home main .news .bg-white .cont .news-list table tr:last-child th,
.home main .news .bg-white .cont .news-list table tr:last-child td {
  border-bottom: none;
}
.home main .news .bg-white .cont .news-list table tr th {
  padding: 20px 30px 20px 0;
  font-family: 'Barlow', sans-serif;
  font-weight: 400;
  letter-spacing: .05em;
}
.home main .news .bg-white .cont .news-list table tr th .year {
  display: block;
  margin: 0 0 5px;
  font-size: 12px;
}
.home main .news .bg-white .cont .news-list table tr th .moon-day {
  display: block;
  font-size: 17px;
}
.home main .news .bg-white .cont .news-list table tr td {
  padding: 20px 0 20px 40px;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 15px;
  line-height: 1.5;
  font-weight: 500;
}
.home main .news .bg-white .cont .twitter {
  width: 34.1796875%;
  padding: 30px 30px 35px;
  background-color: #F9F9F9;
  border-radius: 20px;
}
.home main .news .bg-white .cont .twitter .timeline {
  margin: 0 0 10px;
}
.home main .news .bg-white .cont .twitter .follow-btn {
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .home main .news .bg-white {
    padding: 40px 0 30px;
    background-color: #ffffff;
  }
  .home main .news .bg-white .cont {
    width: 100%;
    margin-left: 25px;
  }
  .home main .news .bg-white .cont .news-list {
    width: 100%;
    padding: 0 20px 0 0;
    position: relative;
  }
  .home main .news .bg-white .cont .news-list .news-list-bg {
    display: block;
    content: '';
    width: calc(100% - 62px);
    height: 100%;
    background-color: #F9F9F9;
    border-radius: 20px;
    position: absolute;
    top: 0;
    right: 0;
  }
  .home main .news .bg-white .cont .news-list table {
    border-collapse: collapse;
    position: relative;
  }
  .home main .news .bg-white .cont .news-list table tr th,
  .home main .news .bg-white .cont .news-list table tr td {
    border-bottom: 1px solid #21646F;
  }
  .home main .news .bg-white .cont .news-list table tr:last-child th,
  .home main .news .bg-white .cont .news-list table tr:last-child td {
    border-bottom: none;
  }
  .home main .news .bg-white .cont .news-list table tr th {
    padding: 20px 30px 20px 0;
    font-family: 'Barlow', sans-serif;
    font-weight: 400;
    letter-spacing: .05em;
  }
  .home main .news .bg-white .cont .news-list table tr th .year {
    display: block;
    margin: 0 0 5px;
    font-size: 12px;
  }
  .home main .news .bg-white .cont .news-list table tr th .moon-day {
    display: block;
    font-size: 14px;
  }
  .home main .news .bg-white .cont .news-list table tr td {
    padding: 20px 0 20px 20px;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
  }
  /*.home main .news .bg-white .cont .twitter {
    width: 34.1796875%;
    padding: 30px 30px 35px;
    background-color: #F9F9F9;
    border-radius: 20px;
  }
  .home main .news .bg-white .cont .twitter .timeline {
    margin: 0 0 10px;
  }
  .home main .news .bg-white .cont .twitter .follow-btn {
    text-align: center;
  }*/
  .home main .news .bg-white .twitter {
    width: 100%;
    padding: 30px 25px 30px;
    background-color: #F9F9F9;
    border-radius: 20px;
  }
  .home main .news .bg-white .twitter .timeline {
    margin: 0 0 10px;
  }
  .home main .news .bg-white .twitter .follow-btn {
    text-align: center;
  }
}




/*
  page
======================================*/

.page main .page-cont {
  margin: 0 0 80px;
}
.page main .page-cont .bg-white {
  overflow: hidden;
  margin: 0 0 30px;
  padding: 60px 70px;
  background-color: #ffffff;
  border-radius: 20px;
  box-shadow: 0 0 15px rgba(35, 100, 111, .15);
}
.page main .page-cont .bg-white:last-child {
  margin: 0 0 0;
}
.page main .page-cont .bg-white .cont-in {
  margin: 0 0 50px;
}
.page main .page-cont .bg-white .cont-in p {
  color: #606060;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  line-height: 2;
}
.page main .page-cont .bg-white .cont-in .commentary {
  padding: 30px 50px;
  background-color: #F9F9F9;
  border-radius: 20px;
}
.page main .page-cont .bg-white .cont-in:last-child {
  margin: 0 0 0;
}
.page main .page-cont .bg-white .cont-in .clm {
  padding: 30px 70px 40px;
}
.page main .page-cont .bg-white .cont-in .clm .img-area {
  width: 24%;
  margin: 0 2% 0 0;
}
.page main .page-cont .bg-white .cont-in .clm .txt-area {
  width: 74%;
}
.page main .page-cont .bg-white .cont-in .clm-1 {
  padding: 30px 170px 60px;
}
.page main .page-cont .bg-white .cont-in .clm-2 {
  padding: 20px 170px 30px;
}




.page main .page-cont .bg-white .cont-in .clm-3 {
  padding: 40px 60px;
}
.page main .page-cont .bg-white .cont-in .clm-3 .bg-gray {
  margin: 0 0 30px;
  padding: 45px 55px;
  background-color: #F9F9F9;
  border-radius: 25px;
  position: relative;
}
.page main .page-cont .bg-white .cont-in .clm-3 .bg-gray:last-child {
  margin: 0 0 0;
}
.page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .img-blk {
  width: 56.043956044%;
  position: relative;
}
.page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .img-blk .arrow-btm {
  width: 21px;
  position: absolute;
  bottom: -73px;
  transform: translateX(-50%);
  left: 50%;
}
.page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .txt-blk {
  width: 40.659340659%;
}
.page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .step-bg {
  position: absolute;
  top: 0;
  right: 55px;
}
.page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .step-bg.step-bg-01 {
  width: 150px;
}
.page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .step-bg.step-bg-02 {
  width: 184px;
}
.page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .step-bg.step-bg-03 {
  width: 180px;
}




.page main .page-cont .move-page .prev {
  margin: 0 195px 0 0;
  transition: .4s;
}
.page main .page-cont .move-page .prev:hover {
  opacity: .6;
}
.page main .page-cont .move-page .news-list {
  transition: .4s;
}
.page main .page-cont .move-page .news-list:hover {
  opacity: .6;
}
.page main .page-cont .move-page .next {
  margin: 0 0 0 195px;
  transition: .4s;
}
.page main .page-cont .move-page .next:hover {
  opacity: .6;
}
.page main .page-cont .move-page .prev a span,
.page main .page-cont .move-page .news-list a span,
.page main .page-cont .move-page .next a span {
  color: #E8591F;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 17px;
  font-weight: 500;
}
@media screen and (max-width: 1024px) {
  .page main .page-cont {
    margin: 0 0 30px;
  }
  .page main .page-cont .bg-white {
    overflow: hidden;
    padding: 20px 25px;
    background-color: #ffffff;
    border-radius: 20px;
    box-shadow: 0 0 15px rgba(35, 100, 111, .15);
  }
  .page main .page-cont .bg-white:last-child {
    margin: 0 0 0;
  }
  .page main .page-cont .bg-white .cont-in {
    margin: 0 0 25px;
  }
  .page main .page-cont .bg-white .cont-in p {
    color: #606060;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    line-height: 2;
  }
  .page main .page-cont .bg-white .cont-in .commentary {
    padding: 25px 25px;
    background-color: #F9F9F9;
    border-radius: 20px;
  }
  .page main .page-cont .bg-white .cont-in:last-child {
    margin: 0 0 0;
  }
  .page main .page-cont .bg-white .cont-in .clm {
    padding: 15px 25px 25px;
  }
  .page main .page-cont .bg-white .cont-in .clm .img-area {
    width: 100%;
    margin: 0 0 15px 0;
  }
  .page main .page-cont .bg-white .cont-in .clm .txt-area {
    width: 100%;
  }
  .page main .page-cont .bg-white .cont-in .clm-1 {
    padding: 15px 25px 50px;
  }
  .page main .page-cont .bg-white .cont-in .clm-2 {
    padding: 15px 25px 20px;
  }




  .page main .page-cont .bg-white .cont-in .clm-3 {
    padding: 20px 15px;
  }
  .page main .page-cont .bg-white .cont-in .clm-3 .bg-gray {
    margin: 0 0 30px;
    padding: 0 20px 25px;
    background-color: #F9F9F9;
    border-radius: 25px;
    position: relative;
  }
  .page main .page-cont .bg-white .cont-in .clm-3 .bg-gray:last-child {
    margin: 0 0 0;
  }
  .page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .img-blk {
    width: 100%;
    position: static;
  }
  .page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .img-blk .arrow-btm {
    width: 21px;
    position: absolute;
    bottom: -28px;
    transform: translateX(-50%);
    left: 50%;
  }
  .page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .txt-blk {
    width: 100%;
  }
  .page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .step-bg {
    position: static;
    top: 0;
    right: 55px;
    margin: 0 auto;
  }
  .page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .step-bg.step-bg-01 {
    width: 74px;
  }
  .page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .step-bg.step-bg-02 {
    width: 92px;
  }
  .page main .page-cont .bg-white .cont-in .clm-3 .bg-gray .step-bg.step-bg-03 {
    width: 90px;
  }




  .page main .page-cont .move-page {
    padding: 0 0 50px;
    position: relative;
  }
  .page main .page-cont .move-page .prev {
    margin: 0 0 0 0;
    transition: .4s;
  }
  .page main .page-cont .move-page .prev:hover {
    opacity: .6;
  }
  .page main .page-cont .move-page .news-list {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    transition: .4s;
  }
  .page main .page-cont .move-page .news-list:hover {
    opacity: .6;
  }
  .page main .page-cont .move-page .next {
    margin: 0 0 0 0;
    transition: .4s;
  }
  .page main .page-cont .move-page .next:hover {
    opacity: .6;
  }
  .page main .page-cont .move-page .prev a span,
  .page main .page-cont .move-page .news-list a span,
  .page main .page-cont .move-page .next a span {
    color: #E8591F;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    font-weight: 500;
  }
}




/*
  single
======================================*/

/*
  category
======================================*/


/*
  search
======================================*/

/*
  error404
======================================*/


/*======================================

  PC用レイアウト
  1,536px以下の範囲に収めるデザインはこの中に記述

======================================*/

/* @media screen and (max-width: 1536px) {
} */








/*======================================

  PC用レイアウト
  1,366px以下の範囲に収めるデザインはこの中に記述

======================================*/

/* @media screen and (max-width: 1366px) {
} */








/*======================================

  タブレット用レイアウト
  1,024px以下の範囲に収めるデザインはこの中に記述

======================================*/

/* @media screen and (max-width: 1024px) {
} */








/*======================================

  スマートフォン用レイアウト
  768px以下の範囲に収めるデザインはこの中に記述

======================================*/

@media screen and (max-width: 768px) {
}








/*======================================

  スマートフォン用レイアウト
  599px以下の範囲に収めるデザインはこの中に記述

======================================*/

/* @media screen and (max-width: 599px) {
} */