/***********************************　メイン設定　　************************************/



body {
  /** background-image: url("https://gaiheki.support/wp-content/uploads/2020/07/dark-1845065_1920.jpg");*/
   /**background-repeat: no-repeat;
   background-size: cover;*/
   height: 250px;
    font-family:  'Alata', sans-serif; 
    background: #fff;
    user-select: none;
  }
  
  
  
  
  
  
  
  h2 {
    /*線の種類（実線） 太さ 色*/
   /*  border-bottom: solid 3px black;*/
   font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  }
  
  
  
  /***********************************　基本文字サイズ設定　　************************************/
  h1 {
      font-size: 41px;/* IE8以下とAndroid4.3以下用フォールバック */
  }
  h2 {
      font-size: 32px;/* IE8以下とAndroid4.3以下用フォールバック */
  }
  
  
  /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
  @media only screen and (max-width: 750px) {
  h1 {
      font-size: 31px;/* IE8以下とAndroid4.3以下用フォールバック */
  }
  h2 {
      font-size: 29px;/* IE8以下とAndroid4.3以下用フォールバック */
  }
  }
  /***********************************　基本文字サイズ設定　　************************************/
  
  
  
  
  
  
  /***********************************　画像サイズ設定　　************************************/
  .resizeimage img { 
  clear: both;
  width: 100%; 
  max-height: 710px; 
  object-fit: cover; 
  }
  .resizeimage {
  clear: both;
    position: relative;
    }
  
  .resizeimage .info-text {
  clear: both;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    margin:0;
    padding:0;
    /*文字の装飾は省略*/
    }
  
  
  
  
  
  
  
  
  
  
  
    
  
  
  /***********************************　ブロック位置設定　　************************************/
  
  
  
  /***********　テーブルを含むフィールド　　**********/
  .about-table {
  padding: 0em 1em;
  }
  /***********　テーブルを含むフィールド　　**********/
  
  
  /***********　施工画像のフィールド　　**********/
  .Construction_pic{ 
  width: 35%;
  float: right;
  padding: 0em 4em;
  text-align: left;
  }
  
  .Construction_pic img { 
  float: right;
  width: 75%;
  text-align: left;
  /*max-height: 110px; */
  }
  /***********　施工画像のフィールド　　**********/
  
  
  /***********　施工画像のフィールド　　**********/
  .Construction_pic2{ 
  width: 55%;
  float: left;
  padding: 0em 4em;
  text-align: left;
  }
  
  .Construction_pic2 img { 
  float: right;
  width: 85%;
  text-align: left;
  /*max-height: 110px; */
  }
  
  /***********　施工画像のフィールド　　**********/
  
  
  
  
  
  
  .Google-Map{
  clear: both;
  }
  
  /***********************************　ブロック位置設定　　************************************/
  
  
  
  
              
  /***********************************　個別フォントの設定　　************************************/
        
   .top1 { font-family:  'Alata', sans-serif; }
   .about-table{ font-family: 'Alata', sans-serif;}
        
        
  /***********************************　標準フォントの設定　　************************************/
  body {
  font-family:  'Alata', sans-serif; 
  color:#000000;
  line-height:25px;
  font-size:0.95em;
  margin: 0px;
  }
  
  * {box-sizing: border-box;}
  /***********************************　標準フォントの設定　　************************************/
  
  
  
  
  /***********************************　スティッキーヘッダー（固定ヘッダー）　　************************************/
  
  /*  background:#61bccd;*/
  .header{
    left:0;
    vertical-align : top;
    position:fixed;
    top:0;
    width:100%;
    height: 42px;
    z-index:24;
    display:flex;
    justify-content:space-between;
    align-items:center
  }
  
  @media (display-mode: standalone){
    /* ここにPWA環境下でのみ実行する設定を記述 */
  .header{
    height: 83px;
  }
  }
  
  
  
  
  
  
  
  .header-title{
      display: inline-block;  
    font-family:  'Alata', sans-serif; 
    line-height: 45px;
  }
  
  .nav-drawer {
  display: inline-block;  
  }
  
        
        
        
  
  .header-button {
      display: inline-block;  
    height: 80%;
    margin: 3px 10px 3px 10px;
    padding: 0.3em 1.2em;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 3px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
    border: none; 
    font-size: 14px;
    text-align: center;
    background-color: #03A9F4;
    color: white;
  }
  
  .header-button:hover {
    box-shadow: 1px 6px 15px rgba(0,0,0,0.5);
  }
  
  .pc-button {
  display: inline-block;  
    height: 80%;
    margin: 3px 10px 3px 10px;
    padding: 0.3em 1.2em;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 3px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
    border: none; 
    font-size: 14px;
    text-align: center;
    background-color: #03A9F4;
    color: white;
  }
  
  .pc-button:hover {
    box-shadow: 1px 6px 15px rgba(0,0,0,0.5);
  }
  
  
  /***********************************　　スティッキーヘッダー（固定ヘッダー）　ここまで！　***************************/
  
  
  
  
  
  
  /***********************************　スティッキーヘッダー（固定ヘッダー） スマホ・PCの切替　　************************************/
  
  
  /* パソコンで見たときは"pc"のclassがついた画像が表示される */
  .pc-button { display: block !important; }
  /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
  @media only screen and (max-width: 750px) {
  .pc-button { display: none !important; }
  }
  
  /***********************************　スティッキーヘッダー（固定ヘッダー） スマホ・PCの切替　　************************************/
  
  
  
  
  
  
  
  
  
  /***********************************　　通常のボタン　各種　***************************/
  
  
  .button2 {
      display: inline-block;  
    height: 80%;
    margin: 7px 10px 7px 10px;
    padding: 0.7em 1.2em;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 3px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
    border: none; 
    font-size: 14px;
    text-align: center;
    background-color: #000000;
    color: white;
  }
  
  .button2:hover {
    box-shadow: 1px 6px 15px rgba(0,0,0,0.5);
  }
  
  
  .button1 {
    display: inline-block;
    margin: 0.1em;
    padding: 0.3em 1.2em;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 3px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
    border: none; 
    font-size: 14px;
    text-align: center;
    background-color: #000000;
    color: white;
  }
  
  .button1:hover {
    box-shadow: 1px 6px 15px rgba(0,0,0,0.5);
  }
  
  
  
  
  .button3 {
    display: inline-block;
    margin: 0.1em;
    padding: 0.3em 1.2em;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 3px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
    border: none; 
    font-size: 17px;
    text-align: center;
    background-color: #0000cd;
    color: #ffffff;
  }
  
  .button3:hover {
    box-shadow: 1px 6px 15px rgba(0,0,0,0.5);
  }
  
  
  
  .button4 {
      display: inline-block;  
    height: 80%;
    margin: 7px 10px 7px 10px;
    padding: 0.7em 1.2em;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 3px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
    border: none; 
    font-size: 14px;
    text-align: center;
    background-color: #808080;
    color: white;
  }
  
  .button4:hover {
    box-shadow: 1px 6px 15px rgba(0,0,0,0.5);
  }
  
  
  
  
  /*******　検索候補ボタン　******/
  
  .btn-flat-border {
    display: inline-block;
    padding: 0.3em 1em;
    text-decoration: none;
    color: #67c5ff;
    border: solid 2px #67c5ff;
    border-radius: 3px;
    transition: .4s;
  }
  
  .btn-flat-border:hover {
    background: #67c5ff;
    color: white;
  }
  /*******　検索候補ボタン　******/
  
  /***********************************　　通常のボタン　各種　***************************/
  
  
  
  
  
  
  
  
    /***********************************　カードデザイン　　************************************/
  
  .card-img {
    border-radius: 5px 5px 0 0;
    max-width: 100%;
    height: auto;
  }
  .card-content {
    padding: 5px;
  }
  .card-title {
    font-size: 19px;
    margin-bottom: 20px;
    text-align: center;
    color: #333;
  }
  .card-text {
    color: #777;
    font-size: 14px;
  }
  .card-link {
    text-align: center;
    border-top: 1px solid #eee;
    padding: 20px;
  }
  .card-link a {
    text-decoration: none;
    color: #0bd;
    margin: 0 10px;
  }
  .card-link a:hover {
    color: #0090aa;
  }
   /***********************************　カードデザイン　　************************************/
  
  
  
  
   /***********************************　UI カード配置のデザイン　　************************************/
  
  /*案件情報　掲示板全体（カード）*/
  
     
  .Case section {
    margin: 10px;
  }
  
  .Case  {
    max-width: 100%;
    display: flex;
    -webkit-flex-flow: row　wrap;
     flex-flow: row wrap;
    justify-content: center;
  }
      
  .Case2  {
    color: #fff;
    padding:100px 0px 100px 0px;
    text-align:center
  }
  
  .Case2 img{
    width: 370px;
    max-width: 90%;
  }
  
   /***********************************　UI カード配置のデザイン　　************************************/
      
      
  
  
  
  
  
  
  
  
  
  
  
  /***********************************　カードデザイン　　************************************/
  .card1 {
  display: inline-block;
    width: 85%;
    max-width: 360px;
    min-width: 300px;
    max-height: 800px;
    background: #fff;
    margin: 30px 5px 15px 2px;
    padding: 0 5 0px 5px;
    position: relative;
    overflow: visible;
    border-radius: 5px;
    box-shadow: 0 2px 5px #ccc;
  }
  
  .card1-title {
    margin: 2px 0px 5px 0px;
    font-size: 24px;
    text-align: center;
    color: #333;
  }
  .card1-subtext {
    margin: 10px 0px 0px 0px;
    color: #777;
    font-size: 13px;
  }
  
  .card1-text {
    color: #4169e1;
    font-size: 15px;
  }
  
  
  .card1:empty {
    display: none;
  }
   /***********************************　カードデザイン　　************************************/
  
  
  
  
  /***********************************　カードデザイン　　************************************/
  .card2 {
  display: inline-block;
    width: 85%;
    max-width: 360px;
    min-width: 300px;
    max-height: 800px;
    background: #fff;
    margin: 30px 20px 30px 20px;
    padding: 30px 20px 20px 30px;
    position: relative;
    overflow: visible;
    border-radius: 5px;
    box-shadow: 0 2px 5px #ccc;
  }
  
  
  
  .card2-title {
    margin: 30px 0px 5px 0px;
    font-size: 24px;
    text-align: center;
    color: #333;
  }
  .card2-text {
    color: #777;
    font-size: 13px;
  }
  
  .card2:empty {
    display: none;
  }
   /***********************************　カードデザイン　　************************************/
  
  
  
  
  
  .card{
   font-family: "M PLUS 1p";
   display: inline-block;
    width: 85%;
    max-width: 300px;
    min-width: 250px;
    max-height: 800px;
    background: #fff;
    margin: 30px 20px 30px 20px;
    padding: 0px 0px 20px 0px;
    position: relative;
    overflow: visible;
    border-radius: 5px;
    box-shadow: 0 2px 5px #ccc;
  }
  
  .card__imgframe{
   background-color: #f5f5f5;
    width: 100%;
    height: auto;
    /*** padding-top: 56.25%;**/
    /*** background: url(https://placehold.jp/640x360.png) no-repeat center;**/
    background-size: cover;
    box-sizing: border-box;
  }
  
  .card__textbox{
    width: 100%;
    height: auto;
    padding: 20px 18px;
    background: #ffffff;
    box-sizing: border-box;
  }
  
  .card__textbox > * + *{
    margin-top: 10px;
  }
  
  .card__titletext{
    font-family:  'Alata', sans-serif; 
    font-size: 20px;
    font-weight: bold;
    line-height: 125%;
  }
  
  .card__overviewtext{
    font-size: 12px;
    line-height: 150%;
  }
  
  .card-skin{
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,.2);
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  .form-text {
    color: #000;
    font-size: 15px;
  }
  
  
  
  
   /***********************************　UI カード配置のデザイン　　************************************/
  
  /*案件情報　掲示板全体（カード）*/
  
     
  .call section {
    margin: 10px;
  }
  
  .call  {
    display: flex;
    justify-content: center;
  }
      
   /***********************************　UI カード配置のデザイン　　************************************/
   
   
   
   
   
  /***********************************　テキスト入力ボックス　　************************************/
   .cp_iptxt {
    position: relative;
    width: 93%;
      max-width: 600px;
    margin:0 auto;
  }
  .cp_iptxt input[type=text] {
    font: 15px/24px sans-serif;
      font-family: 'Alata', sans-serif;
    box-sizing: border-box;
    width: 100%;
    margin: 8px 0;
    padding: 0.4em;
    transition: 0.3s;
    border: 1px solid #c0c0c0;
    border-radius: 20px;
    outline: none;
  }
  .cp_iptxt input[type=text]:focus {
    border-color: #4169e1;
  }
  .cp_iptxt input[type=text] {
    padding-left: 40px;
  }
  .cp_iptxt i {
    position: absolute;
    top: 8px;
    left: 0;
    padding: 11px 8px;
    transition: 0.3s;
    color: #aaaaaa;
  }
  .cp_iptxt input[type=text]:focus + i {
    color: #4169e1;
  }
    /***********************************　テキスト入力ボックス　　************************************/
   
   
   
     /***********************************　テキスト入力ボックス（フォーム用）　　************************************/
  .cp_iptxt2 {
    position: relative;
    width: 93%;
      max-width: 580px;
    margin:0 auto;
  }
  .cp_iptxt2 input[type=text] {
    font: 16px/25px sans-serif;
      font-family: 'Alata', sans-serif;
    box-sizing: border-box;
    width: 100%;
    margin: 8px 0;
    padding: 0.4em;
    transition: 0.3s;
    border: 1px solid #c0c0c0;
    border-radius: 4px;
    outline: none;
  }
  .cp_iptxt2 input[type=text]:focus {
    border-color: #4169e1;
  }
  .cp_iptxt2 input[type=text] {
    padding-left: 40px;
  }
  .cp_iptxt2 i {
    position: absolute;
    top: 8px;
    left: 0;
    padding: 11px 8px;
    transition: 0.3s;
    color: #aaaaaa;
  }
  .cp_iptxt2 input[type=text]:focus + i {
    color: #4169e1;
  }
     /***********************************　テキスト入力ボックス（フォーム用）　　************************************/
  
  
   
   
    
      /***********************************　文章入力ボックス　　************************************/
  .cp_iptxt textarea {
    font: 14px/22px sans-serif;
      font-family: 'Alata', sans-serif;
    box-sizing: border-box;
    width: 100%;
    margin: 8px 0;
    padding: 0.5em;
    transition: 0.3s;
    border: 1px solid #c0c0c0;
    border-radius: 4px;
    outline: none;
  }
  .cp_iptxt textarea:focus {
    border-color: #4169e1;
  }
  
      /***********************************　文章入力ボックス　　************************************/
      
          /***********************************　プルダウン ボックス　　************************************/
  .cp_iptxt select {
    font: 13px/21px sans-serif;
      font-family: 'Alata', sans-serif;
    box-sizing: border-box;
    width: 100%;
    margin: 0px 0;
    padding: 0.3em;
    transition: 0.3s;
    border: 1px solid #c0c0c0;
    border-radius: 4px;
    outline: none;
  }
  .cp_iptxt select:focus {
    border-color: #4169e1;
  }
  
      /***********************************　プルダウン ボックス　　************************************/
    
    
   
   label {
      top: 0;
      font-size: var(--font-size-small);
      opacity: 1;
      transform: translateY(0);
      transition: all 0.2s ease-out;
  }
   
  input:placeholder-shown + label {
      opacity: 0;
      transform: translateY(1rem);
  }
  
  .fcard2 {
      position: relative;
      padding-top: 1.5rem;
  }
  
   /***********************************　通知ボックス　　************************************/
      /*通知ボックス（ログイン）*/
  .info_box1{
      padding-top:46px;
      padding: 0.5em 1em;
      background: -moz-linear-gradient(#ffb03c, #ff708d);
      background: -webkit-linear-gradient(#ffb03c, #ff708d);
      background: linear-gradient(to right, #ffb03c, #ff708d);
      color: #FFF;
  }
  .info_box1 p {
      margin: 0; 
      padding: 0;
  }
      
      
      
  
  div.example {
    width: 100px;
    height: 100px;
    background-color: red;
    overflow: scroll;
  }
      
      
      
      
      
      
      
   /***********************************　テーブルデザイン　　************************************/
  .date_table{
    border-collapse: collapse;
    border-spacing: 0;
    width: 94%;
    max-width: 500px;
     text-align: center;
  }
  
  .date_table tr{
    border-bottom: solid 2px #eee;
    cursor: pointer;
  }
  
  .date_table tr:hover{
    background-color: #d4f0fd;
  }
  
  .date_table th,.date_table td{
    text-align: left;
    padding: 1px 0
  }
  
  
  .date_table th{
    width: 20;
    line-height:12px
  }

    /***********************************　テーブルデザイン　　************************************/
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
   
  
  
  
  
    /***********************************　最初のロード画面　　************************************/
  /*画面全体にローディング画面を表示*/
  #loading {
   display: block;
   position: fixed;
   width: 100%;
   height: 100%;
   top: 0px;
   left: 0px;
   background: #FFF;
   z-index: 999;
  }
  
  #loading img {
    top: 40%;
    left: 25%;
    width: 50%;
    text-align: center;
    color: #fff;
    z-index: 9;
    position: absolute;
  }
  

  #home_data_area_loading {
    display: block;
    position: absolute;
    width: 100%;
    min-height: 842px;
    z-index: 1003;
    height: 100%;
   }
  
  
  #home_data_area_loading img {
    top: 40%;
    left: 25%;
    width: 50%;
    text-align: center;
    color: #fff;
    z-index: 9;
    position: absolute;
  }
  


  #loading2 img {
   position: fixed;
   top: 50%;
   left: 50%;
   width: 20%;
   max-width: 50px; /* 最大幅 */
   margin-top: 70px;
   margin-left: -30px;
   text-align: center;
   color: #fff;
   z-index: 9;
  }
    /***********************************　最初のロード画面　　************************************/
  
  
  
  
  
  
  
    /***********************************　ハンバーガー　　************************************/
  
  /*チェックボックス等は非表示に*/
  .nav-unshown {
    display:none;
  }
  
  /*アイコンのスペース*/
  #nav-open {
    display: inline-block;
      font-family: 'Alata', sans-serif;
      top: 0px;
  }
  
  
  @media (display-mode: standalone){
    /* ここにPWA環境下でのみ実行する設定を記述 */
    #nav-open {
      top: 39px;
    }
  
  }
  
  /*閉じる用の薄黒カバー*/
  #nav-close {
    display: none;/*はじめは隠しておく*/
    position: fixed;
    z-index: 99;
    top: 0;/*全体に広がるように*/
    left: 0;
    width: 100%;
    height: 100%;
    background: black;
    opacity: 0;
    transition: .3s ease-in-out;
  }
  
  /*中身*/
  #nav-content {
    overflow: auto;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;/*最前面に*/
    width: 60%;/*右側に隙間を作る（閉じるカバーを表示）*/
    max-width: 230px;/*最大幅（調整してください）*/
    height: 100%;
    background: #fff;/*背景色*/
    transition: .3s ease-in-out;/*滑らかに表示*/
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);/*左に隠しておく*/
  }
  
  /*チェックが入ったらもろもろ表示*/
  #nav-input:checked ~ #nav-close {
    display: block;/*カバーを表示*/
    opacity: .5;
  }
  
  #nav-input:checked ~ #nav-content {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);/*中身を表示（右へスライド）*/
    box-shadow: 6px 0 25px rgba(0,0,0,.15);
  }
  
    /***********************************　ハンバーガー　　************************************/
  
  
  
  
  
  
  
  
    /***********************************　ポップアップ　　************************************/
  
  
  
  
  * {
    box-sizing: border-box;
  }
  body {
    font-family:'Avenir','Helvetica, Neue','Helvetica','Arial';
  }
  
  
  /* モーダルCSSここから */
  .modalArea {
    visibility: hidden; /* displayではなくvisibility */
    opacity : 0;
    position: fixed;
    z-index: 10; /* サイトによってここの数値は調整 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: .4s;
  }
  
  .modalBg {
    width: 100%;
    height: 100%;
    background-color: rgba(30,30,30,0.9);
  }
  
  .modalWrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform:translate(-50%,-50%);
    width: 70%;
    max-width: 500px;
    padding: 10px 30px;
    background-color: #fff;
  }
  
  .closeModal {
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    cursor: pointer;
  }
  
  .is-show { /* モーダル表示用クラス */
    visibility: visible;
    opacity : 1;
  }
  /* モーダルCSSここまで */
  
  
  /* 以下ボタンスタイル */
  button {
    padding: 10px;
    background-color: #fff;
    border: 1px solid #282828;
    border-radius: 2px;
    cursor: pointer;
  }
  
  
  
    /***********************************　ポップアップ　　************************************/
  
  
  
  
  
  
  
  
  
  
  
  
   /***********************************　順番にフェードイン　　************************************/
  .fadein {
    opacity: 0;
    transform : translate(0, 50px);
    transition : all 1500ms;
  }
  
  .fadein.scrollin{
    opacity: 1;
    transform: translate(0, 0);
  }
   /***********************************　順番にフェードイン　　************************************/
  
  *, *:before, *:after {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  .cp_loading19 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 42px;
    height: 42px;
    -webkit-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
  }
  .cp_loading19 .cp_item {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin: 0px 2px;
    opacity: 1;
  }
  .cp_loading19 .cp_item {
    -webkit-animation: loading19 2s infinite ease;
            animation: loading19 2s infinite ease;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  }
  .cp_loading19 .cp_item:nth-child(1) {
    background: #FF7043;
  }
  .cp_loading19 .cp_item:nth-child(2) {
    -webkit-animation-delay: 0.5s;
            animation-delay: 0.5s;
    background: #42A5F5;
  }
  .cp_loading19 .cp_item:nth-child(3) {
    -webkit-animation-delay: 1.5s;
            animation-delay: 1.5s;
    background: #EC407A;
  }
  .cp_loading19 .cp_item:nth-child(4) {
    -webkit-animation-delay: 1s;
            animation-delay: 1s;
    background: #66BB6A;
  }
  @-webkit-keyframes loading19 {
    0% {
      opacity: 0.7;
    }
    30% {
      opacity: 0.5;
    }
    60% {
      opacity: 0;
    }
    75% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  @keyframes loading19 {
    0% {
      opacity: 0.7;
    }
    30% {
      opacity: 0.5;
    }
    60% {
      opacity: 0;
    }
    75% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  
  
  
  
  /***********************************　　検索フィールド　***************************/
  
        .search-area input[type="text"] {
    padding: 5px 5px 3px;
    font-size: 16px;
    border: 1px solid #D6D6D6;
  }
  
  .search-area input[type="text"]:focus {
    background: #F9F9F9;
  }
  
  .search-result {
    margin-top: 20px;
  }
  .search-result__hit-num span {
    font-weight: bold;
  }
  #search-result__list {
    margin-top: 15px;
  }
  
  .target-area {
    margin-top: 50px;
  }
  
  /***********************************　　検索フィールド　***************************/
  
  
  
  
   /***********************************　カードを横スクロール　　************************************/
   .horizontal-list {
    padding: 0px 100px 0px 40px;
  overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    display: -ms-flexbox;
    display: flex; }
   /***********************************　カードを横スクロール　　************************************/
  
  
  
  
   /***********************************　途中から固定ヘッダー　　************************************/
   /*スクロールしたら、このCSSを適用し、ナビゲーションバーの位置を固定する*/
          .is-fixed {
              position: fixed;
              top: 0;
              left: 0;
              z-index: 100;
              width: 100%;
          }
          
          
  
  
  
  
          /*ナビゲーションバーの大きさを設定 固定スクロールには関係ない*/
          .articles-Wrapper {
              position: fixed;
              color: white;
              height: 20px;
              width: 100%;
          }
  
       
   /***********************************　途中から固定ヘッダー　　************************************/
   
   
  
   /***********************************　本文中の自動リンク　　************************************/
  .inlink:visited{
    color : #ff4081;
  }
  
  .inlink:hover{
    color : #ff7043;
  }
  
  
   /***********************************　本文中の自動リンク　　************************************/
  
  
  
  .circle_spread_btn {
    display: inline-block;
    position: relative;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background: #40C659;
    border-radius: 50%;
  }
  .circle_spread_btn:hover {
     cursor: pointer;
     text-decoration: none;
    text-align: center;
     transition: transform .3s;
    transform-origin: center;
    transform: scale(0.9, 0.9);
    opacity: 0.7;
  }
  .circle_spread_btn::after {
      display: inline-block;
      content: "";
      width: 49px;
      height: 49px;
      position: absolute;
     border-radius: 50%;
    color:#fff;
     top: -0.5px;
     left: -0.5px;
      border: 1px solid #40C659;
     transition: transform .5s ease;
    visibility: hidden;
  }
  .circle_spread_btn:hover::after {
     cursor: pointer;
     text-decoration: none;
     transition: transform .5s ease;
    transform-origin: center;
    transform: scale(1.4, 1.4);
    opacity: 0.7;
    visibility: visible;
  }
  
  
  
  
  
  
  .simple_square_btn3 {
    display: block;
    position: relative;
    width: 160px;
    padding: 0.3em;
    text-align: center;
    text-decoration: none;
    color: #1B1B1B;
    background: #fff;
          border-radius: 30px;
    border:1px solid #1B1B1B;
  }
  .simple_square_btn3:hover {
     cursor: pointer;
     text-decoration: none;
    -webkit-animation: simple_square_btn3 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
          -moz-animation: simple_square_btn3 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
     animation: simple_square_btn3 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  }
  @-webkit-keyframes simple_square_btn3 {
    0% {
      -webkit-transform: scale(0.85);
              transform: scale(0.85);
    }
    100% {
      -webkit-transform: scale(1);
              transform: scale(1);
    }
  }
  @-moz-keyframes simple_square_btn3 {
    0% {
      -webkit-transform: scale(0.85);
              transform: scale(0.85);
    }
    100% {
      -webkit-transform: scale(1);
              transform: scale(1);
    }
  }
  @keyframes simple_square_btn3 {
    0% {
      -webkit-transform: scale(0. 85);
              transform: scale(0.85);
    }
    100% {
      -webkit-transform: scale(1);
              transform: scale(1);
    }
  }
  
  
  
  
  
  
  
  #container{
    position: absolute;
    left: 50%;
    margin-left: -50px;
    text-align: center;
    font-family: Arial;
    font-weight: bold;
  }
  #container span{
    display: block;
    background: #000;
    width: 100px;
    height: 5px;
    margin-top: 5px;
    animation: load 2s infinite;
    border-radius: 5px;
  }
  
  #container span:nth-child(2){animation-delay: 100ms;}
  #container span:nth-child(3){animation-delay: 200ms;}
  
  @keyframes load{
    50%{
      width: 5px;
      margin-right: 95px;
      opacity: .1;
    }
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  .cp_ipradio {
  width: 90%;
  margin: 2em auto;
  text-align: left;
  }
  .cp_ipradio label {
  position: relative;
  display: block;
  width: 100%;
  margin: 2px 0 0;
  padding: 10px 0;
  }
  .cp_ipradio label input[type='radio'] {
  position: relative;
  z-index: 1;
  display: inline-block;
  margin-top: 3px;
  margin-right: 15px;
  }
  .cp_ipradio label input[type='radio']:checked + div span {
  position: absolute;
  top: -5px;
  left: 100%;
  display: inline-block;
  visibility: visible;
  clear: both;
  margin: 0 0 0 20px;
  padding: 8px 15px;
  transition: transform 200ms ease;
  transform: translateX(0px);
  text-align: center;
  white-space: nowrap;
  color: #ffffff;
  border-radius: 4px;
  background-color: rgba(34, 34, 34, 0.9);
  box-shadow: 0 0 10px rgba(34, 34, 34, 0.2);
  }
  .cp_ipradio label input[type='radio']:checked + div span:before {
  position: absolute;
  top: 4px;
  left: -1px;
  content: '';
  transform: rotate(45deg);
  border-top: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid rgba(34, 34, 34, 0.9);
  }
  .cp_ipradio label div {
  position: relative;
  display: inline-block;
  }
  .cp_ipradio label div span {
  position: absolute;
  visibility: hidden;
  transition: transform 200ms ease;
  transform: translateX(-10px);
  }
  .cp_ipradio label:nth-of-type(1) input[type='radio']:checked + div span {
  background-color: #2e9b72;
  }
  .cp_ipradio label:nth-of-type(1) input[type='radio']:checked + div span:before {
  border-top: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid rgba(46,156,114, 0.9);
  }
  .cp_ipradio label:nth-of-type(2) input[type='radio']:checked + div span {
  background-color: #36509a;
  }
  .cp_ipradio label:nth-of-type(2) input[type='radio']:checked + div span:before {
  border-top: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid rgba(54,80,154, 0.9);
  }
  .cp_ipradio label:nth-of-type(3) input[type='radio']:checked + div span {
  background-color: #f7c735;
  }
  .cp_ipradio label:nth-of-type(3) input[type='radio']:checked + div span:before {
  border-top: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid rgba(247,199,53, 0.9);
  }
  .cp_ipradio label:nth-of-type(4) input[type='radio']:checked + div span {
  background-color: #a62e7a;
  }
  .cp_ipradio label:nth-of-type(4) input[type='radio']:checked + div span:before {
  border-top: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid rgba(166,46,122, 0.9);
  }
  .cp_ipradio label:nth-of-type(5) input[type='radio']:checked + div span {
  background-color: #da3c41;
  }
  .cp_ipradio label:nth-of-type(5) input[type='radio']:checked + div span:before {
  border-top: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid rgba(218,60,65, 0.9);
  }
  
  
     
     
  
  
  
  
  .btn-gradient-3d-orange {
    display: inline-block;
    padding: 0.5em 1em;
    text-decoration: none;
    border-radius: 4px;
    color: #ffffff;
    background-image: linear-gradient(45deg, #FFC107 0%, #ff8b5f 100%);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    border-bottom: solid 3px #c58668;
  }
  
  .btn-gradient-3d-orange:active {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
  }
  
  
  
  
  
  
  
  .asspa{
  
  display:none;
  
  
  }
  
  
  
  
  
  .sample input {
    display: none;
  }
  .sample label{
    display: block;
    float: left;
    cursor: pointer;
    width: 60px;
    margin: 0;
    padding: 10px;
    background: #bdc3c7;
    color: #869198;
    font-size: 16px;
    text-align: center;
    line-height: 1;
    transition: .2s;
  }
  .sample label:first-of-type{
    border-radius: 3px 0 0 3px;
  }
  .sample label:last-of-type{
    border-radius: 0 3px 3px 0;
  }
  .sample input[type="radio"]:checked + .switch-on {
    background-color: #a1b91d;
    color: #fff;
  }
  .sample input[type="radio"]:checked + .switch-off {
    background-color: #e67168;
    color: #fff;
  }
  
  
  
  
  
  
  
  
  
    /***********************************　出勤ボタンエリア　　************************************/
  /*** iOS ***/
  .switch__label {
    width: 70px;   /*【変更中】　元は50*/
    position: relative;
    display: inline-block;
  }
  .switch__content {
    display: block;
    cursor: pointer;
    position: relative;
    border-radius: 30px;
    height: 31px;
  overflow: hidden;
  }
  .switch__content:before {
     content        : "　休む";               /* 表示する文字       */
     color          : #000000;             /* 文字色             */
    display: block;
    position: absolute;
    width: calc(100% - 3px);
    height: calc(100% - 3px);
    top: 0;
    left: 0;
    border: 1.5px solid #E5E5EA;
    border-radius: 30px;
    background-color: #fff;
  }
  .switch__content:after {
  
  
    display: block;
    position: absolute;
    background-color: transparent;
    width: 0;
    height: 0;
    top: 50%;
    left: 50%;
    border-radius: 30px;
    -webkit-transition: all .5s;
       -moz-transition: all .5s;
        -ms-transition: all .5s;
         -o-transition: all .5s;
            transition: all .5s;
  }
  .switch__input {
    display: none;
      
    
  }
   
  .switch__circle {
    display: block;
    top: 2px;
    left: 2px;
    position: absolute;
    -webkit-box-shadow: 0 2px 6px #999;
            box-shadow: 0 2px 6px #999;
    width: 27px;
    height: 27px;
    -webkit-border-radius: 20px;
            border-radius: 20px;
    background-color: #fff;
    -webkit-transition: all .5s;
       -moz-transition: all .5s;
        -ms-transition: all .5s;
         -o-transition: all .5s;
            transition: all .5s;
  }
  .switch__input:checked ~ .switch__circle {
    left: 41px;
  }
   
  .switch__input:checked ~ .switch__content:after {
    background-color: #4BD964;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
      
    content        : "出勤　";                /* 表示する文字       */
    padding        : 0 0 0 0;          /* 表示する位置       */
    color          : #ffffff;             /* 文字色             */
  }
  
  
  
  
  
  
  
    /***********************************　出勤ボタンエリア　　************************************/
  
  
  
  
  
  
    /***********************************　通常のボタン　　************************************/
  .button {
    display: inline-block;
    margin: 0.3em;
    padding: 0.7em 4em;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 3px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
    border: none; 
    font-size: 20px;
    text-align: center;
  }
  
  .button:hover {
    box-shadow: 1px 6px 15px rgba(0,0,0,0.5);
  }
  
  .blue {
    background-color: #03A9F4;
    color: white;
  }
  
  .ripple {
    position: absolute;
    background: rgba(0,0,0,.25);
    border-radius: 100%;
    transform: scale(0.2);
    opacity:0;
    pointer-events: none;
    -webkit-animation: ripple .75s ease-out;
    -moz-animation: ripple .75s ease-out;
    animation: ripple .75s ease-out;
  }
  
  
  
    /***********************************　通常のボタン　　************************************/
  
  
  
  
  
  
  
  
  
  
  /***********************************全体設定************************************/
  
  html, body, #fujiwarasan,#hope_area {
      margin: 0;
      padding: 0;
      scroll-behavior: smooth;
    }
    
  /***********************************全体設定************************************/   
    
    
  
  
  
  
  /***********************************ユーザーカード************************************/
  
  .user_card {
      width: 1200px;
      font-size: 14px;
      background: #fff;
      font-family: 'Alata', sans-serif;
      font-size: 20px;
      display: inline-block;
      margin: 10px 1px 10px 1px;
      padding: 20px 6px 18px 16px;
      border:solid 1.5px #dcdcdc;
      border-radius: 12px;
      
      max-width: 90%;
      position: inherit;
      animation: popup 0.6s cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
      box-shadow: 0 2px 5px #ccc;    
    }
  
  
  
    .user_card:hover {    
      box-shadow: 0 2px 5px #ccc;    
  
    }
     .user_card-skin {    
       overflow: hidden;
       border-radius: 13px;
       box-shadow: 0 4px 15px rgba(0,0,0,.2);
    }
  
    .user_card:active {    
      box-shadow: 0 1px 1px #ccc;    
      background: #f5f5f5;
    }
  
  /***********************************ユーザーカード************************************/
  
  
  
  
  
  /***********************************ユーザーカード************************************/
  
  .user_card2 {
      width: 1200px;
      font-size: 14px;
      background: #00b300;
      color: #FFF;
      font-family: 'Alata', sans-serif;
      font-size: 20px;
      display: inline-block;
      margin: 10px 1px 10px 1px;
      padding: 20px 6px 18px 16px;
      border:solid 1.5px #dcdcdc;
      border-radius: 12px;
      
      max-width: 90%;
      position: inherit;
      animation: popup 0.6s cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
      box-shadow: 0 2px 5px #ccc;    
    }
  
  
  
    .user_card2:hover {    
      box-shadow: 0 2px 5px #ccc;    
  
    }
     .user_card2-skin {    
       overflow: hidden;
       border-radius: 13px;
       box-shadow: 0 4px 15px rgba(0,0,0,.2);
    }
  
    .user_card2:active {    
      box-shadow: 0 1px 1px #ccc;    
      background: #f5f5f5;
    }
  
  /***********************************ユーザーカード************************************/
  
  
  
  
  
  /***********************************セクションカード************************************/
  
  #daily_report_area1 {
    text-align: left;
  }
  
  
  

  @keyframes popup {
    0% {
      transform: translateY(40px) scale(0.8);
      opacity: 0;
    }
    100% {
      transform: translateY(0) scale(1.0);
    }
    80%, 100% {
      opacity: 1;
    }
  }
  
  
  
  
  /***********************************　重要ボタン：青（新テンプレ）　　************************************/
  .button-6 {
  display: inline-block;
  font-size: 15px;
  color: #fff;
  text-decoration: none;
  user-select: none;
  background: #3971E0;
  border: 1px #3971E0 solid;
  border-radius: 4px;
  transition: 0.4s ease;
  margin: 4px 4px 4px 4px;
  padding: 7px 17px 7px 17px;
  }
  
  .button-6:hover {
  color: #fff;
  background: #1d59b3;
  box-shadow: 0 4px 7px #ccc;
  }
  
  .button-6:active {
  color: #fff;
  background: #0c264d;
  }
  /***********************************　重要ボタン：青（新テンプレ）　　************************************/
  
  
  
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  .button-1 {
    display: inline-block;
    font-size: 15px;
    color: #306ADF;
    text-decoration: none;
    user-select: none;
    border: 1px #D6D8DC solid;
    border-radius: 4px;
    transition: 0.4s ease;
    margin: 4px 4px 4px 4px;
   padding: 7px 17px 7px 17px;
  }
  
  .button-1:hover {
    color: #1c3d80;
    background: #f0f8ff;
  }
  
  .button-1:active {
    color: #153A95;
    border: 1px #153A95 solid;
    background: #D3E0F8;
  }
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  
  
  
  .button-2 {
    display: inline-block;
    font-size: 13px;
    color: #fff;
    text-decoration: none;
    user-select: none;
    border: 1px #2e3033 solid;
    border-radius: 30px;
    transition: 0.4s ease;
    margin: 4px 4px 4px 4px;
   padding: 5px 15px 5px 15px;
   background-color: #2e3033;
   color: #fff;
  }
  
  .button-2:hover {
    color: #000;
    background: #fff;
  }
  
  .button-2:active {
    color: #000;
    background: #fff;
  }
  
  
  
  
  
  
  /***********************************　プルダウン　　************************************/
  .cp_ipselect {
  overflow: hidden;
  width: 90%;
  margin: 1em auto;
  text-align: center;
  }
  .cp_ipselect select {
  width: 100%;
  min-width: 80px;
  padding-right: 1em;
  cursor: pointer;
  text-indent: 0.01px;
  text-overflow: ellipsis;
  border: none;
  outline: none;
  background: transparent;
  background-image: none;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
  }
  .cp_ipselect select::-ms-expand {
  display: none;
  }
  .cp_ipselect.cp_sl01 {
    position: relative;
    border: 1px solid #bbbbbb;
    border-radius: 2px;
    background: #f8f8f8;
    border-radius: 9px;
  }
  .cp_ipselect.cp_sl01::before {
  position: absolute;
  top: 0.8em;
  right: 0.9em;
  width: 0;
  height: 0;
  padding: 0;
  content: '';
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #666666;
  pointer-events: none;
  }
  .cp_ipselect.cp_sl01 select {
  padding: 8px 38px 8px 8px;
  color: #666666;
  }
  
  /***********************************　プルダウン　　************************************/
  
  




  /***********************************　プルダウン　　************************************/
  .cp_ipselectB {
    overflow: hidden;
    width: 90%;
    margin: 1em auto;
    text-align: center;
    }
    .cp_ipselectB select {
    width: 100%;
    min-width: 80px;
    padding-right: 1em;
    cursor: pointer;
    text-indent: 0.01px;
    text-overflow: ellipsis;
    border: none;
    outline: none;
    background: transparent;
    background-image: none;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none;
    }
    .cp_ipselectB select::-ms-expand {
    display: none;
    }
    .cp_ipselectB.cp_sl01B {
      position: relative;
    border: 3px solid #f7f7f7;
    border-radius: 2px;
    background: #f8f8f8;
    border-radius: 14px;
    }
    .cp_ipselectB.cp_sl01B::before {
    position: absolute;
    top: 0.8em;
    right: 0.9em;
    width: 0;
    height: 0;
    padding: 0;
    content: '';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #666666;
    pointer-events: none;
    }
    .cp_ipselectB.cp_sl01B select {
    padding: 8px 38px 8px 8px;
    color: #666666;
    font-size: 18px;
    font-weight: bold;
    }
    
    /***********************************　プルダウン　　************************************/
    
  
    


  /***********************************　1行の文章（新テンプレ）　　************************************/
  .Form-Item-Input {
    border: 1px solid #ddd;
    border-radius: 15px;
    height: 48px;
    flex: 1;
    width: 99%;
    max-width: 410px;
    background: #eaedf2;
    font-size: 18px;
    padding: 7px 7px 7px 11px;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  }
  @media screen and (max-width: 480px) {
  .Form-Item-Input {
    margin-left: 0;
    height: 46px;
    flex: inherit;
    font-size: 19px;
  }
  }
  /***********************************　1行の文章（新テンプレ）　　************************************/
  
   /***********************************　1行の文章（新テンプレ）　　************************************/
   .Input_new01 {
    border: 2px solid #eee8e8;
    border-radius: 15px;
    width: 88%;
    max-width: 410px;
    background: #ffffff;
    padding: 7px 7px 7px 11px;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    margin-left: 0;
    height: 52px;
    flex: inherit;
    font-size: 19px;
  }

  /***********************************　1行の文章（新テンプレ）　　************************************/




     /***********************************　1行の文章（新テンプレ）　　************************************/
     .Input_new01_half{
      border: 2px solid #eee8e8;
      border-radius: 15px;
      width: 12%;
      max-width: 410px;
      background: #ffffff;
      padding: 10px 12px 10px 10px;
      font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
      margin-left: 0;
      height: 52px;
      flex: inherit;
      font-size: 29px;
      margin: 15px 2px 1px 2px;
      font-weight: bolder;
      color: #4285f4;
  }
  
    /***********************************　1行の文章（新テンプレ）　　************************************/
  

    



  /***********************************　重要ボタン：押せない　　************************************/
  .button-4 {
  display: inline-block;
  font-size: 15px;
  color: #A5A7A8;
  text-decoration: none;
  user-select: none;
  background: #E7E8E8;
  border: 1px #E7E8E8 solid;
  border-radius: 4px;
  transition: 0.4s ease;
  margin: 4px 4px 4px 4px;
  padding: 7px 17px 7px 17px;
  }
  /***********************************　重要ボタン：押せない　　************************************/
  
  
  
  
  /***********************************　複数選択とグル　　************************************/
  
  .container {
  max-width: 640px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-size: 13px;
  }
  
  ul.ks-cboxtags {
  list-style: none;
  padding: 4px;
  }
  ul.ks-cboxtags li{
  display: inline;
  }
  ul.ks-cboxtags li label{
  display: inline-block;
  background-color: rgba(255, 255, 255, .9);
  border: 2px solid rgba(139, 139, 139, .3);
  color: #adadad;
  border-radius: 25px;
  white-space: nowrap;
  margin: 3px 0px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: all .2s;
  font-size: 18px;
  }
  
  ul.ks-cboxtags li label {
  padding: 6px 19px 8px 15px;
  cursor: pointer;
  }
  
  ul.ks-cboxtags li label:hover{
  background-color: #94cbd4;
  color: #666666;
  }
  
  
  
  ul.ks-cboxtags li label::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 12px;
  padding: 2px 6px 2px 2px;
  content: "\f067";
  transition: transform .3s ease-in-out;
  font-size: 21px;
  }
  
  ul.ks-cboxtags li input[type="checkbox"]:checked + label::before {
  content: "\f00c";
  transform: rotate(-360deg);
  transition: transform .3s ease-in-out;
  font-size: 20px;
  }
  
  ul.ks-cboxtags li input[type="checkbox"]:checked + label {
  border: 2px solid #4285f4;
  background-color: #4285f4;
  color: #fff;
  transition: all .2s;
  }
  
  ul.ks-cboxtags li input[type="checkbox"] {
  display: absolute;
  }
  ul.ks-cboxtags li input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  }
  ul.ks-cboxtags li input[type="checkbox"]:focus + label {
  border: 2px solid #e9a1ff;
  }
  
  /***********************************　複数選択とグル　　************************************/
  
  
  
   
  
  
  
  .date_lavel {
    position: relative;
    display: inline-block;
    width: 200px;
    height: 36px;
    border: 2px solid #ccc;
    border-radius: 15px;
  }
  input[type="date"] {
    position: relative;
    padding: 0 10px;
    width: 200px;
    height: 36px;
    border: 0;
    background: transparent;
    box-sizing: border-box;
    font-size: 14px;
    color: #999;
  }
  
  .date_lavel::before {
    position: absolute;
    content: "";
    top: 0;
    right: 0px;
    width: 36px;
    height: 36px;
    background-color: #06c;
    background-image: url("https://gaiheki.support/wp-content/uploads/2021/07/カレンダーアイコン8-1.png");
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: center;
    border-radius: 10px;
  }
  input[type="date"]::-webkit-inner-spin-button{
    -webkit-appearance: none;
  }
  input[type="date"]::-webkit-clear-button{
    -webkit-appearance: none;
  }
  input[type="date"]::-webkit-calendar-picker-indicator{
    position: absolute;
    right: 3px;
    top: 0px;
    padding: 0;
    width: 100%;
    height: 36px;
    background: rgba(255, 0, 0, 0.5);
    color: transparent;
    cursor: pointer;
    background: transparent;
  
  }
  
  
  
  
  
  
  
  
  /***********************************　テキストエリア（新テンプレ）　　************************************/
  .Form-Item-Textarea {
    border: 1px solid #ddd;
    border-radius: 6px;
    padding-left: 1em;
    padding-right: 1em;
    height: 216px;
    flex: 1;
    width: 100%;
    max-width: 410px;
    background: #eaedf2;
    font-size: 18px;
  }
  @media screen and (max-width: 480px) {
    .Form-Item-Textarea {
      margin-left: 0;
      height: 200px;
      flex: inherit;
      font-size: 15px;
    }
  }
  /***********************************　テキストエリア（新テンプレ）　　************************************/
  
  
  /***********************************　1行の文章（新テンプレ）　　************************************/
  .Form-Item-Input_b {
    border: 1px solid #ddd;
    border-radius: 13px;
    padding-left: 1em;
    padding-right: 1em;
    height: 42px;
    flex: 1;
    width: 36%;
    max-width: 410px;
    background: #eaedf2;
    font-size: 20px;
  }
  /***********************************　1行の文章（新テンプレ）　　************************************/
  
  
  

  .spinner2 {
    width: 70px;
    text-align: center;
    margin: 41px 0px 20px 37%;
    }
  
  
  /***********************************　ポップアップのロード表示　　************************************/
  
  
  .spinner {
    margin: 30px auto 0;
    width: 70px;
    text-align: center;
    margin: 100px 0px 470px 0px;
    }
    
    .spinner > div {
    width: 18px;
    height: 18px;
    background-color: #333;
    
    border-radius: 100%;
    display: inline-block;
    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
    animation: sk-bouncedelay 1.4s infinite ease-in-out both;
    }
    
    .spinner .bounce1 {
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
    }
    
    .spinner .bounce2 {
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
    }
    
    @-webkit-keyframes sk-bouncedelay {
    0%, 80%, 100% { -webkit-transform: scale(0) }
    40% { -webkit-transform: scale(1.0) }
    }
    
    @keyframes sk-bouncedelay {
    0%, 80%, 100% { 
      -webkit-transform: scale(0);
      transform: scale(0);
    } 40% { 
      -webkit-transform: scale(1.0);
      transform: scale(1.0);
    }
    }    
    
   
    /***********************************　ポップアップのロード表示　　************************************/
    
    
  #loading_icon{
    top: 51%;
    position: absolute;
    left: 50%;
}
      
#loading_icon2{
  top: 63%;
  position: absolute;
  left: 50%;
}

#loading_icon3{
  bottom: 13%;
  position: absolute;
  left: 50%;
}

  
  /***********************************　HTMLデータソース内　隠しデータベース　　************************************/
  #hiddenbar{
        position: absolute;
        top: 0%;
        left: 0%;
        width: 1px;
        height: 1px;
        z-index: -10;
        overflow: auto;
        }
  /***********************************　HTMLデータソース内　隠しデータベース　　************************************/
  
  
  
  
  
  
  
  
  
    /***********************************　ポップアップ　　************************************/
  
  /* モーダルCSSここから */
  .modalArea {
    visibility: hidden; /* displayではなくvisibility */
    opacity : 0;
    position: fixed;
    z-index: 10; /* サイトによってここの数値は調整 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: .4s;
  }
  
  .modalBg {
    width: 100%;
    height: 100%;
    background-color: rgba(30,30,30,0.9);
  }
  
  .modalWrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform:translate(-50%,-50%);
    
    width: 70%;
    max-width: 500px;
    padding: 10px 30px;
    background-color: #fff;
    
    font-family: "Noto Sans JP";
    border-radius: 5px;
    box-shadow: 0 2px 5px #ccc;
  }
     
  .modalWrapper{
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,.2);
  }
  .closeModal {
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    cursor: pointer;
  }
  .is-show { /* モーダル表示用クラス */
    visibility: visible;
    opacity : 1;
  }
  /* モーダルCSSここまで */
  
  /* 以下ボタンスタイル */
  button {
    padding: 10px;
    background-color: #fff;
    border: 1px solid #282828;
    border-radius: 2px;
    cursor: pointer;
  }
  
  .modal_overlay{
      display: flex;
      justify-content: center;
      overflow: auto;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 9999;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0);
      opacity: 0;
      transition: opacity 0.3s, transform 0s 0.3s;
      transform: scale(0);
  }
  .modal_trigger{
      position: absolute;
      width: 100%;
      height: 100%;
  }
  .modal_content{
    align-self: flex-end;
      width: 100%;
      min-width: 100%;
      height: 100%;
      box-sizing: border-box;
      background: #fff;
      line-height: 1.4em;
      transform: translateX(100%);
    transition: 0.2s;
      box-shadow: 0 2px 2px #ccc;
  }
  .top_card_area{
    padding: 14px 7px 0px 7px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    z-index: 9999;
    position: relative;
  }

  .top_card_area2{
    padding: 14px 7px 0px 7px;
    box-shadow: rgb(149 157 165 / 20%) 0px 8px 24px;
    z-index: 10010;
    position: absolute;
    width: 100%;
    top: 1px;
    height: 40px;
    display: contents;
  }


  #card_scroll_area{
    height: 69vh;
    overflow: scroll;
    background: #F7F8FC;
  }

  #card_scroll_area2{
    height: 92vh;
    overflow: scroll;
    background: #F7F8FC;
  }


  #card_scroll_area3{
    background: #FFF;
  }

  .card_scroll_area2{
    height: 92vh;
    overflow: scroll;
    background: #F7F8FC;
  }

  .card_scroll_area4{
    height: 92vh;
    overflow: scroll;
    background: #F7F8FC;
    -ms-filter: blur(3px);
    filter: blur(3px);
  }



  #full_card_area2{
    padding: 0px 0px 0px 6px;
    max-height: 75%;
      overflow: scroll;
      height: 321px;
      padding: 0px 0px 0px 6px;
      max-height: 80%;
      overflow: scroll;
      height: 321px;
      width: 80%;
      margin: 10px 10% 10px 10%;
  }
  
  
  
  #top_card_title{
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    width: 100%;
    height: 30px;
  }
  
  #top_card_title2{
    padding: 14px 7px 0px 7px;
    box-shadow: rgb(149 157 165 / 20%) 0px 8px 24px;
    z-index: 99999!important;
    width: 100%;
    background: #FFF;
    top: 0px;
    position: sticky;
  }
  
     
   #modal_content-skin{
    overflow: hidden;
    border-radius: 11px;
    box-shadow: 0 4px 15px rgba(0,0,0,.1);
  }   
  .close_button{
      position: absolute;
      top: 14px;
      right: 16px;
      font-size: 28px;
      cursor: pointer;
  }
  
  .modal_wrap input:checked ~ .modal_overlay{
    opacity: 1;
      transform: scale(1);
      transition: opacity 0.3s;
  }
  
  .modal_wrap input:checked ~ .modal_overlay .modal_content{
    transform: translateX(0px);
  }
  
  .open_button{
      position: fixed;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 200px;
      height: 30px;
      margin: auto;
      padding: 8px 16px;
      color: #444;
      font-weight: bold;
      font-family: 'Montserrat', sans-serif;
      box-shadow: 0 1px 3px rgba(0,0,0,0.6);
      border-radius: 16px;
      cursor: pointer;
  }
  
    /***********************************　ポップアップ　　************************************/
  
  
  
  


















  
  
    /***********************************　ポップアップ2　　************************************/
  
    .modal_overlay2{
      display: flex;
      justify-content: center;
      overflow: auto;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 9999;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0);
      opacity: 0;
      transition: opacity 0.3s, transform 0s 0.3s;
      transform: scale(0);
  }
  .modal_trigger2{
    position: absolute;
    width: 100%;
    height: 100%;
}

.modal_content2{
  align-self: flex-end;
    width: 100%;
    min-width: 100%;
    height: 100%;
    box-sizing: border-box;
    background: #fff;
    line-height: 1.4em;
    transform: translateX(100%);
  transition: 0.2s;
    box-shadow: 0 2px 2px #ccc;
}


    .modal_wrap2 input:checked ~ .modal_overlay2{
      opacity: 1;
        transform: scale(1);
        transition: opacity 0.3s;
    }
    
    .modal_wrap2 input:checked ~ .modal_overlay2 .modal_content2{
      transform: translateX(0px);
    }
    
    /***********************************　ポップアップ2　　************************************/
  
  
  
  

  
    /***********************************　ポップアップ3　　************************************/
  
    .modal_overlay3{
      display: flex;
      justify-content: center;
      overflow: auto;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 9999;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0);
      opacity: 0;
      transition: opacity 0.3s, transform 0s 0.3s;
      transform: scale(0);
  }
  .modal_trigger3{
    position: absolute;
    width: 100%;
    height: 100%;
}

.modal_content3{
  align-self: flex-end;
    width: 100%;
    min-width: 100%;
    height: 100%;
    box-sizing: border-box;
    background: #fff;
    line-height: 1.4em;
    transform: translateX(100%);
  transition: 0.2s;
    box-shadow: 0 2px 2px #ccc;
}


    .modal_wrap3 input:checked ~ .modal_overlay3{
      opacity: 1;
        transform: scale(1);
        transition: opacity 0.3s;
    }
    
    .modal_wrap3 input:checked ~ .modal_overlay3 .modal_content3{
      transform: translateX(0px);
    }
    
    /***********************************　ポップアップ3　　************************************/
  







    /***********************************　ポップアップ4　　************************************/
  
    .modal_overlay4{
      display: flex;
      justify-content: center;
      overflow: auto;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      opacity: 0;
      transition: opacity 0.3s, transform 0s 0.3s;
      transform: scale(0);
      z-index: 99999;
  }
  .modal_trigger4{
    position: absolute;
    width: 100%;
    height: 100%;
}

.modal_content4{
  align-self: flex-end;
    width: 100%;
    min-width: 100%;
    height: 100%;
    box-sizing: border-box;
    background: #fff;
    line-height: 1.4em;
    transform: translateX(100%);
  transition: 0.2s;
    box-shadow: 0 2px 2px #ccc;
}


    .modal_wrap4 input:checked ~ .modal_overlay4{
      opacity: 1;
        transform: scale(1);
        transition: opacity 0.3s;
    }
    
    .modal_wrap4 input:checked ~ .modal_overlay4 .modal_content4{
      transform: translateX(0px);
    }
    
    /***********************************　ポップアップ4　　************************************/


  
  
  /***********************************シフトないのセクションカード************************************/
  
  #section_card {
    width: 90%;
    font-size: 14px;
    background: #fff;
    font-family: 'Alata', sans-serif;
    display: inline-block;
    margin: 16px 5% 2px 5%;
    padding: 1px 9px 11px 13px;
    border-radius: 12px;
    max-width: 90%;
    position: inherit;
    animation: slideIn3 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
    box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
        }
  
        @keyframes slideIn3 {
    0% {
      transform: translateX(180px);
      opacity: 0;
    }
    100% {
      transform: translateX(0);
    }
    40%,100% {
      opacity: 1;
    }
  }
  
  
  
  
  
        #section_card:hover {    
          box-shadow: 0 2px 5px #ccc;    
  
        }
         #section_card-skin:hover {    
           overflow: hidden;
           border-radius: 13px;
           box-shadow: 0 4px 15px rgba(0,0,0,.2);
        }
  
        #section_card:active {    
          box-shadow: 0 1px 1px #ccc;    
          background: #f5f5f5;
        }
  
          
  
  /***********************************シフトないのセクションカード************************************/
  
  
  






  
  /***********************************シフトないのセクションカード************************************/
  
  .section_card {
    width: 90%;
    font-size: 14px;
    background: #fff;
    font-family: 'Alata', sans-serif;
    display: inline-block;
    margin: 16px 5% 2px 5%;
    padding: 1px 9px 11px 13px;
    border-radius: 12px;
    max-width: 90%;
    position: inherit;
    animation: slideIn3 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
    box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
        }
  
        @keyframes slideIn3 {
    0% {
      transform: translateX(180px);
      opacity: 0;
    }
    100% {
      transform: translateX(0);
    }
    40%,100% {
      opacity: 1;
    }
  }
  
        .section_card:hover {    
          box-shadow: 0 2px 5px #ccc;    
  
        }
         .section_card-skin:hover {    
           overflow: hidden;
           border-radius: 13px;
           box-shadow: 0 4px 15px rgba(0,0,0,.2);
        }
  
        .section_card:active {    
          box-shadow: 0 1px 1px #ccc;    
          background: #f5f5f5;
        }
  
          
  
  /***********************************シフトないのセクションカード************************************/
  
  
  







  /***********************************シフトないのセクションカード************************************/
  
  .section_card_premium {
    width: 90%;
    font-size: 14px;
    background: #161a1d;
    font-family: 'Alata', sans-serif;
    display: inline-block;
    margin: 16px 5% 2px 5%;
    padding: 1px 9px 11px 13px;
    border-radius: 12px;
    max-width: 90%;
    position: inherit;
    animation: slideIn3 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
    box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
    color: #FFF;
        }
  
        .section_card_premium:hover {    
          box-shadow: 0 2px 5px #ccc;    
  
        }
         .section_card_premium-skin:hover {    
           overflow: hidden;
           border-radius: 13px;
           box-shadow: 0 4px 15px rgba(0,0,0,.2);
        }
  
        .section_card_premium:active {    
          box-shadow: 0 1px 1px #000;    
          background: #000;
        }
  
          
  
  /***********************************シフトないのセクションカード************************************/
  
  


  /***********************************シフトないのセクションカード************************************/
  
  .section_card_price1 {
    width: 90%;
    font-size: 14px;
    background: #e55a66;
    font-family: 'Alata', sans-serif;
    display: inline-block;
    margin: 16px 5% 2px 5%;
    padding: 1px 9px 11px 13px;
    border-radius: 12px;
    max-width: 90%;
    position: inherit;
    animation: slideIn3 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
    box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
    color: #FFF;
        }
  
        .section_card_price1:hover {    
          box-shadow: 0 2px 5px #ccc;    
  
        }
         .section_card_price1-skin:hover {    
           overflow: hidden;
           border-radius: 13px;
           box-shadow: 0 4px 15px rgba(0,0,0,.2);
        }
  
        .section_card_price1:active {    
          box-shadow: 0 1px 1px #000;    
          background: #000;
        }
  
          
  
  /***********************************シフトないのセクションカード************************************/
  
  


  .font_premium{
    font-size: 17px;
    color: #FFF;
  }

  .font_normal{
    font-size: 17px;
    color: #000;
  }


.premium_badge{
  background: #ca9b1e;
  color: #FFF;
  border-radius: 25px;
  display: block;
  position: absolute;
  padding: 1px 8px 4px 8px;
  top: 13px;
  right: 34px;
  font-weight: bold;
  font-family: 'Ubuntu', sans-serif;
  font-size: 15px;
}
.sales_badge{
  background: #e85252;
  color: #FFF;
  border-radius: 25px;
  display: block;
  position: absolute;
  padding: 2px 6px 2px 6px;
  top: 13px;
  right: 34px;
  font-family: 'Alata';
  font-weight: bold;
}
.sales_badge2{
  background: #ffffff;
  color: #e95050;
  border-radius: 25px;
  display: block;
  position: absolute;
  padding: 2px 6px 2px 6px;
  top: 13px;
  right: 34px;
  font-family: 'Alata';
  font-weight: bold;
}

.price_card{
  display: block;
  text-align: right;
  margin: 1px 8px 0px 1px;
}
.price_card1{
  display: contents;
  color: #767676;
  font-size: 19px;
  font-weight: 200;
}
.price_card2 {
  display: contents;
  font-size: 22px;
}
.price_card3{
  display: inline-block;
  color: #ff0a0a;
  font-size: 24px;
  font-weight: bold;
  border: 2px solid #ff0a0a;
  padding: 3px 10px;
  border-radius: 16px;
}
    /***********************************シフトないのセクションカード************************************/
  
    #section_card2 {
      width: 90%;
      font-size: 14px;
      background: #fff;
      font-family: 'Alata', sans-serif;
      display: inline-block;
      margin: 16px 5% 2px 5%;
      padding: 14px 13px 15px 16px;
      border-radius: 12px;
      max-width: 90%;
      position: inherit;
      box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
      word-break: break-all;
    }
    
          #section_card2:hover {    
            box-shadow: 0 2px 5px #ccc;    
    
          }
           #section_card2-skin:hover {    
             overflow: hidden;
             border-radius: 13px;
             box-shadow: 0 4px 15px rgba(0,0,0,.2);
          }
    
          #section_card2:active {    
            box-shadow: 0 1px 1px #ccc;    
            background: #f5f5f5;
          }
    
            
    
    /***********************************シフトないのセクションカード************************************/
    








    /***********************************シフトないのセクションカード************************************/
  
    #cancel_card {
      width: 90%;
    font-size: 17px;
    background: #fff;
    font-family: 'Alata', sans-serif;
    display: inline-block;
    margin: 16px 5% 2px 5%;
    padding: 14px 13px 15px 16px;
    border-radius: 17px;
    max-width: 90%;
    position: inherit;
    color: #f12828;
    text-align: center;
    box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
    }
    
          #cancel_card:hover {    
            box-shadow: 0 2px 5px #ccc;    
    
          }
           #cancel_card-skin:hover {    
             overflow: hidden;
             border-radius: 13px;
             box-shadow: 0 4px 15px rgba(0,0,0,.2);
          }
    
          #cancel_card:active {    
            box-shadow: 0 1px 1px #ccc;    
            background: #f5f5f5;
          }
    
            
    
    /***********************************シフトないのセクションカード************************************/
    




    /***********************************シフトないのセクションカード************************************/
  
    #ok_card {
      width: 90%;
    font-size: 17px;
    background: #fff;
    font-family: 'Alata', sans-serif;
    display: inline-block;
    margin: 16px 5% 2px 5%;
    padding: 14px 13px 15px 16px;
    border-radius: 17px;
    max-width: 90%;
    position: inherit;
    color: #2850f1;
    text-align: center;
    box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
    }
    
          #ok_card:hover {    
            box-shadow: 0 2px 5px #ccc;    
    
          }
           #ok_card-skin:hover {    
             overflow: hidden;
             border-radius: 13px;
             box-shadow: 0 4px 15px rgba(0,0,0,.2);
          }
    
          #ok_card:active {    
            box-shadow: 0 1px 1px #ccc;    
            background: #f5f5f5;
          }
    
            
    
    /***********************************シフトないのセクションカード************************************/
    






  
  /***********************************シフトないのセクションカード************************************/
  
  #section_card3 {
    width: 90%;
    font-size: 14px;
    background: #fff;
    font-family: 'Alata', sans-serif;
    display: inline-block;
    margin: 16px 5% 2px 5%;
    padding: 1px 9px 4px 23px;
    border-radius: 12px;
    max-width: 90%;
    position: inherit;
    animation: slideIn3 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
    box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
        }
  
        @keyframes slideIn3 {
    0% {
      transform: translateX(180px);
      opacity: 0;
    }
    100% {
      transform: translateX(0);
    }
    40%,100% {
      opacity: 1;
    }
  }
  
  
  
  
  
        #section_card3:hover {    
          box-shadow: 0 2px 5px #ccc;    
  
        }
         #section_card3-skin:hover {    
           overflow: hidden;
           border-radius: 13px;
           box-shadow: 0 4px 15px rgba(0,0,0,.2);
        }
  
        #section_card3:active {    
          box-shadow: 0 1px 1px #ccc;    
          background: #f5f5f5;
        }
  
          
  
  /***********************************シフトないのセクションカード************************************/
  
  
  




    
  
    .back_icon{
      position: absolute;
    top: 12px;
    left: 12px;
    font-size: 16px;
    color: #4169e1;
    }

     
    .back_icon2{
      position: absolute;
    top: 12px;
    left: 12px;
    font-size: 16px;
    color: #4169e1;
    z-index: 999999;
    }

       
    .back_icon3{
      position: absolute;
    top: 12px;
    right: 12px;
    font-size: 16px;
    color: #4169e1;
    z-index: 999999;
    }

    .back_icon4{
      position: absolute;
    top: 15px;
    left: 12px;
    font-size: 16px;
    color: #4169e1;
    }
    .back_icon5{
      position: absolute;
      top: 0px;
      left: 0px;
      font-size: 16px;
      color: #4169e1;
      z-index: 99999;
      padding: 15px 12px 15px 12px;
      border-radius: 25px;
    }

    .back_icon5:hover {
      color: #2242a1;
      background: #ebebeb;
    }
    
    .back_icon5:active {
      color: #2242a1;
      background: #ebebeb;
    }



    .back_icon6{
      position: absolute;
      top: 0px;
      left: 5px;
      font-size: 16px;
      color: #ffffff;
      z-index: 99999;
      padding: 15px 12px 15px 12px;
      border-radius: 25px;
    }

    .back_icon6:hover {
      color: #eaeaea;
      background: #ebebeb;
    }
    
    .back_icon6:active {
      color: #e1e0e0;
      background: #ebebeb;
    }


    .back_icon6 i{
      font-size: 27px!important;
    }


  /***********************************要素ごとの囲み枠************************************/
  .icon_block {
    font-weight: bold;
      text-decoration: none;
      display: inline-block;
      text-align: center;
      /* margin: 13px 3px 3px 3px; */
      padding: 1px 1px 1px 1px;
      background-color: #e07641;
      color: #fff;
      border-radius: 50px;
      width: 30px;
      height: 30px;
      }
  
    /***********************************要素ごとの囲み枠************************************/  
  
  
  
  
  
  
  
  /***********************************要素ごとの囲み枠************************************/
  .select_block {
      width:auto;
      font-size:13px;
      font-weight:bold;
      text-decoration:none;
      display: inline-block; 
      text-align:center;
      margin: 3px 3px 3px 3px;
      padding: 5px 11px 5px 11px;
  
  
      background-color:#e6e6e6;
      color: #333333;
      border-radius:25px;
  }
  /***********************************要素ごとの囲み枠************************************/
  
  
  /***********************************もどるボタン************************************/
  .top_share_btn4 {
      color: #fff;
      background-color: #333333;
      font-size: 17px;
      margin: 1px 2px 1px 1px;
      padding: 1px 12px 1px 12px;
      
      border-radius: 0px 60px 60px 00px;
      display: inline-block;
      height: 37px;
      text-align: center;
      line-height: 37px!important;
  }
  
  .top_share_btn4:hover {
     color: #b3b3b3;
       background-color: #1a1a1a;
     cursor: pointer;
     text-decoration: none;
  }
  
  .top_share_btn4:active {
     color: #1a1a1a;
       background-color: #000000;
     cursor: pointer;
     text-decoration: none;
  }
  /***********************************もどるボタン************************************/
  
  
  
  
  
  
  /***********************************アカウントバー関連************************************/
  #account_bar {
          position: absolute;
          top: 3%;
          right: 0%;
          width: 10%;
          padding: 0px;
          font-size: 13px;
          
          font-family: "Franklin Gothic Medium";
          min-width: 120px;
        }
  
  #account_bar img {
    width:40px;
    height:40px;
    object-fit:cover;
    border-radius:50%;
  }
  
  
  
  .account_img {
    width:60px;
    height:60px;
    object-fit:cover;
    border-radius:50%;
  }
  
  
  .account_img {
    width:60px;
    height:60px;
    object-fit:cover;
    border-radius:50%;
    transition-duration: 0.5s;
  }
  
  .account_img:hover {
  box-shadow: 0 4px 15px rgba(0,0,0,.2);
  animation: poyoyon2 1s ease-in-out 1 forwards;
  transform: scale(1.2);
  transition-duration: 0.5s;
  }
  .account_img:active {
  animation: poyoyon2 1s ease-in-out 1 forwards;
  box-shadow: 0 9px 30px rgba(0,0,0,.2);
  }
  
  
  @keyframes poyoyon2 {
    0%  {
      transform: scale(1.0, 1.0) translate(0, 0);
    }
    15% {
      transform: scale(0.98, 0.9) translate(0, 5px);
    }
    30% {
      transform: scale(1.02, 1.0) translate(0, 8px);
    }
    50% {transform: scale(0.98, 1.05) translate(0, -8px);
    }
    70% {
      transform: scale(1.0, 0.9) translate(0, 5px);
    }
    100% {
      transform: scale(1.0, 1.0) translate(0, 0);
    }
    0%, 100% {
      opacity: 1;
    }
  }
  
  /***********************************アカウントバー関連************************************/
  
  
  
  
  
  
  
  /***********************************アカウントメニュー************************************/
  #account_menu{
          position: absolute;
          top: 9%;
          right: 1%;
          width: 22%;
          height: 58%;
          padding: 6px;
          font-size: 14px;
          
          font-family: "Noto Sans JP";
          display:inline-block;
          max-width: 900px;
          min-width: 150px;
          max-height: 800px;
          background: #fff;
          margin: 5px 5px 5px 5px;
          padding: 5px 5px 5px 15px;
          z-index: 999;
  
          border-radius: 9px;
          box-shadow: 0 2px 5px #ccc;
          display: none ;
  
  }
    
  
   #account_menu-skin{
    overflow: hidden;
    border-radius: 13px;
    box-shadow: 0 4px 15px rgba(0,0,0,.2);
  }
  
  
  /***********************************アカウントメニュー************************************/
  
  
  
  
  
  
  /*========================
  　smartphone　bottom menu
  　========================*/
  
  
  .mini-text{
    font-size: 11px;
    font-weight: bold;
    /* top: 20px; */
    margin: 5px;
    display: block;
  }/*文字大きさ*/

  #bottom-menu{
    display: none;
  }

  .wellcome_boad_title01_space{
    width: 100%;
    height: 135px;
    max-height: 8%;
    display: inline-block;
  }
  
  ul.bottom-menu {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 96%;
    height: 66px;
    margin: 0% 2% 2% 2%;
    padding: 0;
    background-color: #ffffff;
    /* border-top: 2px solid #808080; */
    /* border-bottom: 2px solid #808080; */
    z-index: 30;
    border-radius: 52px;
    /* box-shadow: 3px -22px 22px -22px #d5d8dd; */
    box-shadow: 0 5px 31px #ccc;
    }
  
    @media (display-mode: standalone){
    /* ここにPWA環境下でのみ実行する設定を記述 */
    ul.bottom-menu {
      height:61px;/*高さ*/
    }
    }
  
  

 
    ul.bottom-menu:active {
      box-shadow: 0 1px 3px #919191;
    }

    .bottom-menu:active{
      animation: poyoyon2 1s ease-in-out 1 forwards;
    }
   
    .bottom-menu:hover{
      animation: poyoyon2 1s ease-in-out 1 forwards;
    }
    


  
  
  
  
  ul.bottom-menu li {
      float:left;
      width:25%;
      list-style-type:none;
      text-align:center;
      font-size:25px;/*アイコンのサイズ*/}
  
  .bottom-menu li a {
      display: block;
      color:#686868;/*アイコン＆文字の色*/
      padding-top:5px;
      padding-bottom:5px;
      line-height:10px;
      text-decoration:none;}



  
 



  
  /* === 展開メニュー === */
  
  ul.menu-second-level {
      visibility: hidden;
      opacity: 0;
      z-index:1;}
  
  ul.menu-second-level li a{
      border-top:1px dashed #a9a9a9;/*展開の枠点線*/
          font-size:15px;/*展開メニューの文字サイズ*/
          line-height:30px;/*文字の縦幅*/}
  
  .menu-second-level li a:hover {
      height:100%;
      background: lightgrey;/*マウスオーバーの色*/}
  
  li.menu-width-max ul.menu-second-level {
      position: absolute;
      bottom: 47px;/*高さ*/
      left: 0;
      box-sizing: border-box;
      width: 100%;
      padding:0;}
  
  li.menu-width-max:hover ul.menu-second-level {
      bottom: 70px;/*高さ*/
      visibility: visible;
      opacity: 1;}
  
  li.menu-width-max ul.menu-second-level li {
      float: left;
      width: 100%;
      border: none;}
  
  

      .bottom_bar_btn_1{
      font-family: 'Material Icons Outlined';
      border-radius: 42px;
      transition: all 0.3s ease-in;
      position: relative;
  top: 0;
  left: 0;
      }
      .bottom_bar_btn_2{
      font-family: 'Material Icons Outlined';
      border-radius: 42px;
      transition: all 0.3s ease-in;
      position: relative;
  top: 0;
  left: 0;
      }
      .bottom_bar_btn_3{
        font-family: 'Material Icons Outlined';
        border-radius: 42px;
        transition: all 0.3s ease-in;
        position: relative;
  top: 0;
  left: 0;
      }
      .bottom_bar_btn_4{
        font-family: 'Material Icons Outlined';
        border-radius: 42px;
        transition: all 0.3s ease-in;position: relative;
        top: 0;
        left: 0;
      }
  


      .bottom_bar_btn_1:active {
        background: #dbdbdb;
      }
      .bottom_bar_btn_1:active span::after {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100px;
        height: 100px;
        margin-top: -50px;
        margin-left:-50px;
        content: "";
        background: #bbbbbb;
        border-radius: 100%;
        opacity: 0;
        animation: ripple 0.3s 1 ease-out;
      }
      

      .bottom_bar_btn_2:active {
        background: #dbdbdb;
      }
      .bottom_bar_btn_2:active span::after {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100px;
        height: 100px;
        margin-top: -50px;
        margin-left:-50px;
        content: "";
        background: #bbbbbb;
        border-radius: 100%;
        opacity: 0;
        animation: ripple 0.3s 1 ease-out;
      }

      .bottom_bar_btn_3:active {
        background: #dbdbdb;
      }
      .bottom_bar_btn_3:active span::after {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100px;
        height: 100px;
        margin-top: -50px;
        margin-left:-50px;
        content: "";
        background: #bbbbbb;
        border-radius: 100%;
        opacity: 0;
        animation: ripple 0.3s 1 ease-out;
      }


      .bottom_bar_btn_4:active {
        background: #dbdbdb;
      }
      .bottom_bar_btn_4:active span::after {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100px;
        height: 100px;
        margin-top: -50px;
        margin-left:-50px;
        content: "";
        background: #bbbbbb;
        border-radius: 100%;
        opacity: 0;
        animation: ripple 0.3s 1 ease-out;
      }



        #section1_checkboxB:checked ~ .bottom_bar_btn_1 .material-icons-outlined {
          font-family: 'Material Icons';
        }
        #section2_checkboxB:checked ~ .bottom_bar_btn_2 .material-icons-outlined {
          font-family: 'Material Icons';
        }
        #section3_checkboxB:checked ~ .bottom_bar_btn_3 .material-icons-outlined {
          font-family: 'Material Icons';
        }
        #section4_checkboxB:checked ~ .bottom_bar_btn_4 .material-icons-outlined {
          font-family: 'Material Icons';
        }


  
      #section1_checkboxB:checked ~ .bottom_bar_btn_1{
        color: #4169e1;
        font-family: 'Material Icons';
      }
  
  
      #section2_checkboxB:checked ~ .bottom_bar_btn_2{
        color: #4169e1;
        font-family: 'Material Icons';
      }
  
      #section3_checkboxB:checked ~ .bottom_bar_btn_3{
        color: #4169e1;
        font-family: 'Material Icons';
      }
      #section4_checkboxB:checked ~ .bottom_bar_btn_4{
        color: #4169e1;
        font-family: 'Material Icons';
      }
  
  
  
  .section1{
    opacity: 0;
    transition: opacity 0.5s, transform 0s 0.5s;
    transform: scale(0);
    background-color: #FFF;
    display: none;
  }
  #section1_checkbox:checked ~ .section1{
      display: block;
      opacity: 1;
      transform: scale(1);
      transition: opacity 0.5s;
      animation: popup 0.6s cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
      margin: 0px 0px 0px 0px;
  }
  
  
  
  
  
  
  .section2{
    opacity: 0;
    transition: opacity 0.5s, transform 0s 0.5s;
    transform: scale(0);
    background-color: #FFF;
    display: none;
  }
  #section2_checkbox:checked ~ .section2{
    display: block;
      opacity: 1;
      transform: scale(1);
      transition: opacity 0.5s;
      animation: popup 0.6s cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
      margin: 1px 0px 0px 0px;
  }
  
  
  
  
  
  
  .section3{
    opacity: 0;
    transition: opacity 0.5s, transform 0s 0.5s;
    transform: scale(0);
    background-color: #FFF;
    display: none;
    max-width: 99%;
  }
  #section3_checkbox:checked ~ .section3{
    display: block;
      opacity: 1;
      transform: scale(1);
      transition: opacity 0.5s;
      animation: popup 0.6s cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
      margin: 72px 0px 0px 0px;
  }
  
  
  
  
  
  
  
  .section4{
    opacity: 0;
    transition: opacity 0.5s, transform 0s 0.5s;
    transform: scale(0);
    background-color: #FFF;
    display: none;
  }
  #section4_checkbox:checked ~ .section4{
    display: block;
      opacity: 1;
      transform: scale(1);
      transition: opacity 0.5s;
      animation: popup 0.6s cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
      margin: 2px 0px 0px 0px;
  }
  
  
  @keyframes popup {
    0% {
      transform: translateY(40px) scale(0.8);
      opacity: 0;
    }
    100% {
      transform: translateY(0) scale(1.0);
    }
    80%, 100% {
      opacity: 1;
    }
  }
  
  
  
  
  
  
  
  
  
  
  .Step_card{
    background: #ffffff;
      box-shadow: 0 2px 8px rgb(30 30 80 / 30%);
      vertical-align: top;
      position: fixed;
      top: 42px;
      width: 100%;
      height: 47px;
      max-height: 47px;
      z-index: 2;
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 0 auto;
      padding: 2px 2px 2px 2px;
      text-align: center;
      overflow-x: auto;
  }
  
  @media (display-mode: standalone){
    /* ここにPWA環境下でのみ実行する設定を記述 */
    .Step_card{
      top: 82px;
    }
  }
  
  
  
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  .search_hint {
    display: inline-block;
      font-size: 15px;
      color: #306ADF;
      text-decoration: none;
      user-select: none;
      border: 1px #D6D8DC solid;
      border-radius: 20px;
      transition: 0.4s ease;
      margin: 4px 4px 4px 4px;
      padding: 2px 13px 2px 13px;
      max-height: 40px;
      white-space: nowrap;
  }
  
  .search_hint:hover {
    color: #1c3d80;
    background: #f0f8ff;
  }
  
  .search_hint:active {
    color: #153A95;
    border: 1px #153A95 solid;
    background: #D3E0F8;
  }
  
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  /***********************************Googleマテリアルアイコン************************************/
  .material-icons {

    font-weight: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
  
    
    display: inline-flex;
    vertical-align: middle;
  }

  

  .material-icons-outlined {

    font-weight: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
  
    
    display: inline-flex;
    vertical-align: middle;
  }


  /***********************************Googleマテリアルアイコン************************************/
  
  
  .data_view_area{
    margin: 20px 0px 0px 0px;
    max-width: 98%;
  }
  
  
  #data_view_area1{
    margin: 0px 0px 0px 0px;
    max-width: 98%;
    max-height: 90%;
      overflow: scroll;
      scroll-behavior: smooth;
  }
  
  .card_title{
    margin: 9px 0px 0px 5px;
      display: block;
      width: 100%;
      height: 37px;
  }
  
  
  
  
  .card_input_section:hover {    
      box-shadow: 0 2px 5px #ccc;    
      background: #cecece;
  
    }
  
    .card_input_section:active {    
      box-shadow: 0 1px 1px #ccc;    
      background: #dadada;
    }
  
    #ex_chart {max-width:640px;max-height:480px;}
  
  
  
  
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  .memu-button2 {
    display: inline-block;
      font-size: 16px;
      color: #306ADF;
      text-decoration: none;
      user-select: none;
      border-radius: 29px;
      transition: 0.4s ease;
      margin: 12px 5% 0px 5%;
      padding: 6px 14px 6px 14px;
      width: 90%;
      text-decoration: none;
      border: 1px #D6D8DC solid;
      text-align: center;
  }
  
  .memu-button2:hover {
    color: #1c3d80;
    background: #f0f8ff;
  }
  
  .memu-button2:active {
    color: #153A95;
    background: #D3E0F8;
  }
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  
  
  
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  .memu-button3 {
    display: inline-block;
      font-size: 16px;
      color: #df3030;
      text-decoration: none;
      user-select: none;
      border-radius: 29px;
      transition: 0.4s ease;
      margin: 12px 5% 0px 5%;
      padding: 6px 14px 6px 14px;
      width: 90%;
      text-decoration: none;
      border: 1px #D6D8DC solid;
      text-align: center;
  }
  
  .memu-button3:hover {
    color: #801c1c;
    background: #f0f8ff;
  }
  
  .memu-button3:active {
    color: #951515;
    background: #D3E0F8;
  }
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  
  
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  .memu-button4 {
    display: inline-block;
      font-size: 16px;
      color: #c0c8da;
      text-decoration: none;
      user-select: none;
      border-radius: 29px;
      transition: 0.4s ease;
      margin: 12px 5% 0px 5%;
      padding: 6px 14px 6px 14px;
      width: 90%;
      text-decoration: none;
      border: 1px #D6D8DC solid;
      text-align: center;
  }
  
  .memu-button4:hover {
    color: #616979;
    background: #f0f8ff;
  }
  
  .memu-button4:active {
    color: #878b96;
    background: #D3E0F8;
  }
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  

    /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
    .memu-button5 {
      display: inline-block;
      font-size: 16px;
      color: #FFF;
      background: #306ADF;
      text-decoration: none;
      user-select: none;
      border-radius: 29px;
      transition: 0.4s ease;
      margin: 12px 5% 0px 5%;
      padding: 6px 14px 6px 14px;
      width: 90%;
      text-decoration: none;
      text-align: center;
    }
    
    .memu-button5:hover {
      color: #0c214b;
      background: hsl(208, 81%, 80%);
    }
    
    .memu-button5:active {
      color: #091636;
      background: #7a9ad4;
    }
    /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
    
    
  
  
    /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
    .memu-button6 {
      display: inline-block;
      font-size: 16px;
      color: #FFF;
      background: #df3030;
      text-decoration: none;
      user-select: none;
      border-radius: 29px;
      transition: 0.4s ease;
      margin: 12px 5% 0px 5%;
      padding: 6px 14px 6px 14px;
      width: 90%;
      text-decoration: none;
      text-align: center;
    }
    
    .memu-button6:hover {
      color: rgb(245, 182, 182);
      background: #530404
    }
    
    .memu-button6:active {
      color: #091636;
      background: #570404;
    }
    /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
    
    
  
  
  
  
  
  
  #install_title{
    top: 200px;
      font-size: 30px;
      width: 90%;
      position: fixed;
      color: #FFF;
  }
  
  
  
  .install_div{
    display: flex;
      justify-content: center;
      overflow: auto;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 9999;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0.9);
      opacity: 1;
      padding: 20px;
  
  }
  





    /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
    .memu_button_new01 {
      display: inline-block;
    font-size: 25px;
    color: #642929;
    background: #ffffff;
    text-decoration: none;
    user-select: none;
    border-radius: 29px;
    transition: 0.4s ease;
    margin: 12px 5% 0px 5%;
    padding: 14px 14px 14px 14px;
    width: 90%;
    text-decoration: none;
    text-align: center;
    }
    
    .memu_button_new01:hover {
      color: #0c214b;
      background: #c5c5c5;
    }
    
    .memu_button_new01:active {
      color: #091636;
      background: #c5c5c5;
    }
    /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
    



        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/



        .memu_button_new02 {
          display: block;
          font-size: 18px;
          font-weight: 600;
          color: #FFF;
          background: #1457f1;
          border-radius: 17px;
          border: none;
          margin: 12px 6% 0px 6%;
          padding: 12px 14px 12px 14px;
          width: 88%;
          text-decoration: none;
          text-align: center;
          bottom: 93px;
          display: inline-block
        }
        
        .memu_button_new02:hover {
          color: #8e9fc7;
          background: #0f44c1;
        }
        
        .memu_button_new02:active {
          color: #8e9fc7;
          background: #0f44c1;
        }


        .memu_button_new02_no {
          display: block;
          font-size: 18px;
          font-weight: 600;
          color: #FFF;
          background: #b5b5b5;
          border-radius: 17px;
          border: none;
          margin: 12px 6% 0px 6%;
          padding: 12px 14px 12px 14px;
          width: 88%;
          text-decoration: none;
          text-align: center;
          bottom: 93px;
          display: inline-block;
        }


        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        








        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/



        .memu_button_new02_b {
          display: block;
          font-size: 18px;
          font-weight: 600;
          color: #FFF;
          background: #1457f1;
          border-radius: 17px;
          border: none;
          margin: 12px 6% 0px 6%;
          padding: 12px 14px 12px 14px;
          width: 88%;
          text-decoration: none;
          text-align: center;
          bottom: 117px;
          display: inline-block;
        }
        
        .memu_button_new02_b:hover {
          color: #8e9fc7;
          background: #0f44c1;
        }
        
        .memu_button_new02_n:active {
          color: #8e9fc7;
          background: #0f44c1;
        }




        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        .memu_button_new03 {
          display: block;
          font-size: 18px;
          font-weight: 600;
          color: #1457f1;
          background: #ffffff;
          border-radius: 17px;
          border: none;
          margin: 12px 6% 0px 6%;
          padding: 12px 14px 12px 14px;
          width: 88%;
          text-decoration: none;
          text-align: center;
          bottom: 33px;
          display: inline-block;
        }
        
        .memu_button_new03:hover {
          color: #09318f;
          background: #e5e5e5;
        }
        
        .memu_button_new03:active {
          color: #09318f;
          background: #e5e5e5;
        }
        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        




        .memu_button_new03_b {
          display: block;
          font-size: 18px;
          font-weight: 600;
          color: #1457f1;
          background: #ffffff;
          border-radius: 17px;
          border: none;
          margin: 12px 6% 0px 6%;
          padding: 12px 14px 12px 14px;
          width: 88%;
          text-decoration: none;
          text-align: center;
          bottom: 33px;
          display: inline-block;
        }
        
        .memu_button_new03_b:hover {
          color: #09318f;
          background: #e5e5e5;
        }
        
        .memu_button_new03_b:active {
          color: #09318f;
          background: #e5e5e5;
        }





        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        .memu_button_new03_e {
          display: block;
          font-size: 18px;
          font-weight: 600;
          color: #1457f1;
          background: #ffffff;
          border-radius: 17px;
          border: none;
          margin: 12px 6% 0px 6%;
          padding: 12px 14px 12px 14px;
          width: 88%;
          text-decoration: none;
          text-align: center;
          bottom: 33px;
          display: inline-block;
        }
        
        .memu_button_new03_e:hover {
          color: #09318f;
          background: #e5e5e5;
        }
        
        .memu_button_new03_e:active {
          color: #09318f;
          background: #e5e5e5;
        }
        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        





        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        .memu_button_new04 {
          display: block;
    font-size: 17px;
    font-weight: 600;
    color: #606060;
    background: #f4f4f4;
    border-radius: 17px;
    border: none;
    margin: 16px 6% 0px 6%;
    padding: 11px 13px 10px 11px;
    width: 88%;
    text-decoration: none;
    text-align: left;
        }
      




        .memu_button_new04:hover {
          color: #323232;
          background: #cdcdcd;
        }
        
        .memu_button_new04:active {
          color: #323232;
          background: #cdcdcd;
        }
        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        


  






        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        .memu_button_new05 {
          display: inline-block;
          bottom: 0px;
          right: 1px;
          font-size: 1.2em;
          font-weight: 600;
          color: #1457f1;
          background: #ffffff;
          border-radius: 17px;
          border: none;
          margin: 0px 6% 0px 6%;
          padding: 1vh 14px 1vh 14px;
          width: 87%;
          text-decoration: none;
          text-align: center;
          max-height: 8vh;
      }
        
        .memu_button_new05:hover {
          color: #09318f;
          background: #e5e5e5;
        }
        
        .memu_button_new05:active {
          color: #09318f;
          background: #e5e5e5;
        }
        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        








                /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
                .memu_button_new07 {
                  display: block;
                  font-size: 18px;
                  font-weight: 800;
                  color: #1457f1;
                  background: #ffffff;
                  border-radius: 17px;
                  border: none;
                  margin: 4px 6% 0px 3%;
                  padding: 12px 14px 12px 14px;
                  text-decoration: none;
                  text-align: center;
                  display: inline-block;
                  left: 1px;
                }
                
                .memu_button_new07:hover {
                  color: #09318f;
                  background: #e5e5e5;
                }
                
                .memu_button_new07:active {
                  color: #09318f;
                  background: #e5e5e5;
                }
                /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
                

                





                    /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
    .memu_button_new08 {
      display: inline-block;
      font-size: 19px;
      font-weight: 300;
      color: #ffffff;
      text-decoration: none;
      user-select: none;
      border-radius: 29px;
      transition: 0.4s ease;
      margin: 12px 10% 0px 10%;
      padding: 11px 6px 11px 6px;
      width: 80%;
      text-decoration: none;
      text-align: center;
      border: solid 1px #FFF;
    }
    
    .memu_button_new08:hover {
      color: #0c214b;
      background: #c5c5c5;
    }
    
    .memu_button_new08:active {
      color: #091636;
      background: #c5c5c5;
    }
    /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
    











  
    .popup_main_content_SUB_scroll {
      height: 78vh;
      overflow: scroll;
      padding: 0vh 3vh;
  }
  

    
  .popup_main_content_SUB_scroll2 {
    height: 71vh;
    overflow: scroll;
    padding: 0vh 3vh;
}



  @media (display-mode: standalone){
    /* ここにPWA環境下でのみ実行する設定を記述 */
  .install_div{
  display: none;
  }
  }
  
  

  
  
  /*====================================================================
  アプリインストールの吹き出し（iPhone）
  ====================================================================*/
  .oneArea {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 200px;
  }
  /* 吹き出し本体 */
  .fukidasi {
    position: fixed;
      display: inline-block;
      margin: 0 0 9px 0;
      padding: 15px 20px;
      min-width: 90%;
      max-width: 100%;
      color: #333;
      font-size: 16px;
      background: #fff;
      border: solid 3px #333;
      box-sizing: border-box;
      border-radius: 12px;
      bottom: 1px;
      left: 1px;
  }
  .fukidasi:before{
    content: "";
    position: absolute;
    bottom: -24px;
    left: 50%;
    margin-left: -15px;
    border: 12px solid transparent;
    border-top: 12px solid #fff;
    z-index: 2;
  }
  .fukidasi:after{
    content: "";
    position: absolute;
    bottom: -30px;
    left: 50%;
    margin-left: -17px;
    border: 14px solid transparent;
    border-top: 14px solid #333;
    z-index: 1;
  }
  .fukidasi p {
    margin: 0;
    padding: 0;
  }
  /*====================================================================
  アプリインストールの吹き出し（iPhone）
  ====================================================================*/
  
  
  
  









  
  
  
  /*====================================================================
  アプリインストールの吹き出し（Android）
  ====================================================================*/
  .oneArea2 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 200px;
  }
  /* 吹き出し本体 */
  .fukidasi2 {
    position: fixed;
    display: inline-block;
    margin: 15px 0 0 0;
    padding: 15px 20px;
    min-width: 90%;
    max-width: 100%;
    color: #333;
    font-size: 16px;
    background: #fff;
    border: solid 3px #333;
    box-sizing: border-box;
    border-radius: 12px;
    left: 1px;
    top:1px;
  }
  .fukidasi2:before{
    content: "";
    position: absolute;
    top: -24px;
    left: 96%;
    margin-left: -15px;
    border: 12px solid transparent;
    border-bottom: 12px solid #fff;
    z-index: 2;
  }
  .fukidasi2:after{
    content: "";
    position: absolute;
    top: -30px;
    left: 50%;
    margin-left: -17px;
    border: 14px solid transparent;
    border-bottom: 14px solid #333;
    z-index: 1;
  }
  .fukidasi2 p {
    margin: 0;
    padding: 0;
  }
  /*====================================================================
  アプリインストールの吹き出し（Android）
  ====================================================================*/
  
  
  
  
  
  
  
  
  /***********************************コピーボタン************************************/
  .edit_btn {
    color: #1a73e8;
    font-size: 19px;
    margin: 3px 3px 3px 3px;
    padding: 6px 13px 6px 13px;
    border-radius: 10%;
    font-size: 15px;
    border: none;
  }
  .edit_btn:hover {
    background-color: #F7F9FE;
     cursor: pointer;
     text-decoration: none;
  }
  
  .edit_btn:active {
    background-color: #D6E2F8;
     cursor: pointer;
     text-decoration: none;
  }
  /***********************************コピーボタン************************************/
  
  
  
  #home_data_area{
    padding: 0px 0px 100px 0px;
  }
  
  
  #home_data_area{
      max-height: 90%;
      overflow: scroll;
      scroll-behavior: smooth;
  }
  
  .header_user_pic_area img {
    width: 44px;
    height: 44px;
    margin: 30px 0px 0px 0px;
    left: 26px;
    position: absolute;
    border-radius: 50%;
}



.account_pic {
  width: 37px;
  height: 37px;
  border-radius: 50%;
  float: left;
  display: inline-block;
  margin: 7px 1px 1px 1px;
}

.home_user_pic{
  width: 100%;
  height: 172px;
  object-fit: cover;
  min-width: 100%;
  border-radius: 22px 22px 0px 0px;
}

.account_pic_name{
  display: inline-block;
    margin: 1px 1px 0px 1px;
    line-height: 1;
    padding: 14px 1px 1px 9px;
    height: 37px;
}
  
.main_header_background{
  margin: 0px 0px 0px 0px;
}
.header_area{
  background: #E5ECFF;
  height: 200px;
}

.header_user_name_area{
  position: absolute;
    top: 98px;
    text-align: left;
    left: 20px;
}

.wellcome_user_title1{
  font-size: 22px;
  line-height: 0.3;
}
.wellcome_user_title2{
  font-size: 37px;
    font-weight: bold;
    line-height: 0.1;
}


.wellcome_user_title3{
  font-size: 26px;
  font-weight: bold;
  line-height: 0.1;
  text-align: left;
  margin-left: 20px;
}

.wellcome_user_title4{
  font-size: 26px;
  font-weight: bold;
  line-height: 0.1;
  text-align: left;
  margin-left: 20px;
  margin-top: 81px;
}





  /***********************************トップカード************************************/
.section9 {
  padding: 12px 23px 12px 23px;
  margin: 10px 6% 10px 6%;
  max-width: 88%;
  width: 900px;
  background-color: #16244d;
  color: #fff;
  font-family: 'Alata', sans-serif;
  border-radius: 33px;
  float: left;
  }
  
  .section9_text {
  width: 70%;
  float: left;
  }
  
  .section9 .title_text {
    width: 55%;
    float: left;
    font-size: 19px;
    font-weight: bold;
    text-align: left;
    line-height: 0.3px;
  }

  .section9 .title_body {
    width: 55%;
    float: left;
    font-size: 15px;
    text-align: left;
  }

  .section9_img {
  width: 45%;
  float: right;
  }

  /***********************************トップカード************************************/
  







  /***********************************トップカード************************************/
.section10 {
  padding: 19px 23px 12px 23px;
  margin: 10px 6% 10px 6%;
  max-width: 88%;
  width: 900px;
  background-color: #2f6208;
  color: #fff;
  font-family: 'Alata', sans-serif;
  border-radius: 33px;
  float: left;
  }
  
  .section10_text {
  width: 70%;
  float: left;
  }
  
  .section10 .title_text {
    width: 90%;
    float: left;
    font-size: 19px;
    font-weight: bold;
    text-align: left;
    line-height: 0.3px;
    margin: 10px 0px 10px 0px;
  }

  .section10 .title_body {
    width: 90%;
    float: left;
    font-size: 15px;
    text-align: left;
    margin: 10px 0px 6px 0px;
  }

  .section10_img {
  width: 45%;
  float: right;
  }

  /***********************************トップカード************************************/








  /***********************************トップカード************************************/
.section11 {
  padding: 19px 23px 12px 23px;
  margin: 10px 6% 10px 6%;
  max-width: 88%;
  width: 900px;
  background-color: #62083d;
  color: #fff;
  font-family: 'Alata', sans-serif;
  border-radius: 33px;
  float: left;
  }
  
  .section11_text {
  width: 70%;
  float: left;
  }
  
  .section11 .title_text {
    width: 90%;
    float: left;
    font-size: 19px;
    font-weight: bold;
    text-align: left;
    line-height: 0.3px;
    margin: 10px 0px 10px 0px;
  }

  .section11 .title_body {
    width: 90%;
    float: left;
    font-size: 15px;
    text-align: left;
    margin: 10px 0px 6px 0px;
  }

  .section11_img {
  width: 45%;
  float: right;
  }

  /***********************************トップカード************************************/





  /***********************************トップカード************************************/
.section12 {
  padding: 19px 23px 12px 23px;
  margin: 10px 6% 10px 6%;
  max-width: 88%;
  width: 900px;
  background-color: #086262;
  color: #fff;
  font-family: 'Alata', sans-serif;
  border-radius: 33px;
  float: left;
  }
  
  .section12_text {
  width: 70%;
  float: left;
  }
  
  .section12 .title_text {
    width: 90%;
    float: left;
    font-size: 19px;
    font-weight: bold;
    text-align: left;
    line-height: 0.3px;
    margin: 10px 0px 10px 0px;
  }
  .section12 .title_body {
    width: 90%;
    float: left;
    font-size: 15px;
    text-align: left;
    margin: 10px 0px 6px 0px;
  }

  .section12_img {
  width: 45%;
  float: right;
  }

  /***********************************トップカード************************************/



  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  .memu-button1 {
    display: inline-block;
    font-size: 15px;
    color: #306ADF;
    text-decoration: none;
    user-select: none;
    border-radius: 4px;
    transition: 0.4s ease;
    margin: 2px 0px 2px 0px;
   padding: 7px 17px 7px 17px;
   width:100%;
   text-decoration: none;
  }
  
  .memu-button1:hover {
    color: #1c3d80;
    background: #f0f8ff;
  }
  
  .memu-button1:active {
    color: #153A95;
    background: #D3E0F8;
  }
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  
  
  
  
  #swipe_area{
    height: 100%;
      width: 66px;
      top: 0px;
      left: 0px;
      background: none;
      position: fixed;
      z-index: 9999;
  }

  #swipe_area2{
    height: 100%;
      width: 66px;
      top: 0px;
      left: 0px;
      background: none;
      position: fixed;
      z-index: 9999;
  }


  #swipe_area3{
    height: 100%;
      width: 66px;
      top: 0px;
      left: 0px;
      background: none;
      position: fixed;
      z-index: 9999;
  }
  

  #swipe_area4{
    height: 66px;
      width: 100%;
      top: 0px;
      left: 0px;
      background: none;
      position: fixed;
      z-index: 9999;
  }


  #swipe_area5{
    height: 100%;
      width: 66px;
      top: 0px;
      left: 0px;
      background: none;
      position: fixed;
      z-index: 9999;
  }
  #swipe_area6{
    height: 100%;
      width: 66px;
      top: 0px;
      left: 0px;
      background: none;
      position: fixed;
      z-index: 9999;
  }



  
  .bottom-menu li a .material-icons{
    font-size: 32px;
  }
  .bottom-menu li a .material-icons-outlined{
    font-size: 32px;
  }




/***********************************　ポップアップ_BOTTOM　　************************************/
.modal_overlay_BOTTOM{
  display: flex;
  justify-content: flex-end;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 12000;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.4);
  opacity: 0;
  transition: opacity 0.2s, transform 0s 0.2s;
  transform: scale(0);
}
.modal_trigger_BOTTOM{
  position: absolute;
  width: 100%;
  height: 100%;
}
.modal_content_BOTTOM{
  align-self: flex-end;
    width: 100%;
    min-width: 100%;
    max-height: 90%;
    padding: 20px 15px 40px 15px;
    box-sizing: border-box;
    transform: translateY(100%);
    transition: 0.2s;
    border-radius: 30px 30px 0px 0px;
    box-shadow: 0 2px 2px #ccc;
    background-color: #fff;
    position: absolute;
}
 
#modal_content_BOTTOM-skin{
overflow: hidden;
border-radius: 11px;
box-shadow: 0 4px 15px rgba(0,0,0,.1);
}   
.close_button_BOTTOM{
  position: absolute;
  top: 14px;
  right: 16px;
  font-size: 28px;
  cursor: pointer;
}

.modal_wrap_BOTTOM input:checked ~ .modal_overlay_BOTTOM{
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.2s;
}

.modal_wrap_BOTTOM input:checked ~ .modal_overlay_BOTTOM .modal_content_BOTTOM{
  transform: translateY(2px);
}
/***********************************　ポップアップ_BOTTOM　　************************************/


.card_BOTTOM_title{
  margin: 1px 3px 10px 0px;
}


.more_icon{
  position: absolute;
    right: 9px;
    top: 12px;
    font-size: 32px!important;
    color: #bfbfbf;
    font-weight: bold;
}
.more_icon2{
  position: absolute;
    right: 9px;
    top: 3px;
    font-size: 32px!important;
    color: #bfbfbf;
    font-weight: bold;
}
.more_icon3{
  position: absolute;
    right: 9px;
    top: 12px;
    font-size: 32px!important;
    color: #bfbfbf;
    font-weight: bold;
    display: contents;
}

/***********************************BACK_menu************************************/

#BACK_menu {
  position: fixed;
  display: none;
  top: 0%;
  width: 100%;
  height: 8%;
  font-size: 14px;
  
  color: #fff;
  background: #000;
  margin: 0px 0px 0px 0px;
  padding: 20px 7px 20px 7px;
  z-index: 999;
  border-radius: 1px;
  box-shadow: 0 20px 20px #000;

  z-index: 99999;
  opacity: 0.8;

  animation: slideIn 0.4s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;

}

@keyframes slideIn {
0% {
transform: translateY(-30px);
opacity: 0;
}
100% {
transform: translateY(0);
}
40%,100% {
opacity: 0.8;
}
}
/***********************************BACK_menu************************************/



/***********************************BACK_menu2************************************/

#BACK_menu2 {
  position: fixed;
  display: none;
  top: 0%;
  width: 100%;
  height: 8%;
  font-size: 14px;
  
  color: #fff;
  background: #000;
  margin: 0px 0px 0px 0px;
  padding: 20px 7px 20px 7px;
  z-index: 999;
  border-radius: 1px;
  box-shadow: 0 20px 20px #000;

  z-index: 99999;
  opacity: 0.8;

  animation: slideIn 0.4s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;

}

/***********************************BACK_menu2************************************/





.BIG_modal_section6{
  background-color: #262929;
  margin: 13px 8px 0px 8px;
      padding: 12px 4px 4px 23px;
      border-radius: 14px;
      position: initial;
      z-index: 99999;
      display: grid;
      float: left;
      color: #FFF;
      width: 450px;
    
  }


  .flat_title{
    margin-top: 4px;
    position: absolute;
    /* width: 60px; */
    height: 30px;
    }
    

    .flat_btn{
      margin-left: 80%;
    }
    
 /***********************************　iPhone風のトグルボタン　　************************************/
.c-switch-check {
  display: none;
}
.c-switch-label {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 30px;
  border-radius: calc(30px / 2);
  background: #cccccc;
  transition: background 200ms;
}
.c-switch-label::before {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  display: block;
  width: calc(30px - 4px);
  height: calc(30px - 4px);
  border-radius: calc((30px - 4px) / 2);
  background: #ffffff;
  transform: translateX(0);
  transition: transform 200ms;
}
.c-switch-check:checked + .c-switch-label {
  background: #3dcc55;
}
.c-switch-check:checked + .c-switch-label::before {
  transform: translateX(calc((50px - 4px) - (30px - 4px)));
}

/***********************************　iPhone風のトグルボタン　　************************************/





/***********************************　　　要素内　検索ボックス************************************/
.search_text_input{
  border-radius: 35px;
    height: 48px;
    flex: 1;
    max-width: 86%;
    width: 86%;
    background-color: #e9e9e9;
    color: var(--font-color);
    font-size: 20px;
    margin: 10px 7% 10px 7%;
    padding: 13px 20px 13px 20px;
    box-shadow: 0 0px 0px #fff;
    border: none;
    font-family: 'Lato', sans-serif;
    font-family: FontAwesome;
}


.search_text_input:hover {
box-shadow: 0 0px 1px #b3b3b3;
background-color: #fff;
border: solid 1px #dcdcdc;
}
.search_text_input:active {
box-shadow: 0 2px 5px #ccc;
background-color: #fff;
border: solid 1px #dcdcdc;
}
.search_text_input:focus {
box-shadow: 0 2px 5px #ccc;
background-color: #fff;
outline: 0;
border: solid 1px #dcdcdc;
}
/***********************************　　　要素内　検索ボックス************************************/



/***********************************　1行の文章（新テンプレ）　　************************************/
.Form-Item-Input-b {
  border: 1px solid #ddd;
  border-radius: 6px;
  padding-left: 1em;
  padding-right: 1em;
  height: 48px;
  flex: 1;
  width: 90px;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Input-b {
    margin-left: 0;
    margin: 10px;
    height: 40px;
    flex: inherit;
    font-size: 19px;
  }
}
/***********************************　1行の文章（新テンプレ）　　************************************/


#data_view_area_B_back_btn{
  position: fixed;
  top: 1px;
  left: 1px;
  display: none;
  z-index: 9999;
  width: 100%;
  height: 70px;
  padding: 21px;
  font-size: 19px;
  background: -moz-linear-gradient(top, #FFC778, transparent);
  background: -webkit-linear-gradient(top, #FFF, transparent);
  background: linear-gradient(to bottom, #FFF, transparent);
}

#data_view_area_B_back_btn2{
  display: block;
    float: right;
    margin-right: 10px;
}


.end_body_card{
  background: #FFF;
    top: -24px;
    position: relative;
    border-radius: 25px 25px 0px 0px;
    width: 100%;
    padding: 31px 0px 0px 0px;
    box-shadow: 0 2px 5px #ccc;
}


.end_body_card_title1{
  font-size: 20px;
    font-weight: bold;
    margin: 0px 26px 0px 26px;
}


.end_body_card_table1{
  margin: 20px 6px 0px 0px;
  font-size: 17px;
}

.end_body_card_comment_card {
  margin: 14px 14px;
  padding: 12px 20px;
  font-size: 15px;
  color: #544e4e;
  font-weight: 200;
  background: #f3f3f3;
  border-radius: 19px;
}

.end_body_card_comment_card2 {
  margin: 14px 14px;
  padding: 12px 20px;
  font-size: 15px;
  color: #544e4e;
  font-weight: 200;
  border-radius: 19px;
  box-shadow: 3px 3px 19px 1px rgb(0 0 0 / 15%);
}



.end_body_card_comment_card_p_title{
  font-size: 18px;
    color: #2a2a2a;
    font-weight: bold;
    margin: 8px 0px 9px 0px;
}

.end_body_card_table1_icon{
  font-size: 21px;
    width: 26px;
    height: 26px;
    color: #1a73e8;
    padding: 2.5px;
}

.card_footer_btn_area{
  display: block;
  position: absolute;
  bottom: 8px;
  width: 100%;
  background: -webkit-linear-gradient(top, #FFF, transparent);
  background: linear-gradient(to bottom, #FFF, transparent);
  height: 60px;
}

.card_footer_btn{
  background: #1a73e8;
  width: 55.5%;
  display: inline-block;
  border-radius: 10px;
  font-size: 18px;
  color: #FFF;
  text-align: center;
  padding: 15px 0px 15px 0px;
  margin: 5px 3% 5px 0%;
  height: 50px;
}


.card_footer_btn_no{
  background: #bfc1c4;
  width: 55.5%;
  display: inline-block;
  border-radius: 10px;
  font-size: 18px;
  color: #FFF;
  text-align: center;
  padding: 15px 0px 15px 0px;
  margin: 5px 3% 5px 0%;
  height: 50px;
}


.card_footer_btn_cancel{
  background: #ea4747;
  width: 55.5%;
  display: inline-block;
  border-radius: 10px;
  font-size: 18px;
  color: #FFF;
  text-align: center;
  padding: 15px 0px 15px 0px;
  margin: 5px 3% 5px 0%;
  height: 50px;
}









.card_footer_btn2{
  background: #4FAEAE;
  width: 35.5%;
  display: inline-block;
  border-radius: 10px;
  font-size: 18px;
  color: #FFF;
  text-align: center;
  padding: 15px 0px 15px 0px;
  margin: 5px 1.5% 5px 3%;
  height: 50px;
}

.card_footer_btn2_no{
  background: #c4dddd;
  width: 35.5%;
    display: inline-block;
    border-radius: 10px;
    font-size: 18px;
    color: #a6c5c5;
    text-align: center;
    padding: 15px 0px 15px 0px;
    margin: 5px 3% 5px 1.5%;
    height: 50px;
}













.bookmark_btn{
  background: #b4b4b4;
    border-radius: 50%;
    font-size: 30px;
    color: #FFF;
    text-align: center;
    padding: 18px 0px 18px 0px;
    margin: 3px 3px 3px 3px;
    display: block;
    position: absolute;
    bottom: 81px;
    width: 60px;
    height: 60px;
    box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
    right: 6px;
}

.bookmark_btn:active {
  box-shadow: rgb(100 100 111 / 83%) 0px 2px 7px 0px;
  }

  .main_hr{
    border-top: 1px solid #d9d9d9;
    border-bottom: 1px solid #fff;
    height: 10px;
    border: 0;
    box-shadow: 0 7px 7px -10px #8c8b8b inset;
  }

  .bookmark_flag{
    background: #e8bf1a;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    color: #FFF;
    font-size: 20px;
    position: absolute;
    bottom: 12px;
    right: 12px;
    padding: 3px 3px 2px 4px;
    box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
  }



.bookmark_btn_active{
  background: #f5c717;
  border-radius: 50%;
  font-size: 30px;
  color: #fff;
  text-align: center;
  padding: 18px 0px 18px 0px;
  margin: 3px 3px 3px 3px;
  display: block;
  position: absolute;
  bottom: 81px;
  width: 60px;
  height: 60px;
  box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
  right: 6px;
}
.bookmark_btn_active:active {
  box-shadow: rgb(100 100 111 / 83%) 0px 2px 7px 0px;
  }



.noify_alert_text{
  margin: 25px 30px 10px 30px;
  font-size: 14px;
  color: #8b8b8b;
}

.noify_alert_text2{
  font-weight: bold;
  margin: 34px 0px 0px 20px;
  font-size: 18px;
  color: #8b8b8b;
}

.noify_alert_text3{
  margin: 25px 30px 10px 30px;
  font-size: 31px;
  font-weight: 800;
  color: #131313;
  line-height: 1.3;
}




.section_card_class_p{
  margin: 10px 1px 1px 1px;
}









.search_gps_gif{
  width: 50%;
  margin: 10px 25% 10px 25%;
}

.kyori_option_card1{
  border-radius: 25px;
  display: inline;
  padding: 5px 14px 5px 1px;
  margin: 2px 5px 2px 2px;
  color: #4285f4;
  border: 0.5px #d6d6d6 solid;
}

.kyori_option_card2{
  border-radius: 25px;
  display: inline;
  padding: 5px 14px 5px 1px;
  margin: 2px 5px 2px 2px;
  color: #ca9b20;
  border: 0.5px #d6d6d6 solid;
}

.kyori_option_card3{
  border-radius: 25px;
  display: inline;
  padding: 5px 14px 5px 1px;
  margin: 2px 5px 2px 2px;
  color: #FFF;
  border: 0.5px #d6d6d6 solid;
}





.kyori_option_title_card1{
  border-radius: 25px;
    background: #e7e6ff;
    display: inline;
    padding: 3px 10px 3px 10px;
    margin: 2px 5px 2px 2px;
    color: #4285f4;
}
.kyori_option_title_card2{
  border-radius: 25px;
  background: #434342;
  display: inline;
  padding: 3px 10px 3px 10px;
  margin: 2px 5px 2px 2px;
  color: #ca9b20;
}
.kyori_option_title_card3{
  border-radius: 25px;
  background: #f07d88;
  display: inline;
  padding: 3px 10px 3px 10px;
  margin: 2px 5px 2px 2px;
  color: #ffffff;
}



.kyori_option_car_card1{
  border-radius: 25px;
  background: #e6fffe;
  display: inline;
  padding: 3px 10px 3px 10px;
  margin: 2px 5px 2px 2px;
  color: #434343;
}
.kyori_option_car_card2{
  border-radius: 25px;
  background: #131313;
  display: inline;
  padding: 3px 10px 3px 10px;
  margin: 2px 5px 2px 2px;
  color: #ffd055;
}
.kyori_option_car_card3{
  border-radius: 25px;
  background: #ff5353;
  display: inline;
  padding: 3px 10px 3px 10px;
  margin: 2px 5px 2px 2px;
  color: #ffffff;
}




.kyori_option_card1_BIG{
  height: 100px;
    border-radius: 25px;
    display: block;
    padding: 5px 14px 5px 1px;
    margin: 100px 5px 2px 2px;
    color: #bdbdbd;
    font-size: 22px;
    font-weight: bold;
}
.kyori_option_title_card1_BIG{
  border-radius: 25px;
    background: #e7e6ff;
    display: inline;
    padding: 3px 10px 3px 10px;
    margin: 2px 5px 2px 2px;
    color: #4285f4;
}

.contengts_scrollY_card{
  width: 40%;
  font-size: 14px;
  background: #fff;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  display: inline-block;
  margin: 16px 2% 2px 2%;
  padding: 10px 13px 10px 13px;
  border-radius: 19px;
  max-width: 44%;
  min-width: 42%;
  position: inherit;
  animation: slideIn3 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
  box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
}

.data_view_buyed_customer1{
  overflow-x: scroll;
  display: flex;
}

.my_buy_flag{
  background: #4169e1;
  color: #FFF;
  border-radius: 18px;
  padding: 2px 11px;
  display: block;
  margin: 0px;
  font-size: 13px;
  display: inline;
}
.mini_card_title{
  font-size: 17px;
  font-weight: bold;
  text-align: left;
  margin: 6px 0px 2px 0px;
  color: #3f3f3f;
}
.mini_card_sub{
  font-size: 12px;
    text-align: left;
    margin: 0px 0px 2px 0px;
    color: #b5b5b5;
}

.mini_card_house{
  background: #fafafa;
  color: #4169e1;
  border-radius: 18px;
  padding: 2px 11px;
  display: contents;
  margin: 0px 3px 5px 0px;
  font-size: 13px;
  display: inline-block;
  border: 1px #e3e3e3 solid;
}
.mini_card_house2{
  background: #2b2b2b;
  color: #d8d8d8;
  border-radius: 18px;
  padding: 2px 11px;
  display: contents;
  margin: 0px 3px 5px 0px;
  font-size: 13px;
  display: inline-block;
  border: 1px #e3e3e3 solid;
}
.mini_card_house3{
  background: #e16c77;
  color: #ffffff;
  border-radius: 18px;
  padding: 2px 11px;
  display: contents;
  margin: 0px 3px 5px 0px;
  font-size: 13px;
  display: inline-block;
  border: 1px #e3e3e3 solid;
}





.mini_card_btn_blue{
  background: #4169e1;
    color: #ffffff;
  border-radius: 10px;
  padding: 2px 11px;
  display: block;
  margin-top: 11px;
  width: 100%;
  font-size: 13px;
  border: 2px #4169e1 solid;
  font-size: 17px;
  font-weight: bold;
}

.mini_card_btn_red{
  background: #ffffff;
  color: #f03f3f;
  border-radius: 10px;
  padding: 2px 11px;
  display: block;
  margin-top: 2px;
  width: 100%;
  font-size: 10px;
  border: 1px #e3e3e3 solid;
  font-size: 15px;
}




.mini_card_btn_red2{
  background: #ffffff;
  color: #f03f3f;
  border-radius: 10px;
  padding: 2px 14px;
  display: inline-block;
  margin-top: 2px;
  font-size: 10px;
  font-size: 15px;
  font-weight: bold;
}

  
  /***********************************　重要ボタン：青（新テンプレ）　　************************************/
  .button_6b {
    display: inline-block;
    font-size: 14px;
    color: #fff;
    text-decoration: none;
    user-select: none;
    background: #0152f2;
    border: 1px #3971E0 solid;
    border-radius: 27px;
    transition: 0.4s ease;
    margin: 0px 4px 7px 29px;
    padding: 5px 13px 5px 13px;
    }
    
    .button_6b:hover {
    color: #fff;
    background: #1d59b3;
    box-shadow: 0 4px 7px #ccc;
    }
    
    .button_6b:active {
    color: #fff;
    background: #0c264d;
    }
    /***********************************　重要ボタン：青（新テンプレ）　　************************************/
    
    



    /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  .button_1b {
    display: inline-block;
    font-size: 14px;
    color: #0152f2;
    text-decoration: none;
    user-select: none;
    border: 2px #D6D8DC solid;
    border-radius: 27px;
    transition: 0.4s ease;
    margin: 0px 4px 7px 29px;
    padding: 5px 13px 5px 13px;
    font-weight: bold;
    background: #FFF;
  }
  
  .button_1b:hover {
    color: #1c3d80;
    background: #f0f8ff;
  }
  
  .button_1b:active {
    color: #153A95;
    border: 1px #153A95 solid;
    background: #D3E0F8;
  }
  /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
  

  #pref_all_select_btn_area1{
    display: contents;
  }
  #pref_all_select_btn_area2{
    display: contents;
  }





/***********************************　ポップアップ_END　　************************************/
.modal_overlay_END{
  display: flex;
  justify-content: flex-end;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 12000;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.2);
  opacity: 0;
  transition: opacity 0.2s, transform 0s 0.2s;
  transform: scale(0);
}
.modal_trigger_END{
  position: absolute;
  width: 100%;
  height: 100%;
}
.modal_content_END{
  align-self: center;
  width: 93%;
  height: 100%;
  box-sizing: border-box;
  background: #fff;
  transform: translateX(100%);
  transition: 0.2s;
  border-radius: 8px;
  box-shadow: 0 2px 2px #ccc;
  position: absolute;
}
 
#modal_content_END-skin{
overflow: hidden;
border-radius: 11px;
box-shadow: 0 4px 15px rgba(0,0,0,.1);
}   
.close_button_END{
  position: absolute;
  top: 14px;
  right: 16px;
  font-size: 28px;
  cursor: pointer;
}

.modal_wrap_END input:checked ~ .modal_overlay_END{
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.2s;
}

.modal_wrap_END input:checked ~ .modal_overlay_END .modal_content_END{
  transform: translateX(2px);
}
/***********************************　ポップアップ_END　　************************************/





/***********************************　ポップアップ_END2　　************************************/
.modal_overlay_END2{
  display: flex;
  justify-content: flex-end;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 12000;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.2);
  opacity: 0;
  transition: opacity 0.2s, transform 0s 0.2s;
  transform: scale(0);
}
.modal_trigger_END2{
  position: absolute;
  width: 100%;
  height: 100%;
}
.modal_content_END2{
  align-self: center;
  width: 93%;
  height: 100%;
  padding: 10px 30px;
  box-sizing: border-box;
  background: #fff;
  transform: translateX(100%);
  transition: 0.2s;
  border-radius: 8px;
  box-shadow: 0 2px 2px #ccc;
  position: absolute;
}
 
#modal_content_END2-skin{
overflow: hidden;
border-radius: 11px;
box-shadow: 0 4px 15px rgba(0,0,0,.1);
}   
.close_button_END2{
  position: absolute;
  top: 14px;
  right: 16px;
  font-size: 28px;
  cursor: pointer;
}

.modal_wrap_END2 input:checked ~ .modal_overlay_END2{
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.2s;
}

.modal_wrap_END2 input:checked ~ .modal_overlay_END2 .modal_content_END2{
  transform: translateX(2px);
}
/***********************************　ポップアップ_END2　　************************************/





.bottom_btn_area{
  bottom: 1px;
    position: absolute;
    right: 1px;
    z-index: 9999999;
}




  /***********************************　重要ボタン：青（新テンプレ）　　************************************/
  .save_filter_btn01 {
    display: inline-block;
    font-size: 15px;
    color: #fff;
    text-decoration: none;
    user-select: none;
    background: #3971E0;
    border: 1px #3971E0 solid;
    border-radius: 8px;
    transition: 0.4s ease;
    margin: 10px 15px 30px 4px;
    padding: 7px 17px 7px 17px;
    min-width: 144px;
    height: 42px;
    }
    
    .save_filter_btn01:hover {
    color: #fff;
    background: #1d59b3;
    box-shadow: 0 4px 7px #ccc;
    }
    
    .save_filter_btn01:active {
    color: #fff;
    background: #0c264d;
    }
    /***********************************　重要ボタン：青（新テンプレ）　　************************************/
    


      /***********************************　重要ボタン：青（新テンプレ）　　************************************/
  .save_filter_btn02 {
    display: inline-block;
    font-size: 15px;
    color: #fff;
    text-decoration: none;
    user-select: none;
    background: #3971E0;
    border: 1px #3971E0 solid;
    border-radius: 8px;
    transition: 0.4s ease;
    margin: 10px 15px 30px 4px;
    padding: 7px 17px 7px 17px;
    min-width: 144px;
    height: 42px;
    }
    
    .save_filter_btn02:hover {
    color: #fff;
    background: #1d59b3;
    box-shadow: 0 4px 7px #ccc;
    }
    
    .save_filter_btn02:active {
    color: #fff;
    background: #0c264d;
    }
    /***********************************　重要ボタン：青（新テンプレ）　　************************************/
    




    .check_ui_01_label {
      cursor: pointer;
    padding-left: 11px;
    position: relative;
    font-size: 17px;
    width: 100%;
    display: block;
    padding: 11px 0px 11px 0px;
    border-bottom: 1px solid #c7c7c7;
    }
    
    
    .check_ui_01_label::before,
    .check_ui_01_label::after {
      content: "";
      display: block; 
      position: absolute;
    }
    
    .check_ui_01_label::before {
      background-color: #fff;
      border-radius: 22%;
      border: 1.4px solid #a1a1a1;
      width: 20px;
      height: 20px;
      transform: translateY(-50%);
      top: 50%;
      right: 2px;
    }
    
    .check_ui_01_label::after {
      border-bottom: 2px solid #4285f4;
      border-left: 2px solid #4285f4;
      opacity: 0;
      height: 8px;
      width: 17px;
      transform: rotate(-45deg);
      top: 16px;
      right: 3px;
    }
    
    .check_ui_01:checked + .check_ui_01_label::after {
      opacity: 1;
    }






    .filter_menu{
      width: 100%;
    height: 42px;
    margin: 8px 0px 8px 0px;
    padding: 5px 12px 8px 18px;
    display: block;
    position: relative;
    font-size: 19px;
    font-weight: bold;
    border-bottom: 2px solid #d0d0d0;
    }


    .popup_main_content_END_title{
      font-size: 22px;
    font-weight: bold;
    margin: 20px 12px 12px 17px;
    }

   
   .filter_menu:active {    
    background: #f3f3f3;
    }


    .wellcome_boad_div01{
      min-width: 100%;
      min-height: 100%;
      display: block;
      padding: 20px 20px 20px 20px;
      color: ffffff;
      backdrop-filter: blur(12px);
      background: url(images/triangles-1430105.png) no-repeat;
    background-size: cover;
    position: relative;
    z-index: 0;
    height: 100vh;
    overflow: scroll;
    }

    .wellcome_boad_div01::before {
      content: '';
      position: absolute;
      top: -5px;
      bottom: -5px;
      left: -5px;
      right: -5px;
      background: inherit;
      filter: blur(5px);
      /* position:absoluteのせいで最前面に来てしまうため */
      z-index: -1;
    }
   





    .wellcome_boad_div06{
      min-width: 100%;
      min-height: 100%;
      display: block;
      padding: 20px 20px 20px 20px;
      color: ffffff;
      backdrop-filter: blur(12px);
      background: url(images/bulb-7091379_1920.jpg) no-repeat;
    background-size: cover;
    position: relative;
    z-index: 0;
    height: 100vh;
    }

    .wellcome_boad_div06::before {
      content: '';
      position: absolute;
      top: -5px;
      bottom: -5px;
      left: -5px;
      right: -5px;
      background: inherit;
      filter: blur(5px);
      /* position:absoluteのせいで最前面に来てしまうため */
      z-index: -1;
    }
   




    .wellcome_boad_div04{
      min-width: 100%;
      min-height: 100%;
      display: block;
      padding: 0px 0px 0px 0px;
      color: ffffff;
      backdrop-filter: blur(12px);
      background: url(images/triangles-1430105.png) no-repeat;
    background-size: cover;
    position: relative;
    z-index: 0;
    height: 100vh;
    }

    .wellcome_boad_div04::before {
      content: '';
      position: absolute;
      top: -5px;
      bottom: -5px;
      left: -5px;
      right: -5px;
      background: inherit;
      filter: blur(5px);
      /* position:absoluteのせいで最前面に来てしまうため */
      z-index: -1;
    }





    .wellcome_boad_div05{
      min-width: 100%;
      min-height: 100%;
      display: block;
      padding: 0px 0px 0px 0px;
      color: ffffff;
      backdrop-filter: blur(12px);
      background: url(images/triangles-1430105.png) no-repeat;
    background-size: cover;
    position: relative;
    z-index: 0;
    height: 100vh;
    }




    

    .wellcome_boad_title01{
      font-size: 57px;
    display: block;
    margin: 0% 12px 30px 12px;
    font-weight: bold;
    text-align: center;
    color: #FFF;
    font-family: 'Hachi Maru Pop', cursive;
    }


    .wellcome_boad_title02{
      font-size: 57px;
      display: block;
      margin: 33% 12px 30px 12px;
      font-weight: bold;
      text-align: center;
      color: #FFF;
      font-family: 'Ubuntu', sans-serif;
    }


    .wellcome_boad_title03{
      font-size: 51px;
    display: block;
    margin: 0% 1px 30px 1px;
    font-weight: bold;
    text-align: center;
    color: #FFF;
    font-family: 'Ubuntu', sans-serif;
    }



    .wellcome_boad_sub01{
      font-size: 19px;
      display: inline-block;
      margin: 7px 1px 1px 1px;
      font-weight: bold;
      text-align: center;
      color: #FFF;
      width: 100%;
      font-family: 'Ubuntu', sans-serif;
    }



    .wellcome_boad_title04{
      font-size: 44px;
      display: block;
      margin: 0% 0px 30px 0px;
      font-weight: bold;
      text-align: left;
      color: #FFF;
      font-family: 'Hachi Maru Pop', cursive;
      line-height: 1.1;
    }


    .wellcome_boad_body01{
      font-size: 19px;
    display: block;
    margin: 25% 12px 30px 12px;
    font-weight: bold;
    text-align: center;
    color: #FFF;
    line-height: 1.8;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    }

    .wellcome_boad_body_title01{
      font-size: 23px;
      display: block;
      margin: 13% 12px 30px 12px;
      font-weight: bold;
      text-align: center;
      color: #FFF;
      line-height: 1.3;
      font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    }


    .wellcome_boad_body_title02{
      font-size: 23px;
      display: block;
      margin: 16% 12px 15px 12px;
      font-weight: bold;
      text-align: center;
      color: #FFF;
      line-height: 1.3;
      font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
      border-top: solid 1px #FFF;
      border-bottom: solid 1px #FFF;
      padding: 12px;
    }



    .wellcome_boad_body02{
      font-size: 16px;
      display: block;
      margin: 9% 12px 30px 12px;
      font-weight: 300;
      text-align: center;
      color: #FFF;
      line-height: 1.6;
      font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  }
  
  
  



    .wellcome_boad_btn_area01{
      display: block;
      margin: 0% 12px 30px 12px;
    }


    .section_card_p{
      margin: 13px 1px 2px 2px;
    }


    .save_filter_btn{
      display: block;
    position: absolute;
    bottom: 0px;
    width: 100%;
    height: 60px;
    background: #e81a2b;
    font-size: 19px;
    color: #FFF;
    text-align: center;
    padding: 15px 0px 15px 0px;
    height: 50px;
    }





    .do_not_found{
      margin: 2px 20px 1px 20px;
      text-align: center;
    }


    .pr_banner{
      width: 90%;
      margin: 0% 5% 0% 5%;
      border-radius: 25px;
    }




/*********************************** 　　タブの切り替え　************************************/
/*タブ切り替え全体のスタイル*/
.tabs {
  margin-top: 50px;
  padding-bottom: 40px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 100%;
  margin: 0 auto;
  border-radius: 20px;
  }

/*タブのスタイル*/
.tab_item {
  width: calc(100%/3);
  height: 50px;
  border-bottom: 3px solid #f39700;
  background-color: #fff;
  line-height: 50px;
  font-size: 16px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
  border-radius: 20px 20px 0px 0px;
}
.tab_item:hover {
  opacity: 0.75;
  background-color: #f5dfbc;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  clear: both;
  overflow: scroll;
    max-height: 500px;
    min-height: 500px;
    height: 500px;
}


/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
  background-color: #f39700;
  color: #fff;
}








/*タブ切り替え全体のスタイル*/
.tabs2 {
  margin-top: 50px;
  padding-bottom: 40px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 100%;
  margin: 0 auto;
  border-radius: 20px;
  }

/*タブのスタイル*/
.tab_item2 {
  width: calc(100%/3);
  height: 50px;
  border-bottom: 3px solid #f39700;
  background-color: #fff;
  line-height: 50px;
  font-size: 16px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
  border-radius: 20px 20px 0px 0px;
}
.tab_item2:hover {
  opacity: 0.75;
  background-color: #f5dfbc;
}

/*ラジオボタンを全て消す*/
input[name="tab_item2"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content2 {
  display: none;
  padding: 40px 40px 0;
  clear: both;
  overflow: hidden;
}



/*選択されているタブのコンテンツのみを表示*/
#all2:checked ~ #all2_content,
#programming2:checked ~ #programming2_content,
#design2:checked ~ #design2_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs2 input:checked + .tab_item2 {
  background-color: #f39700;
  color: #fff;
}



/*********************************** 　　タブの切り替え　************************************/



.line_news_card{
  width: 100%;
  border-bottom: solid 2.5px #d4d4d4;
  padding: 10px 17px 10px 16px;
  font-size: 17px;
  font-weight: bold;
  color: #524646;
  text-align: left;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  background: #FFF;
  transition: all 0.3s ease-in;
  position: relative;
  top: 0;
  left: 0;
}

.line_news_card:hover {     
  background: #f1f1f1;
}

.line_news_card:active span::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100px;
  height: 100px;
  margin-top: -50px;
  margin-left:-50px;
  content: "";
  background: #9b9b9b;
  border-radius: 100%;
  opacity: 0;
  animation: ripple 0.3s 1 ease-out;
}
@keyframes ripple {
  0% {
    opacity: 1;
    transform: scale(0.0);
  }
  100% {
    opacity: 0;
    transform: scale(1.0);
  }
}



.line_news_card_label{
  background: #4285f4;
    display: inline-block;
    color: #FFF;
    font-size: 14px;
    font-weight: 300;
    padding: 2px 9px 2px 9px;
    border-radius: 23px;
    line-height: 1.4;
    margin: 0px 6px 0px 5px;
}

.line_news_card_time{
  display: inline-block;
    color: #888;
    font-size: 13px;
    font-weight: 300;
    padding: 1px 5px 1px 5px;
    border-radius: 23px;
    line-height: 1.4;
}




.line_news_main{
  background: #FFF;
}


.line_news_id{
  margin: 20px 18px 10px 18px;
  font-size: 14px;
  color: #8b8b8b;
  display: inline-block;
}

.line_news_title{
  font-size: 22px;
    font-weight: bold;
    color: #000;
    text-align: left;
    width: 100%;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    margin: 12px 15px 2px 16px;
    width: 91%;
    word-break: break-all;
    line-height: 1.3;
}



.line_news_to{
  background: #4285f4;
  display: inline-block;
  color: #FFF;
  font-size: 14px;
  font-weight: 300;
  padding: 3px 10px 3px 11px;
  border-radius: 23px;
  line-height: 1.4;
  margin: 12px 15px 12px 16px;
}

.line_news_type{
  background: #4285f4;
  display: inline-block;
  color: #FFF;
  font-size: 14px;
  font-weight: 300;
  padding: 3px 10px 3px 11px;
  border-radius: 23px;
  line-height: 1.4;
  margin: 31px 8px 5px 16px;
}

.line_news_update{
  margin: 20px 18px 10px 18px;
  font-size: 17px;
  color: #8b8b8b;
  display: contents;
}

.line_news_view{
  font-size: 14px;
  font-weight: 400;
  color: #c4c4c4;
  text-align: left;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  margin: 12px 8px 12px 8px;
  word-break: break-all;
  line-height: 1.3;
  display: inline-block;

}

.line_news_good{
  font-size: 14px;
  font-weight: 400;
  color: #c4c4c4;
  text-align: left;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  margin: 12px 8px 12px 8px;
  word-break: break-all;
  line-height: 1.3;
  display: inline-block;

}

.line_news_edit{
  font-size: 15px;
    font-weight: 600;
    color: #737373;
    text-align: left;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    margin: 3px 15px 12px 16px;
    word-break: break-all;
    line-height: 1.3;
    display: inline-block;
}
.line_news_edit_pic{
  background: #444e5d;
  display: inline-block;
  color: #FFF;
  font-size: 14px;
  font-weight: 300;
  padding: 5px 5px 5px 8px;
  border-radius: 23px;
  line-height: 1.4;
  margin: 0px 6px 0px 0px;
  width: 30px;
  height: 30px;
}

.line_news_push{
  display: inline-block;
}

.line_news_label{
  display: inline-block;
}

.line_news_body{
  font-size: 17px;
    font-weight: 400;
    color: #000;
    text-align: left;
    width: 100%;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    padding: 12px 15px 12px 16px;
    word-break: break-all;
    box-shadow: rgb(149 157 165 / 20%) 0px 8px 24px;
    line-height: 1.3;
    border-top: solid 2px #e9e9e9;
}






/***********************************　ポップアップ_SUB　　************************************/
.modal_overlay_SUB{
  display: flex;
  justify-content: center;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 12000;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.2);
  opacity: 0;
  transition: opacity 0.2s, transform 0s 0.2s;
  transform: scale(0);
}
.modal_trigger_SUB{
  position: absolute;
  width: 100%;
  height: 100%;
}

.modal_trigger_SUB:active + .modal_content_SUB{
  animation: poyoyon2 1s ease-in-out 1 forwards;
}



.modal_content_SUB {
  align-self: center;
  width: 89%;
  height: 94vh;
  padding: 1vh 0vh;
  box-sizing: border-box;
  background: #fff;
  transform: scale(0.8);
  transition: 0.2s;
  border-radius: 22px;
}
 
#modal_content_SUB-skin{
overflow: hidden;
border-radius: 11px;
box-shadow: 0 4px 15px rgba(0,0,0,.1);
}   
.close_button_SUB{
  position: absolute;
  top: 14px;
  right: 16px;
  font-size: 28px;
  cursor: pointer;
}

.modal_wrap_SUB input:checked ~ .modal_overlay_SUB{
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.2s;
}

.modal_wrap_SUB input:checked ~ .modal_overlay_SUB .modal_content_SUB{
  transform: scale(1);
}
/***********************************　ポップアップ_SUB　　************************************/




#popup_main_content_SUB i{
  font-size: 80px;
  color: #306adf;
  font-family: 'Material Icons';
  font-style: normal;
}
#popup_main_content_SUB{
  text-align: center;
}

.popup_main_content_SUB_title{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 35px;
  font-weight: bolder;
  margin: 30px 8px 31px 8px;
  display: block;
  line-height: 1.2;
}
.popup_main_content_SUB_title_b{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 29px;
  font-weight: bolder;
  margin: 30px 15px 31px 15px;
  display: block;
  line-height: 1.2;
}


.popup_main_content_SUB_title2{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 17px;
  font-weight: bolder;
  margin: 41px 1px 6px 1px;
  display: block;
}


.popup_main_content_SUB_title3 {
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 1.4em;
  font-weight: bolder;
  margin: 0px 0px 0px 0px;
  text-align: left;
  display: block;
  height: 5vh;
  padding: 14px 2vh 0px 3vh;
  background: -webkit-linear-gradient(top, #FFF, transparent);
  background: linear-gradient(to bottom, #FFF, transparent);
  border-radius: 22px;
}
.popup_main_content_SUB_title4{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 22px;
  font-weight: bolder;
  margin: 35px 1px 6px 23px;
  text-align: left;
  display: block;
}
.popup_main_content_SUB_title5{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 36px;
  font-weight: bolder;
  margin: 31px 0px 8px 0px;
  text-align: center;
  display: block;
}


.popup_main_content_SUB_title6{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 36px;
  font-weight: bolder;
  margin: 31px 0px 8px 0px;
  text-align: center;
  display: block;
  color: #FFF;
  line-height: 1.2;
}

.popup_main_content_SUB_title7{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 17px;
  font-weight: bolder;
  margin: 42px 1px 16px 25px;
  display: block;
  text-align: left;
  color: #959595;
  font-weight: 400;
}


.popup_main_content_SUB_title8 {
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 1.4em;
  font-weight: bolder;
  margin: 0px 0px 0px 0px;
  text-align: left;
  display: block;
  height: 9vh;
  padding: 14px 2vh 0px 3vh;
  background: -webkit-linear-gradient(top, #FFF, transparent);
  background: linear-gradient(to bottom, #FFF, transparent);
  border-radius: 22px;
}







.popup_main_content_SUB_body3{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    font-size: 17px;
    font-weight: 700;
    margin: 32px 1px 6px 1px;
    text-align: left;
    display: block;
}


.popup_main_content_SUB_body4{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 16px;
  font-weight: 500;
  margin: 29px 6px 16px 6px;
  display: block;
  line-height: 1.3;
  color: #535353;
}



.popup_main_content_SUB_body5{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    font-size: 17px;
    font-weight: 500;
    margin: 29px 16px 16px 16px;
    display: block;
    line-height: 1.3;
    color: #ffffff80;
}



.popup_main_content_li_01{
  list-style-type: none;
    text-align: left;
    padding: 0px 0px 0px 10px;
    margin: 4px 1px 6px 1px;
}

.popup_main_content_li_01 li{
  font-weight: 300;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  padding: 5px 1px 1px 1px;
  padding-left: 7px;
  text-indent: -7px;
}

.popup_main_content_li_01 li:before {
  content: '';
  width: 7px;
  height: 7px;
  display: inline-block;
  border-radius: 100%;
  background: #000000;
  position: relative;
  left: -9px;
  top: -2px;
}


.popup_main_content_SUB_body{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 17px;
  font-weight: 500;
  margin: 15px 16px 16px 16px;
  display: block;
  line-height: 1.5;
}

.popup_main_content_body{
  text-align: center;
  padding: 19px 1px 1px 1px;
  height: 100vh;
  max-height: 100vh;
  overflow: scroll;
  padding-bottom: 180px;
}
.popup_main_content_body i{
  font-size: 79px!important;
  color: #306adf;
  font-family: 'Material Icons';
  font-style: normal;
}






.popup_main_content_body2{
  text-align: center;
  padding: 10px 1px 1px 1px;
}

.popup_main_content_body2 i{
  font-size: 79px!important;
  color: #306adf;
  font-family: 'Material Icons';
  font-style: normal;
}







.popup_main_content_body3{
  text-align: center;
  padding: 19px 1px 1px 1px;
}

.popup_main_content_body3 i{
  font-size: 79px!important;
  color: #FFF;
  font-family: 'Material Icons';
  font-style: normal;
}




.popup_main_content_body5{
  text-align: center;
    padding: 19px 1px 1px 1px;
    height: 100vh;
    max-height: 100vh;
    overflow: scroll;


}
.popup_main_content_body5 i{
  font-size: 79px!important;
  color: #306adf;
  font-family: 'Material Icons';
  font-style: normal;
}



.popup_main_content_body6{
  text-align: center;
  padding: 0px 1px 1px 1px;
  height: 100vh;
  max-height: 100vh;
  overflow: scroll;
  padding-bottom: 180px;
}



.memu_button_new04_body{
  width: 70%;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  color: #848484;
}
.memu_button_new04_icon i{
  font-size: 43px!important;
  color: #bbbbbb;
  font-family: 'Material Icons';
  font-style: normal;
}
.memu_button_new04_icon{
  width: 20%;
  display: block;
  float: left;
}

.more_icon4{
  position: absolute;
  width: 70%;
  display: inline-block;
  font-weight: 600;
  color: #848484;
  max-width: 30px;
}

.more_icon4 i{
  font-size: 34px!important;
  color: #817c7c;
  font-family: 'Material Icons';
  font-style: normal;
}










        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        .memu_button_new06 {
          display: block;
          font-size: 17px;
          font-weight: 600;
          color: #606060;
          border-radius: 17px;
          border: none;
          width: 94%;
          text-decoration: none;
          text-align: left;
          min-height: 48px;
          margin: 6px 3% 6px 3%;
        }
      

        .memu_button_new06:hover {
          color: #323232;
          background: #cdcdcd;
        }
        
        .memu_button_new06:active {
          color: #323232;
          background: #cdcdcd;
        }        

.memu_button_new06_body{
  width: 88%;
  height: 100%;
  text-align: left;
  display: inline-block;
  font-size: 22px;
  font-weight: 600;
  color: #262626;
  padding: 12px 0px 0px 11px;
  line-height: 1.1;
}
.memu_button_new06_icon i{
  font-size: 30px!important;
    color: #3b3a3a;
    font-family: 'Material Icons';
    font-style: normal;
}
.memu_button_new06_icon{
  width: 12%;
  height: 100%;
  display: block;
  float: left;
  padding: 7px 1px 1px 1px;
  text-align: center;
}

.more_icon6{
  position: absolute;
  width: 27px;
  display: inline-block;
  font-weight: 600;
  color: #848484;
  height: 48px;
  right: 15px;
  padding: 4px 0px 0px 0px;
}

.more_icon6 i{
  font-size: 34px!important;
  color: #817c7c;
  font-family: 'Material Icons';
  font-style: normal;
}
        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/














        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        .memu_button_new06B {
          display: block;
          font-size: 17px;
          font-weight: 600;
          color: #606060;
          border-radius: 13px;
          border: none;
          margin: 26px 6% 0px 6%;
          padding: 13px 13px 17px 11px;
          width: 88%;
          text-decoration: none;
          text-align: left;
          background: #ffffff85;
        }
      

        .memu_button_new06B:hover {
          color: #323232;
          background: #cdcdcd;
        }
        
        .memu_button_new06B:active {
          color: #323232;
          background: #cdcdcd;
        }        

.memu_button_new06B_body{
  width: 79%;
    display: inline-block;
    font-size: 18px;
    font-weight: 600;
    color: #262626;
}
.memu_button_new06B_icon i{
  font-size: 29px!important;
    color: #3b3a3a;
    font-family: 'Material Icons';
    font-style: normal;
}
.memu_button_new06B_icon{
  width: 13%;
  display: block;
  float: left;
}

.more_icon6B{
  position: absolute;
  width: 70%;
  display: inline-block;
  font-weight: 600;
  color: #848484;
  max-width: 30px;
}

.more_icon6B i{
  font-size: 34px!important;
  color: #817c7c;
  font-family: 'Material Icons';
  font-style: normal;
}
        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/








.test_banner{
  display: block;
    position: absolute;
    bottom: 1px;
    left: 100px;
}




.more_icon5{
  width: 70%;
  display: inline-block;
  font-weight: 600;
  color: #848484;
  max-width: 30px;
}

.more_icon5 i{
  font-size: 34px!important;
  color: #817c7c;
  font-family: 'Material Icons';
  font-style: normal;
}




.modal_content_SUB i{
  font-size: 45px!important;
  color: #5e5e5e;
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 200!important;
  position: absolute;
  top: 12px;
  right: 14px;
  border-radius: 30px;
}


.modal_content_SUB i:hover{
  background: #e2e2e2;
  color: #454545;
}
.modal_content_SUB i:active{
  background: #e2e2e2;
  color: #454545;
}



.popup_main_content2_load{
  width: 80%;
    margin: 0 auto;
    max-width: 500px;
    /* top: 200px; */
    margin-top: 326px;
}

.start_login_title{
  text-align: center;
  font-size: 23px;
  font-weight: 800;
  margin: 40% 10px 45% 10px;
  display: block;
  line-height: 1.7;
  color: #FFF;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}

.load_msg_css{
  text-align: center;
    font-size: 19px;
    font-weight: 400;
    margin: 40% 20px 45% 20px;
    display: block;
    line-height: 1.7;
    color: #8b8b8b;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}


.load_msg_css2{
  text-align: center;
    font-size: 25px;
    font-weight: bold;
    margin: 40% 20px 45% 20px;
    display: block;
    line-height: 1.7;
    color: #8b8b8b;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}


.load_msg_css3{
  text-align: center;
  font-size: 49px;
  font-weight: bold;
  margin: 40% 20px 45% 20px;
  display: block;
  line-height: 1.3;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  text-align: left;
  color: #FFF;
  animation: slideIn 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
  float: left;
  color: #FF8C00;
  background: -webkit-linear-gradient(0deg, #40E0D0, #FF8C00, #FF0080);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


.load_msg_css4{
  text-align: center;
  font-size: 13px;
  font-weight: 200;
  margin: 0px 20px 0px 20px;
  display: block;
  line-height: 1.2;
  color: #8b8b8b;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  bottom: 21px;
  position: absolute;
}


.load_msg_css5{
  text-align: center;
  font-size: 31px;
  font-weight: bold;
  margin: 54% 20px 45% 34px;
  display: block;
  line-height: 1.3;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  color: #FFF;
  animation: slideIn 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
  float: left;
  color: #FF8C00;
  background: -webkit-linear-gradient(0deg, #40E0D0, #FF8C00, #FF0080);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


.load_msg_css6{
  text-align: center;
    font-size: 13px;
    font-weight: 200;
    margin: 31px 20px 0px 20px;
    display: block;
    line-height: 1.2;
    color: #8b8b8b;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    display: inline-block;
}




.doors_logo_mini{
  width: 30%;
    position: absolute;
    bottom: 68px;
    left: 1px;
    margin: 0px 35% 0px 35%;
}


.popup_main_content_normal_menu_btn{
  font-size: 18px;
  color: #262626;
  font-weight: 800;
  padding: 9px 16px 9px 16px;
  text-align: left;
  margin: 2px 15px 2px 15px;
  background: #FFF;
  border-radius: 8px;
}

.popup_main_content_normal_menu_btn:hover{
  background: #dfdfdf;
  color: #070707;
}
.popup_main_content_normal_menu_btn:active{
  background: #dfdfdf;
  color: #070707;
}

.container {
  overflow: auto;
  scroll-snap-type: y mandatory;
  height: 30vh;
}
.area {
  scroll-snap-align: start;
  height: 30vh;
}



.wellcome_boad_body_card{
  align-self: center;
  width: 100%;
    height: 100%;
    padding: 10px 30px;
    box-sizing: border-box;
    background: #fff;
    border-radius: 22px;
}



.wellcome_boad_div02{
  min-width: 100%;
  min-height: 100%;
  display: block;
  padding: 40px 30px 40px 30px;
  color: ffffff;
  backdrop-filter: blur(12px);
  background: url(images/triangles-1430105.png) no-repeat;
background-size: cover;
position: relative;
z-index: 0;
height: 100vh;
}


.wellcome_boad_div02::before {
  content: '';
  position: absolute;
  top: -5px;
  bottom: -5px;
  left: -5px;
  right: -5px;
  background: inherit;
  filter: blur(5px);
  /* position:absoluteのせいで最前面に来てしまうため */
  z-index: -1;
}












.wellcome_boad_div03{
  min-width: 100%;
  min-height: 100%;
  display: block;
  backdrop-filter: blur(12px);
  background-size: cover;
  position: relative;
  z-index: 0;
  background: #000;
  height: 100vh;
}










.card_new_btn_001 {
  background: #4994ec;
  width: 80%;
  display: block;
  border-radius: 24px 24px 5px 5px;
  font-size: 18px;
  color: #FFF;
  text-align: center;
  padding: 15px 0px 15px 0px;
  margin: 5px 10% 5px 10%;
  height: 50px;
}
.card_new_btn_001:hover {    
  box-shadow: 0 2px 5px #ccc;    

}
.card_new_btn_001:active {    
  box-shadow: 0 1px 1px #ccc;    
  background: #f5f5f5;
}






.card_new_btn_002{
  background: #1a73e8;
  width: 80%;
  display: block;
  border-radius: 18px;
  font-size: 22px;
  color: #FFF;
  text-align: center;
  padding: 15px 0px 15px 0px;
  margin: 5px 10% 5px 10%;
  height: 50px;
}
.card_new_btn_002:hover {    
  box-shadow: 0 2px 5px #ccc;    

}
.card_new_btn_002:active {    
  box-shadow: 0 1px 1px #ccc;    
  background: #f5f5f5;
}




.card_new_btn_003{
  background: #1a73e8;
  width: 80%;
  display: block;
  border-radius: 18px;
  font-size: 22px;
  color: #FFF;
  text-align: center;
  padding: 15px 0px 15px 0px;
  margin: 5px 10% 5px 10%;
  height: 50px;
}
.card_new_btn_003:hover {    
  box-shadow: 0 2px 5px #ccc;    

}
.card_new_btn_003:active {    
  box-shadow: 0 1px 1px #ccc;    
  background: #f5f5f5;
}




.card_new_btn_004{
  background: #1a73e8;
  width: 80%;
  display: block;
  border-radius: 18px;
  font-size: 22px;
  color: #FFF;
  text-align: center;
  padding: 15px 0px 15px 0px;
  margin: 5px 10% 5px 10%;
  height: 50px;
}
.card_new_btn_004:hover {    
  box-shadow: 0 2px 5px #ccc;    

}
.card_new_btn_004:active {    
  box-shadow: 0 1px 1px #ccc;    
  background: #f5f5f5;
}



.in_cart_footer {
  display: block;
  margin: 12px 1px 1px 1px;
  background: #FFF;
  box-shadow: 0px 0px 19px 2px rgb(0 0 0 / 18%);
  padding: 10px 25px 10px 25px;
}



.filter_done_flag_icon{
  display: inline-block;
    font-size: 15px;
    background: #61cbac;
    border-radius: 25px;
    color: #FFF;
    padding: 3px 10px 3px 10px;
    font-weight: 700;
    line-height: 1.4;
    margin: 1px 1px 1px 7px;
}



.view_map_btn{
  width: 80%;
    display: block;
    margin: 15px 10% 10px 10%;
    border: solid 1.5px #16bc90;
    border-radius: 9px;
    padding: 8px 10px 8px 10px;
    font-size: 17px;
    text-align: center;
    color: #16bc90;
    font-weight: 700;
}



.view_map_btn2{
  width: 80%;
  display: block;
  margin: 15px 10% 10px 10%;
  border: solid 1.5px #dc1247;
  border-radius: 9px;
  padding: 8px 10px 8px 10px;
  font-size: 17px;
  text-align: center;
  color: #dc1247;
  font-weight: 700;
}


.view_map_btn_v2{
  width: 80%;
    display: block;
    margin: 15px 10% 10px 10%;
    border: solid 1.5px #d6d6d6;
    border-radius: 9px;
    padding: 8px 10px 8px 10px;
    font-size: 17px;
    text-align: center;
    color: #d6d6d6;
    font-weight: 700;

    
}




.movie-wrap {
  position: relative;
  padding-bottom: 177.25%;
  height: 0;
  overflow: hidden;
}

.movie-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 23px;
}

.movie-wrap2 {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.movie-wrap2 iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 23px;
}








/***********************************　ポップアップ_SUB2　　************************************/
.modal_overlay_SUB2{
  display: flex;
  justify-content: center;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 12000;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.2);
  opacity: 0;
  transition: opacity 0.2s, transform 0s 0.2s;
  transform: scale(0);
}
.modal_trigger_SUB2{
  position: absolute;
  width: 100%;
  height: 100%;
}

.modal_trigger_SUB2:active + .modal_content_SUB2{
  animation: poyoyon2 1s ease-in-out 1 forwards;
}




.modal_content_SUB2{
  align-self: center;
  width: 89%;
  box-sizing: border-box;
  background: #fff;
  transform: scale(0.8);
  transition: 0.2s;
  border-radius: 22px;
}
 
#modal_content_SUB2-skin{
overflow: hidden;
border-radius: 11px;
box-shadow: 0 4px 15px rgba(0,0,0,.1);
}   
.close_button_SUB2{
  position: absolute;
  top: 14px;
  right: 16px;
  font-size: 28px;
  cursor: pointer;
}

.modal_wrap_SUB2 input:checked ~ .modal_overlay_SUB2{
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.2s;
}

.modal_wrap_SUB2 input:checked ~ .modal_overlay_SUB2 .modal_content_SUB2{
  transform: scale(1);
}


.modal_content_SUB2 i{
  font-size: 45px!important;
  color: #5e5e5e;
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 200!important;
  position: absolute;
  top: -44px;
  right: -14px;
  border-radius: 30px;
  z-index: 99999;
  background: #ffffff70;
}


.modal_content_SUB2 i:hover{
  background: #e2e2e2;
  color: #454545;
}
.modal_content_SUB2 i:active{
  background: #e2e2e2;
  color: #454545;
}



/***********************************　ポップアップ_SUB　　************************************/





.wellcome_boad_div01_box{
  align-self: center;
  width: 90%;
  height: 86%;
  padding: 9px 10px;
  box-sizing: border-box;
  background: #fff;
  transition: 0.2s;
  border-radius: 39px;
  margin: 10% 5% 7% 5%;
  display: inline-block;
}








.circle_box{
  top: 34%;
  display: inline-block;
}



.circle {
  background-color: rgba(0,0,0,0);
  border: 5px solid rgba(0,183,229,0.9);
  opacity: .9;
  border-right: 5px solid rgba(0,0,0,0);
  border-left: 5px solid rgba(0,0,0,0);
  border-radius: 150px;
  box-shadow: 0 0 35px #2187e7;
  width: 150px;
  height: 150px;
  margin: 0 auto;
  -moz-animation: spinPulse 1s infinite ease-in-out;
  -webkit-animation: spinPulse 1s infinite linear;
}

.circle1 {
  background-color: rgba(0,0,0,0);
  border: 5px solid rgba(0,183,229,0.9);
  opacity: .9;
  border-left: 5px solid rgba(0,0,0,0);
  border-right: 5px solid rgba(0,0,0,0);
  border-radius: 150px;
  box-shadow: 0 0 15px #2187e7;
  width: 100px;
  height: 100px;
  margin: 0 auto;
  position: relative;
  top: -123px;
  -moz-animation: spinoffPulse 1s infinite linear;
  -webkit-animation: spinoffPulse 1s infinite linear;
}

@-moz-keyframes spinPulse {
  0% {
      -moz-transform: rotate(160deg);
      opacity: 0;
      box-shadow: 0 0 1px #2187e7;
  }

  50% {
      -moz-transform: rotate(145deg);
      opacity: 1;
  }

  100% {
      -moz-transform: rotate(-320deg);
      opacity: 0;
  };
}

@-moz-keyframes spinoffPulse {
  0% {
      -moz-transform: rotate(0deg);
  }

  100% {
      -moz-transform: rotate(360deg);
  };
}

@-webkit-keyframes spinPulse {
  0% {
      -webkit-transform: rotate(160deg);
      opacity: 0;
      box-shadow: 0 0 1px #2187e7;
  }

  50% {
      -webkit-transform: rotate(145deg);
      opacity: 1;
  }

  100% {
      -webkit-transform: rotate(-320deg);
      opacity: 0;
  };
}

@-webkit-keyframes spinoffPulse {
  0% {
      -webkit-transform: rotate(0deg);
  }

  100% {
      -webkit-transform: rotate(360deg);
  };
}



.bukkenn_icon {
  width: 100%;
  text-align: center;
}

.bukkenn_icon i {
  font-size: 60px;
  color: #306adf;
}
.bukkenn_icon_title {
  font-size: 24px;
  font-weight: 800;
  padding: 13px 0px 0px 0px;
  color: #000;
}


.kyori_block {
  display: inline-block;
  width: 100%;
  padding: 9px 0px 4px 20px;
}





.end_main_view_price_div_sub3 {
  background: #ffffff;
  font-size: 19px;
  color: #ec3636;
  display: inline-block;
  padding: 5px 8px;
  border-radius: 13px;
}


.end_main_view_price_card3 {
  display: contents;
  color: #ffffff;
  font-size: 30px;
  font-weight: bold;
  font-family: 'Alata';
}

.end_main_view_price_card1 {
  display: contents;
  color: #ffffffb3;
  font-size: 21px;
  font-weight: 200;
  /* text-decoration: line-through; */
}

.end_main_view_price_card {
  display: block;
  text-align: right;
  margin: 7px 8px 0px 1px;
}


.end_main_view_price_div3 {
  background: #ec3636;
  width: 94%;
  margin: 14px 3%;
  padding: 12px 20px;
  font-size: 15px;
  color: #544e4e;
  font-weight: 200;
  border-radius: 19px;
  box-shadow: 3px 3px 19px 1px rgb(0 0 0 / 15%);
}

.end_main_view_price_card2 {
  display: contents;
  color: #FFF;
}

.end_main_view_price_div_memo3 {
  color: #ffffff;
  font-size: 18px;
  font-weight: 600;
  margin: 7px 0px 0px 0px;
}

.waribiki {
  display: contents;
  font-size: 31px;
  font-weight: 900;
}


.popup_main_content_SUB_title3 i {
  font-size: 31px!important;
  color: #000!important;
  display: inline-block!important;
  position: inherit;
}


.line_new_text_area {
  border-radius: 28px;
  min-width: 90%;
  background: #f2f2f2;
  border: solid 1px #dfdfdf;
  margin: 35px 5% 0px 5%;
  display: inline-block;
  height: 400px;
  padding: 5px 12px 5px 12px;
  font-size: 18px;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-weight: 200;
  color: #2a2a2a;
}

.select_Category_area {
  width: 100%;
  display: inline-block;
}

.select_Category {
  display: inline-block;
  background: #4169e1;
  font-size: 22px;
  width: 90%;
  border-radius: 22px;
  color: #FFF;
  padding: 8px 16px 8px 16px;
  margin: 1px 5% 1px 5%;
}


.me_flag {
  display: inline-block;
  background: #d72626;
  border-radius: 7px;
  color: #FFF;
  padding: 1px 8px;
  margin: 0px 3px;
}

.no_answer_flag {
  display: inline-block;
  background: #737373;
  border-radius: 7px;
  color: #FFF;
  padding: 1px 8px;
  margin: 0px 3px;
}

.new_flag {
  display: inline-block;
  background: #1cc453;
  border-radius: 7px;
  color: #FFF;
  padding: 1px 8px;
  margin: 0px 3px;
}

.category_flag {
  display: inline-block;
  background: #f9f9f9;
  border-radius: 7px;
  color: #343434;
  padding: 1px 8px;
  margin: 0px 3px;
  border: solid 1px #616161;
}





.noify_alert_text4 {
  margin: 25px 30px 10px 30px;
  font-size: 24px;
  font-weight: 800;
  color: #585858;
  line-height: 1.3;
  display: inline-block;
}

.all_filter-btn {
  display: inline-block;
  color: #3c7fef;
  font-size: 19px;
}
.answer_body_title {
  font-size: 27px;
  font-weight: 800;
  color: #bd870c;
  text-align: center;
  margin-bottom: 13px;
}
.answer_body_title i {
  font-size: 51px;
  width: 20%;
  text-align: center;
  margin: 9px 40%;
  color: #bd870d;
}

.answer_body_title_sub {
  font-size: 17px;
  color: #575757;
  margin: 26px 11px;
  font-weight: 400;
  line-height: 1.3;
}

.answer_body_title_sub2 {
  font-size: 14px;
  font-weight: 200;
  line-height: 1.2;
  color: #919090;
}



.line_new_text_area_mini {
  border-radius: 28px;
  min-width: 90%;
  background: #f2f2f2;
  border: solid 1px #dfdfdf;
  margin: 35px 5% 0px 5%;
  display: inline-block;
  height: 187px;
  padding: 5px 12px 5px 12px;
  font-size: 18px;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-weight: 200;
  color: #2a2a2a;
}


.div_edit_btn_area {
  display: inline-block;
  width: 50%;
  margin: 12px 25%;
  text-align: center;
  padding: 20px 0px;
}

.more_flag1{
  display: inline-block;
  background: #671cc4;
  border-radius: 7px;
  color: #FFF;
  padding: 1px 8px;
  margin: 0px 3px;
}

.more_flag2{
  display: inline-block;
    background: #c49a1c;
    border-radius: 7px;
    color: #FFF;
    padding: 1px 8px;
    margin: 0px 3px;
}


.pic_up_q_and_a {
  width: 90%;
  font-size: 14px;
  background: #fff;
  font-family: 'Alata', sans-serif;
  display: inline-block;
  margin: 16px 5% 2px 5%;
  padding: 14px 13px 15px 16px;
  border-radius: 12px;
  max-width: 90%;
  position: inherit;
  box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
  word-break: break-all;
}


.pic_up_q_and_a_title {
  font-size: 21px;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-weight: bold;
  line-height: 1.4;
}

.pic_up_q_and_a {
  width: 90%;
  font-size: 14px;
  background: #bd870c;
  font-family: 'Alata', sans-serif;
  display: inline-block;
  margin: 16px 5% 2px 5%;
  padding: 14px 13px 15px 16px;
  border-radius: 12px;
  max-width: 90%;
  position: inherit;
  box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
  word-break: break-all;
  color: #FFF;
}


.pic_up_q_and_a_more {
  font-size: 15px;
  margin: 8px 0px 0px 0px;
  font-weight: 200;
  color: #ffffffa3;
}



.text_area_new01 {
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 4px 10px;
  height: 216px;
  flex: 1;
  width: 90%;
  background: #eaedf2;
  font-size: 19px;
  margin: 0px 5%;
}



.area_check_label {
  width: 86%;
  display: inline-flex;
  text-align: left;
  border: solid 2px #aaa;
  border-radius: 13px;
  margin: 4px 7%;
  font-size: 27px;
  padding: 12px 15px;
  color: #3b3b3b;
}


.area_check_input:checked + .area_check_label {
  background: #3dcc55;
}










/*# sourceMappingURL=chexk.css.map */
.inputGroup {
  background-color: #fff;
  display: block;
  margin: 10px 0;
  position: relative;
}

.inputGroup label {
  padding: 12px 30px;
  width: 100%;
  display: block;
  text-align: left;
  color: #3C454C;
  cursor: pointer;
  position: relative;
  z-index: 2;
  -webkit-transition: color 200ms ease-in;
  transition: color 200ms ease-in;
  overflow: hidden;
}

.inputGroup label:before {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  content: '';
  background-color: #5562eb;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) scale3d(1, 1, 1);
          transform: translate(-50%, -50%) scale3d(1, 1, 1);
  -webkit-transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
  opacity: 0;
  z-index: -1;
}

.inputGroup label:after {
  width: 32px;
  height: 32px;
  content: '';
  border: 2px solid #D1D7DC;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.414 11L4 12.414l5.414 5.414L20.828 6.414 19.414 5l-10 10z' fill='%23fff' fill-rule='nonzero'/%3E%3C/svg%3E ");
  background-repeat: no-repeat;
  background-position: 2px 3px;
  border-radius: 50%;
  z-index: 2;
  position: absolute;
  right: 30px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  cursor: pointer;
  -webkit-transition: all 200ms ease-in;
  transition: all 200ms ease-in;
}

.inputGroup input:checked ~ label {
  color: #fff;
}

.inputGroup input:checked ~ label:before {
  -webkit-transform: translate(-50%, -50%) scale3d(56, 56, 1);
          transform: translate(-50%, -50%) scale3d(56, 56, 1);
  opacity: 1;
}

.inputGroup input:checked ~ label:after {
  background-color: #54E0C7;
  border-color: #54E0C7;
}

.inputGroup input {
  width: 32px;
  height: 32px;
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
  z-index: 2;
  position: absolute;
  right: 30px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  cursor: pointer;
  visibility: hidden;
}
/*# sourceMappingURL=chexk.css.map */



















/*# sourceMappingURL=chexk.css.map */

html h1, html h2, html h3, html h4, html h5, html h6 {
  margin: 0;
}
html h1 {
  color: #333;
  font-weight: 500;
}
html h3 {
  color: #aaa;
  font-weight: 500;
}
html h4 {
  color: #999;
  font-weight: 500;
}
html h4:after {
  content: "Km";
  padding-left: 1px;
}
html input[type=range] {
  outline: 0;
  border: 0;
  border-radius: 500px;
  width: 400px;
  max-width: 100%;
  margin: 24px 0 16px;
  transition: box-shadow 0.2s ease-in-out;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  html input[type=range] {
    overflow: hidden;
    height: 40px;
    -webkit-appearance: none;
    background-color: #ddd;
    width: 80%;
  }
  html input[type=range]::-webkit-slider-runnable-track {
    height: 40px;
    -webkit-appearance: none;
    color: #444;
    -webkit-transition: box-shadow 0.2s ease-in-out;
    transition: box-shadow 0.2s ease-in-out;
  }
  html input[type=range]::-webkit-slider-thumb {
    width: 40px;
    -webkit-appearance: none;
    height: 40px;
    cursor: ew-resize;
    background: #fff;
    box-shadow: -340px 0 0 320px #1597ff, inset 0 0 0 40px #1597ff;
    border-radius: 50%;
    -webkit-transition: box-shadow 0.2s ease-in-out;
    transition: box-shadow 0.2s ease-in-out;
    position: relative;
  }
  html input[type=range]:active::-webkit-slider-thumb {
    background: #fff;
    box-shadow: -340px 0 0 320px #1597ff, inset 0 0 0 3px #1597ff;
  }
}
html input[type=range]::-moz-range-progress {
  background-color: #43e5f7;
}
html input[type=range]::-moz-range-track {
  background-color: #9a905d;
}
html input[type=range]::-ms-fill-lower {
  background-color: #43e5f7;
}
html input[type=range]::-ms-fill-upper {
  background-color: #9a905d;
}

#h4-container {
  width: 400px;
  max-width: 100%;
  padding: 0 20px;
  box-sizing: border-box;
  position: relative;
}
#h4-container #h4-subcontainer {
  width: 100%;
  position: relative;
}
#h4-container #h4-subcontainer h4 {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  width: 40px;
  height: 40px;
  color: #fff !important;
  font-size: 12px;
  transform-origin: center -10px;
  transform: translateX(-50%);
  transition: margin-top 0.15s ease-in-out, opacity 0.15s ease-in-out;
}
#h4-container #h4-subcontainer h4 span {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #1597ff;
  border-radius: 0 50% 50% 50%;
  transform: rotate(45deg);
  z-index: -1;
}
/*
input:not(:active) + #h4-container h4 {
  opacity: 0;
  margin-top: -50px;
  pointer-events: none;
}
*/
/*# sourceMappingURL=chexk.css.map */




div#hope_area {
  height: 1em;
  overflow: scroll;
  margin-top: 46px;
}


.popup_main_content_SUB_title_add {
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 20px;
  font-weight: bolder;
  margin: 0px 0px 0px 0px;
  display: block;
  line-height: 1;
}



#area_check_icon{
  transition: all .5s ease;
}
#area_check_title{
  transition: all .5s ease;
}
#area_check_subtitle{
  transition: all .5s ease;
}



img.animation_gude01_img {
  width: 100%;
}

img.animation_gude01_img {
  width: 100%;
  margin-top: 27px;
}


.hope_area_add {
  height: 72%!important;
  overflow: scroll!important;
  margin-top: 46px!important;
}

.policy_area {
  text-align: left;
  padding: 20px 20px;
}

.policy_area h1 {
  font-size: 24px;
  font-weight: 700;
  color: #303030;
}

.policy_area h2 {
  font-size: 18px;
  font-weight: 600;
  color: #383838;
}

.policy_area p {
  font-size: 14px;
  font-weight: 200;
  color: #383838;
  line-height: 1.4;
}

.policy_area ul {
  font-size: 14px;
  text-align: left;
  background: #fcfcfc;
  padding: 0.5em 0.5em 0.5em 2em;
  border: solid 2px #f6f6f6;
  border-radius: 16px;
  color: #2f2f2f;
}

.policy_area ul {
  font-size: 13px;
  text-align: left;
  background: #fcfcfc;
  padding: 0.5em 0.5em 0.5em 2em;
  border: solid 2px #f6f6f6;
  border-radius: 16px;
  color: #2f2f2f;
  line-height: 1.4;
  margin-bottom: 36px;
}


#top_card_title_go{
  font-size: 18px;
    font-weight: bold;
    text-align: center;
    width: 100%;
    height: 34px;
    top: 0px;
    position: fixed;
    padding: 12px 10px 0px 0px;
    background: #ffffff8c;
}


.video_card {
  width: 100%;
}

.video_card video {
  width: 100%;
}
.tutorial_main_body {
  width: 100%;
}
.tutorial_main_title {
  font-size: 25px;
  font-weight: 800;
  color: #262626;
  margin: 29px 8px 0px 8px;
}

.tutorial_main_mag {
  font-size: 15px;
  font-weight: 200;
  color: #454545;
  margin: 22px 17px;
}


.check_ui_01 {
  display: none;
}




.popup_main_content_SUB_main_contents_box_icon i {
  font-size: 9vh!important;
  display: inline-block!important;
  position: initial!important;
  color: #ffffff!important;
}

.popup_main_content_SUB_main_contents_box {
  /* background: #FFF; */
  border-radius: 13px;
  width: 86%;
  margin: 3vh 7%;
  font-size: 3vh;
  padding: 0.3vh 18px 2vh 18px;
  color: #ffffff;
  font-weight: 900;
  max-height: 20vh;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  line-height: 1.2;
  /* border: solid 3px #FFF; */
}

.popup_main_content_SUB_scroll3 {
  height: 55vh;
  overflow: scroll;
  padding: 0vh 3vh;
  font-size: 21px;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-weight: 800;
  color: #FFF;
}



.popup_main_content_SUB_scroll3B {
  height: 55vh;
  overflow: scroll;
  padding: 0vh 3vh;
  font-size: 17px;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-weight: 200;
  color: #FFF;
  letter-spacing: 0.06em;
  line-height: 1.3;
}




        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        .memu_button_new09 {
          display: inline-block;
          bottom: 0px;
          right: 1px;
          font-size: 1.2em;
          font-weight: 600;
          color: #e27e2f;
          background: #ffffff;
          border-radius: 17px;
          border: none;
          margin: 0px 6% 0px 6%;
          padding: 1vh 14px 1vh 14px;
          width: 87%;
          text-decoration: none;
          text-align: center;
          max-height: 8vh;
      }

        
        .memu_button_new09:hover {
          color: #846b16;
          background: #ede9db;
        }
        
        .memu_button_new09:active {
          color: #4e3e09;
          background: #dcd4b9;
        }
        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        


        /**********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        .memu_button_new11 {
          display: inline-block;
          bottom: 0px;
          right: 1px;
          font-size: 1.2em;
          font-weight: 600;
          color: #ffffff;
          background: #5ed2ab;
          border-radius: 17px;
          border: none;
          margin: 0px 6% 0px 6%;
          padding: 1vh 14px 1vh 14px;
          width: 87%;
          text-decoration: none;
          text-align: center;
          max-height: 8vh;
      }

        
        .memu_button_new11:hover {
          color: #846b16;
          background: #ede9db;
        }
        
        .memu_button_new11:active {
          color: #4e3e09;
          background: #dcd4b9;
        }
        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        





        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        .memu_button_new10 {
          display: inline-block;
          bottom: 0px;
          right: 1px;
          font-size: 1.2em;
          font-weight: 600;
          color: #121016;
          background: #ffffff;
          border-radius: 17px;
          border: none;
          margin: 0px 6% 0px 6%;
          padding: 1vh 14px 1vh 14px;
          width: 87%;
          text-decoration: none;
          text-align: center;
          max-height: 8vh;
      }

        
        .memu_button_new10:hover {
          color: #846b16;
          background: #ede9db;
        }
        
        .memu_button_new10:active {
          color: #4e3e09;
          background: #dcd4b9;
        }
        /***********************************　標準ボタン：白抜き（新テンプレ）　　************************************/
        


        .section_card_blur{
          width: 90%;
    font-size: 14px;
    background: #fff;
    font-family: 'Alata', sans-serif;
    display: inline-block;
    margin: 16px 5% 2px 5%;
    padding: 1px 9px 11px 13px;
    border-radius: 12px;
    max-width: 90%;
    position: inherit;
    animation: slideIn3 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
        -ms-filter: blur(3px);
        filter: blur(3px);
        border: solid 1px #8d8d8d;
        }
        .section_div {
          position: relative;
      }




      .waiting {
        width: 95%;
        text-align: center;
        z-index: 9999999;
        font-size: 48px;
        display: block;
        position: absolute;
        margin: 3px 3px 3px 3px;
        padding: 5px 11px 5px 11px;
        color: #e18a3c;
        font-weight: bold;
        transform: rotate(-13deg);
        top: 72px;
        right: 1px;
        opacity: 0.7;
    }



    .price_card3B {
      display: inline-block;
      color: #ffffff;
      font-size: 24px;
      font-weight: bold;
      border: 2px solid #FFF;
      padding: 4px 12px;
      border-radius: 23px;
  }

  .price_card1B {
    display: contents;
    color: #ffffff99;
    font-size: 21px;
    font-weight: 200;
    font-family: 'Alata';
}


.price_card2B {
  display: contents;
  font-size: 25px;
  font-family: monospace;
}

.bukkenn_icon_body {
  font-size: 19px;
  padding: 15px 0px;
}


.soldout_div_icon i {
  font-size: 70px;
  color: #f83535;
}
.soldout_div_icon {
  text-align: center;
  margin: 27px 0px;
}

.soldout_div1 {
  font-size: 32px;
  display: inline-block;
  line-height: 1.1;
  padding: 8px 15px;
  font-weight: 800;
  color: #030303;
  text-align: center;
}

.soldout_div2 {
  font-size: 18px;
  font-weight: 200;
  color: #6d6d6d;
  display: inline-block;
  padding: 12px 20px;
  line-height: 1.3;
}

.soldout_btn_1 {
  background: #4169e1;
  color: #ffffff;
  border-radius: 24px;
  padding: 10px 11px;
  width: 90%;
  margin: 0px 5%;
  border: 2px #4169e1 solid;
  font-size: 25px;
  display: inline-block;
  font-weight: bold;
  text-align: center;
}

.inline_block_div{
  display: contents;
}


.card_scroll_area4_div2{
  background: none;
}








.my-btn {
  text-align: center;
}
.my-btn a {
  color: #fff!important;
  text-decoration: none;
  line-height: 27px;
  position: relative;
  overflow: hidden;
  background: #bfc1c4;
  width: 55.5%;
  border-radius: 10px;
  font-size: 18px;
  text-align: center;
  padding: 15px 0px 15px 0px;
  margin: 5px 3% 5px 0%;
  height: 50px;
  float: right;
}
/* ボタンをキラッとさせる */
.my-btn a:before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: -100%;
  background-image: linear-gradient(130deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 80%, rgba(255, 255, 255, 100) 81%, rgba(255, 255, 255, 0) 100%);
  animation: shine 3s infinite; /* inifiniteによりずっと続ける */
}
@keyframes shine {
  33% {
    left: 100%;
  }
  100% {
    left: 100%;
  }
}




.my-btn2 {
  text-align: center;
}
.my-btn2 a {
  color: #fff!important;
  text-decoration: none;
  line-height: 27px;
  position: relative;
  overflow: hidden;
  background: #c4dddd;
  width: 35.5%;
  border-radius: 10px;
  font-size: 18px;
  text-align: center;
  padding: 15px 0px 15px 0px;
  margin: 5px 3% 5px 1.5%;
  height: 50px;
  float: left;
}
/* ボタンをキラッとさせる */
.my-btn2 a:before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: -100%;
  background-image: linear-gradient(130deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 80%, rgba(255, 255, 255, 100) 81%, rgba(255, 255, 255, 0) 100%);
  animation: shine 3s infinite; /* inifiniteによりずっと続ける */  
}




.sold_btn_div {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 120px;
  height: 120px;
  border-top: 100px solid #ff3421;
  border-right: 100px solid #ff3421;
  border-bottom: 100px solid transparent;
  border-left: 100px solid transparent;
  color: #FFF;
}


.sold_btn_div2 {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 120px;
  height: 120px;
  color: #FFF;
  font-size: 41px;
  padding: 72px 0px 0px 4px;
  transform: rotate(42deg);
  -moz-transform: rotate(42deg);
  -webkit-transform: rotate(42deg);
}


.noify_alert_card {
  background: #000;
  border-radius: 28px;
  padding: 10px 30px;
  color: #FFF;
  margin: 20px 0px 0px 0px;
}
.noify_alert_card_icon i {
  font-size: 50px!important;
  display: contents!important;
  color: #FFF!important;
}

.noify_alert_card_title {
  font-size: 21px;
  font-weight: 700;
}
.noify_alert_card_body {
  font-size: 14px;
  font-weight: 200;
  line-height: 1.3;
  margin-top: 7px;
}

.end_main_view_price_div4 {
  margin: 14px 14px;
  padding: 12px 20px;
  font-size: 15px;
  color: #544e4e;
  font-weight: 200;
  border-radius: 19px;
}

.end_main_view_price_card5 {
  font-size: 46px;
  text-align: right;
  margin: 15px 0px;
}







.noify_alert_card_B {
  background: #000;
  border-radius: 0px 0px 30px 30px;
  padding: 20px 30px;
  color: #FFF;
}
.noify_alert_card_icon_B i {
  font-size: 80px!important;
  display: contents!important;
  color: #FFF!important;
}

.noify_alert_card_title_B {
  font-size: 31px;
  font-weight: 700;
  line-height: 1.3;
  margin: 12px 0px;
}
.noify_alert_card_body_B {
  font-size: 17px;
  font-weight: 100;
  line-height: 1.3;
  margin-top: 7px;
}





.noify_alert_card_C {
  margin: 0px 28px 0px 0px;
  padding: 12px 0px 30px 0px;
  font-size: 15px;
  color: #544e4e;
  font-weight: 200;
  border-radius: 0px 19px 19px 0px;
  box-shadow: 3px 3px 19px 1px rgb(0 0 0 / 15%);
}
.noify_alert_card_title_C {
  font-size: 29px;
  font-weight: 700;
  line-height: 1.3;
  margin: 9px 19px;
}
.noify_alert_card_body_C {
  font-size: 15px;
  font-weight: 100;
  line-height: 1.3;
  margin-top: 7px;
  margin: 0px 19px;
}

.noify_alert_card_icon_C {
  background: #3971e0;
  display: inline-block;
  width: 42px;
  color: #FFF;
  font-size: 24px;
  border-radius: 0px 20px 20px 0px;
  padding: 7px;
  height: 32px;
  box-shadow: 3px 3px 19px 1px rgb(0 0 0 / 15%);
}





.noify_alert_card_D {
  margin: 0px 0px 0px 28px;
  padding: 12px 0px 30px 0px;
  font-size: 15px;
  color: #544e4e;
  font-weight: 200;
  border-radius: 19px 0px 0px 19px;
  box-shadow: 3px 3px 19px 1px rgb(0 0 0 / 15%);
}
.noify_alert_card_title_D {
  font-size: 29px;
  font-weight: 700;
  line-height: 1.3;
  margin: 9px 19px;
}
.noify_alert_card_body_D {
  font-size: 15px;
  font-weight: 100;
  line-height: 1.3;
  margin-top: 7px;
  margin: 0px 19px;
}

.noify_alert_card_icon_D {
  background: #3971e0;
  display: inline-block;
  width: 42px;
  color: #FFF;
  font-size: 24px;
  border-radius: 0px 20px 20px 0px;
  padding: 7px;
  height: 32px;
  box-shadow: 3px 3px 19px 1px rgb(0 0 0 / 15%);
}



.card_scroll_area_line {
  background: #b1bee6;
  width: 10px;
  height: 30px;
  margin-left: 79px;
}





.noify_alert_card_E {
  background: #000;
  border-radius: 28px;
  padding: 10px 30px;
  color: #FFF;
  margin: 20px 17px 0px 17px;
}
.noify_alert_card_icon_E i {
  font-size: 35px!important;
  display: contents!important;
  color: #FFF!important;
  box-shadow: 3px 3px 19px 1px rgb(0 0 0 / 15%);
}

.noify_alert_card_icon_E{
  text-align: center;
}
.noify_alert_card_title_E {
  font-size: 21px;
  font-weight: 700;
  display: inline-block;
  line-height: 1.3;
}
.noify_alert_card_body_E {
  font-size: 14px;
  font-weight: 200;
  line-height: 1.3;
  margin-top: 7px;
}




.noify_alert_card_F {
  background: #d9d4d4;
  border-radius: 30px 30px 0px 0px;
  padding: 20px 30px;
  color: #FFF;
}
.noify_alert_card_icon_F i {
  font-size: 80px!important;
  display: contents!important;
  color: #FFF!important;
}

.noify_alert_card_title_F {
  font-size: 31px;
  font-weight: 700;
  line-height: 1.3;
  margin: 12px 0px;
}
.noify_alert_card_body_F {
  font-size: 17px;
  font-weight: 100;
  line-height: 1.3;
  margin-top: 7px;
}



.pic_up_q_and_a_btn {
  width: 80%;
  background: #c5921d;
  display: block;
  margin: 15px 10% 10px 10%;
  border-radius: 9px;
  padding: 8px 10px 8px 10px;
  font-size: 17px;
  text-align: center;
  color: #fff3d9;
  font-weight: 700;
}