@charset "utf-8";
/*全体*/
*{ margin: 0; padding: 0;}
a:hover img{
  opacity:0.8;
  filter:alpha(opacity=80);
  -ms-filter: “alpha( opacity=80 )”;
}
a { color: #323231; text-decoration: none;}
body { color: #323231; font-family: sans-serif;}
article {
  margin: auto;
  width: 98%;
}
section {
  margin:auto;
  max-width: 1200px;
}
section.lineup { margin: 0 auto; /*border: solid 1px #333;*/}
ul, ol, li { list-style: none;}

.fs-c-documentArticle__content {margin-bottom: 3rem;}


/* SPとPCの切り替え */
.img-pc { display: none !important;}
.img-sp { display: block !important;}

/*BUYボタン*/
.buy-btn {
  margin: 15px auto;
  width: 80%;
  border: solid 1px #333;
}
.buy-btn a {
  display: flex;
  padding: 10px;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

  /*MOREボタン*/
  .more_btn {width: 80%; margin: auto; margin-bottom:80px; text-align: center; border-radius: 10px;  border: 1px solid #333; padding: 0; position: relative;}
  .more_btn a {
    display: flex;
    padding: 15px;
    align-items: center;
    justify-content: center;
    font-size: 16px;
  }
  .more_btn a::before {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      right: 22px;
      margin: auto;
      width: 8px;
      height: 8px;
      z-index: 2;
    border-top: solid 2px #333;
    border-right: solid 2px #333;
      transform: rotate(45deg);
      transition: border-color .4s;
  }
  .more_btn a::after {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      right: 15px;
      margin: auto;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      z-index: 1;
      transition: background .0s;
  }

/*footer*/
.footer {
  margin: auto;
  padding-top: 30px;
  padding-bottom: 25px;
  width: 99%;
  text-align: center;
}
.footer a img {
  margin: 30px 0 0 0;
  width: 30%;
}
.copyright {
  font-size: 0.9rem;
  text-align: center;
}
.footer-cat { width: 99%;}

/*TOPへ戻る*/
#page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 14px;
  line-height: 1;
  z-index: 99;
}
#page-top a {
  background: #9f9f9f;/*dcdcdc*/
  text-decoration: none;
  color: #fcfcfc;
  width: 60px;
  padding: 28px 5px;
  text-align: center;
  display: block;
  border-radius: 90px;
  opacity: 0.7;
  transition: all .3s ease;
}
#page-top a:hover {
  text-decoration: none;
  opacity: .5;
}

/*TOP画像*/
.f_top {
  background: #fff;
}
.f_top-img {
  width: 100%;
}
.f_top-img img {
  width: 100%;
  margin: auto;
  max-width: 1200px;
}

/*box*/
.box1 { margin: auto; width: 100%;}

/*f_menu*/
.box-f_menu { max-width: 1200px;}
.f_menu {
  display: flex;
  flex-wrap: wrap;
  margin: 10px auto;
  padding: 15px 5px;
  justify-content: center;
}
.f_menu li {
  display: inline;
  margin: 3px;
  padding: 10px 0;
  width: 46%;
  border: 1px solid #dcdcdc;
}
.f_menu li a {
  display: block;
  height: 100%;
  line-height: 1.6;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}

.e_menu {
  display: flex;
  flex-wrap: wrap;
  text-align: center;
  margin: 20px auto;
  justify-content: center;
}
.e_menu li {
    display: inline;
    margin: 3px;
    padding-top: 10px;
    width: 31%;
    border: 1px solid #fff;
    background: #146f4b;
}
.e_menu li p{
  display: block;
  height: 100%;
  line-height: 1.6;
  font-weight: bold;
  text-align: center;
  color:#fff;
}

.e_menu li a {
  text-decoration: none!important;
}

.arrow-bottom {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin: 0 10px;
  border-bottom: 1px solid #323231;
  border-right: 1px solid #323231;
  transform: rotate(45deg);
}

.e_arrow-bottom {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin: 0 10px;
  border-bottom: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
}

/*title*/
.y_title1 {
  position: relative;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: bolder;
  font-style: italic;
  text-align: center;
  border-bottom: 5px solid #f6f6f6;
}
.y_title1::after {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  width: 70px;
  height: 5px;
  background-color: #5ab4bd;
}

p.y_subtitle1 {
  font-size: 12px;
  text-align: center;
  padding: 0;
  margin: 0rem 2rem 4rem;
}

.y_title2 {
  display: inline-block;
  font-size: 20px;
  background-image: linear-gradient(rgba(0,0,0,0) 70%, rgb(252,81,133) 70%);
  padding-bottom: 2px;
  margin-bottom: 10px;
}
.y_title2 > span { font-size: 15px;}
.y_title3 {/*商品紹介のとこで使ってる*/
  margin-bottom: 25px;
  position: relative;
  padding-top: 30px;
  padding-bottom: 10px;
  color: #696969;
  font-size: 17px;
  font-weight: bold;
  text-align: center;
}
.y_title3::after {
  content: '　';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 7px;
  height: 7px;
  background-color: #ffd700;/*点の色 b99b00*/
  border-radius: 7px;
}
.title4 {
  margin: 0 auto 2rem;
  padding: 1rem .5rem;
  border-left: 4px solid #000;
  font-size: 14px;
  font-weight: bold;
}

/*文字*/
.b-moji {
  font-size: 22px;/*20px googlefont未使用時*/
  color: #5ab4bd;
  font-weight: bold;
  font-family: 'Shippori Mincho B1', serif;
}

/*level*/
.level1,.f_level3,.level4 {/*level1:pc3列 SP1列 f_level3:PC4列 SP2列*/
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.level1-item,.f_level3-item {
  display: flex;
  flex-direction: column;
  width: 49%;
  margin-right: 2px;
  margin-bottom: 40px;
  position: relative;
}
.level1-item img,.f_level3-item img,.level4 img { width: 100%; vertical-align:top;}
.level1-item p,.f_level3-item p {
  margin: 10px;
  font-size: 12px;
  flex-grow: 1;
}

.f_level3-item span{
  font-size: 14px;
  font-weight: bold;
}

.top-left_1 {
  padding: 2% 6%;
  position: absolute;
  top: 0px;
  left: 0px;
  color:#fff;
  background-color: rgb(197, 175, 101);
}

.top-left_2 {
  padding: 2% 6%;
  position: absolute;
  top: 0px;
  left: 0px;
  color:#fff;
  background-color: #bebebe;
}

.top-left {
  padding: 2% 6%;
  position: absolute;
  top: 0px;
  left: 0px;
  color:#fff;
  background-color: #5d977f;
}

.top-left_NEW {
  font-size: 13px;
  padding: 2% 6%;
  position: absolute;
  top: 0px;
  left: 0px;
  color:#fff;
  background-color: #eb6877;
}

.f_level2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 15px;
}
.f_level2 img {
  display: block;
  padding: 15px;
  width: 90%;
  height: auto;
}
.f_level2-1 {
  width: 85%;/*80%*/
  padding: 10px 0 25px;
  font-size: 14px;
}
.f_level2-1 a,.ac-box a {
  color: #5ab4bd;
  font-weight: bold;
}
.item-type {
  margin: 3px 0 0 10px;
  padding: 3px;/*3px 5px*/
  text-align: left;
  border-bottom: 3px double #b5b5b5;
  font-size: 13px;
  width: 80%;/*30%*/
}

.item-type2 {
  margin: 3px auto;
  padding: 5px;
  text-align: center;
  border-bottom: 3px double #b5b5b5;
  font-size: 11px;
  width: 100%;
}
.level4-item {/*SNS TikTok*/
  display: flex;
  flex-direction: column;
  width: 49%;
  margin-right: 2px;
  margin-bottom: 2px;
}

.faeture_top h1{
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  padding: .5em 0em .3em;
  color: #333;
}

.feature_yukata {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  padding: .5em 0em .3em;
  color: #333;
}

p.faeture_yukata{
  text-align: center;
  line-height: 1.5em;
  color: #686868;
  font-size: 12px;
}

/*スライダー*/
.slider { margin:0 auto; width:94%;}
.slider img { width: 100%; height: auto;}
.slider .slick-slide { margin:0 10px;}
.slick-dots { margin: 20px 0 0 0; text-align: center;}
.slick-dots li { display: inline-block; margin: 0 5px;}
.slick-dots button {
  display: block;
  width: 8px;/*ドットボタンのサイズ*/
  height: 8px;/*ドットボタンのサイズ*/
  color: transparent;
  outline: none;
  border-radius: 50%;
  background: #ccc;/*ドットボタンの色*/
}

/*アコーディオン*/
.accordion-area {
  list-style: none;
  width: 96%;
  max-width: 1000px;
  margin: 0 auto;
}
.accordion-area li{
  margin: 15px 0;
  border: 1px solid #ccc;
}
.ac-title {
  position: relative;/*+マークの位置基準とするためrelative指定*/
  cursor: pointer;
  font-size:14px;
  padding: 3% 3% 3% 50px;
  transition: all .5s ease;
  overflow-wrap: break-word;
}
/*アイコンの＋と×*/
.ac-title::before,.ac-title::after {
  position: absolute;
  content:'';
  width: 15px;
  height: 2px;
  background-color: #333;
}
.ac-title::before {
  top:48%;
  left: 15px;
  transform: rotate(0deg);
}
.ac-title::after {
  top:48%;
  left: 15px;
  transform: rotate(90deg);
}
/*　closeというクラスがついたら形状変化　*/
.ac-title.close::before { transform: rotate(45deg);}
.ac-title.close::after { transform: rotate(-45deg);}
/*アコーディオンで現れるエリア*/
.ac-box {
  display: none;/*はじめは非表示*/
  background: #fff;
  margin:0 3% 3% 3%;
  padding: 3%;
  font-size: 14px;
}
/*テーブル*/
.ac-box > table { margin-bottom: 30px; width: 100%;}
.ac-box > table tr td { padding: 0 3px;}
.ac-box > table tr td img { width: 100%;}

  /*----------------------------
scroll_up ｜下から上へ出現
----------------------------*/
.scroll_up {
  transition: 0.8s ease-in-out;
  transform: translateY(40px);
  opacity: 0;
}
.scroll_up.on {
  transform: translateY(0);
  opacity: 1.0;
}

/*price*/
.f_ranking p{
  font-size: 14px;
  }
.f_ranking span{
  font-size: 16px;
  font-weight: bold;
  }

  .f_level3 ol {
    position: relative;
    overflow: hidden;
    padding: 10px;
    border-bottom: 1px solid #ccc;
    counter-increment: rank;
  }
  .f_level3 ol :before{
    position: absolute;
    content: counter(rank);
    top: 10px;
    left: 10px;
    z-index: 3;
    color: #fff;
    background: rgba(20,20,120,.8);
    padding: 5px
  }
  .f_level3 ol .th {
    display: block;
    float: left;
    margin-right: 20px;
    border: 1px solid #444;
    padding: 1px;
  }


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

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

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

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

  /*選択されているタブのコンテンツのみを表示*/
  #all:checked ~ #all_content,
  #ladies:checked ~ #ladies_content,
  #mens:checked ~ #mens_content,
  #kids:checked ~ #kids_content,
  #yukata:checked ~ #yukata_content,
  #sichigosan:checked ~ #sichigosan_content {
    display: block;
  }

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

 .rank_title {font-size: 25px; font-weight: bold; text-align: center; margin-top:30px;}
 .rank_subtitle {font-size: 18px; font-weight: bold; text-align: center;}

 
 /*day*/
 .day {
   margin-bottom: 15px;
   font-size: 11px;
   opacity: 0.5;
   text-align: left;
 }
 .day::before {
   content: "更新日: "
 }
 .day-list {
   margin: 30px auto;
   text-align: center;
   width: 90%;
   border: solid 1px #ed6161;
 }
 .day-list li {
   padding: 10px;
   font-size: 18px;
   font-weight: bold;
 }
 .day-list li span {
   font-size: 0.9rem;
 }
 .day-list1 {
   background: #ed6161;
   color: #ffffff;
 }
 
 /*title*/
 .title1 { /*INFORMATION*/
   margin: auto;
   margin-top: 50px;
   margin-bottom: 50px;
   padding: 15px;
   font-size: 15px;
   font-weight: bold;
   color: #404040;
   border: 2px solid #d8d8d8;
   text-align: center;
   width: 80%;
 }
 .title1-1 {
   font-size: 12px;
   font-weight: normal;
 }
 .title2 {
   margin-bottom: 15px;
   font-size: 16px;
   font-weight: bold;
   border-bottom: 3px dashed #d8d8d8;
 }
 .title3 {
   font-size: 15px;
   font-weight: bold;
 }
 .title3::after,.title3::before {
   content: " ◆ "
 }
 
 /*moji*/
 .bmoji-bk {
   font-weight: bold;
   color: #323231;
 }
 .bmoji-red {
   font-weight: bold;
   color: #e60033;
 }
 .smoji-bk {
   color: #323231;
 }
 .smoji-red {
   color: #e60033;
 }
 
 /*table*//*長期休業のところのみ*/
 table {
   width: 100%;
   color: #323231;
   border-collapse: collapse;
 }
 th {/*見出し*/
   background: #eee;
   padding: 10px;
   width: 20%;
   border: solid 1px #c0c0c0;
 }
 td {
   padding: 10px;
   font-size: 15px;
   text-align: center;
   border: solid 1px #c0c0c0;
 }
 .check1 {/*注目箇所*/
   background: #fdebeb;
 }
 .check2 {/*注目箇所*/
   background: #f8b7b7;
 }
 
 /*menu*/
 .menu {
   margin: 15px;
 }
 .menu li {
   padding: 5px;
 }
 .menu li a::before {
   content: "▼　"
 }
 .menu li a:hover {
   border-bottom: 1px dotted;
 }
 
 /*配送会社*/
 .box-btn {
   margin: 10px auto;
   width: 80%;
   border: 1px solid;/**/
 }
 .box-btn a {
   display: flex;
   padding: 10px;
   align-items: center;
   justify-content: center;
   color: #323231;
   font-size: 13px;/**/
 }
 
 /*footer*/
 footer {
   max-width: 100%;
 }
 .footer_navi {
   margin-top: 6rem;
   padding-bottom: 0.5rem;
   width: 100%;
   background-color:#f5f5f5;
 }
 .footer_logo {
   margin: auto;
   padding: 4rem 0 0 0;
   box-sizing: border-box;
   width: 30%;
 }
 .store_logo {
   margin: 0;
   box-sizing: border-box;
 }
 .store_logo img {
   width: 100%;
 }
 .tell_time {
   margin: 0.5rem 0 2.5rem 0;
   text-align: center;
 }
 .guide_ul {
   width: 100%;
   overflow: hidden;
 }
 .guide_ul li {
   display: block;
   padding: 1.2rem 0;
   width: 50%;
   text-align: center;
   float: left;
   border: 1px solid #ffffff;
   box-sizing: border-box;
 }
 .guide_ul li.full {
   margin: 0.5rem 0;
   width: 100%;
   border: none;
 }
 .shopr_rtop {
   margin: 0.3rem;
   text-align: center;
 }
 .shopr_rtop a {
   padding: 1rem;
   font-size: 14px;
 }
 .copyright {
   padding-bottom: 100px;
   font-size: 12px;
   background-color:#f5f5f5;
   text-align: center;
 }
 
/* PC 768px */
@media screen and (min-width : 768px) {
  /* SPとPCの切り替え */
  .img-pc { display: block !important; }
  .img-sp { display: none !important; }

  /*BUYボタン*/
  .buy-btn { width: 70%;}
  .buy-btn a:hover { color: #fff; background-color: #333;}

  /*footer*/
  .footer { max-width: 1000px;}
  .footer a img { max-width: 150px;}

  /*TOP画像*/
  .top { padding: 15px 0;}
  
  /*f_menu*/
  .f_menu { margin: auto;}
  .f_menu li { width: 23%;}
  .f_menu li a { font-weight: normal; font-size: 16px; padding:3%;}

  .e_menu {
    display: flex;
    flex-direction: row;
    text-align: center;
    margin: auto;
    padding: 15px 5px;
    justify-content: center;
    flex-wrap: nowrap;
  }
  .e_menu li {
    display: inline;
    margin: 3px;
    padding: 60px 0px 30px 0px;
    width: 46%;
    border: 1px solid #ffffff;
    border-radius: 150px 150px 0px 0px;
    background: #146f4b;;
  }
  .e_menu li:hover { opacity: 0.7; transform: translateY(-0.1900em); transition: all 0.3s ease 0s; }
  .e_menu li p{
    display: block;
    height: 100%;
    line-height: 1.6;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    color:#fff;
  }
  
  .e_menu li a {
    text-decoration: none!important;
  }

  /*level*/
  .level1-item { width: 32%;}
  .f_level2 { flex-direction: row;}
  .f_level2 img { width: 43%;}
  .f_level2-1 { width: 48%; padding: 15px;}
  .f_level2-1 a:hover,.ac-box a:hover {
    border-bottom: dashed 1px;
    opacity: 0.7;
  }

  .f_level3-item,.level4-item { width: 23%;}
  .f_level3-item span{
    font-weight: bold;
  }
  .item-type { 
    width: 70%;  
    text-align: left;
    border-bottom: 3px double #b5b5b5;
    font-size: 13px;
  }
  .item-type2 {
    margin: 3px 3px;
    padding: 3px;
    text-align: center;
    border-bottom: 3px double #b5b5b5;
    font-size: 12px;
    width: 90%;
  }

  .top-left_1 {
    padding: 2% 6%;
    position: absolute;
    top: 0px;
    left: 0px;
    color:#fff;
    background-color: rgb(197, 175, 101);
  }
  
  .top-left_2 {
    padding: 2% 6%;
    position: absolute;
    top: 0px;
    left: 0px;
    color:#fff;
    background-color: #bebebe;
  }
  
  .top-left {
    padding: 2% 6%;
    position: absolute;
    top: 0px;
    left: 0px;
    color:#fff;
    background-color: #5d977f;
  }

  .top-left_NEW {
  font-size: 13px;
  padding: 2% 6%;
  position: absolute;
  top: 0px;
  left: 0px;
  color:#fff;
  background-color: #eb6877;
}

 /*浴衣カテゴリサブタイトル*/
    .y_title1 {
    font-size: 22px;
    }
  p.y_subtitle1 {
    font-size: 16px;
    text-align: center;
    padding: 0;
    margin: 0rem 2rem 4rem;
  }
  

  /*price*/
  .f_ranking p{
    font-size: 14px;
    }
  .f_ranking span{
    font-size: 16px;
    font-weight: bold;
    }

  /*アコーディオン*/
  .accordion-area li{ margin: 20px 100px;}
  .ac-box img { width: 40%;}
  .mens_qa img{width: 90%;}

  /*----------------------------
  scroll_up ｜下から上へ出現
  ----------------------------*/
  .scroll_up {
    transition: 0.5s ease-in-out;
    transform: translateY(30px);
    opacity: 0;
  }
  .scroll_up.on {
    transform: translateY(0);
    opacity: 1.0;
  }

  .faeture_top h1{
    font-size: 30px;
    font-weight: bold;
    color: #333;
    padding: .5em 0em .3em;
  }

  /*MOREボタン*/
  .more_btn {width: 50%; margin: auto; margin-bottom:80px; text-align: center; border-radius: 10px; border: 1px solid #333; padding: 0; position: relative;}
  .more_btn a {
    display: flex;
    padding: 15px;
    align-items: center;
    justify-content: center;
    font-size: 18px;
  }
  .more_btn a::before {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      right: 22px;
      margin: auto;
      width: 8px;
      height: 8px;
      z-index: 2;
    border-top: solid 2px #333;
    border-right: solid 2px #333;
      transform: rotate(45deg);
      transition: border-color .4s;
  }
  .more_btn a::after {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      right: 15px;
      margin: auto;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      z-index: 1;
      transition: background .0s;
  }


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

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

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

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

  /*選択されているタブのコンテンツのみを表示*/
  #all:checked ~ #all_content,
  #ladies:checked ~ #ladies_content,
  #mens:checked ~ #mens_content,
  #kids:checked ~ #kids_content,
  #yukata:checked ~ #yukata_content,
  #sichigosan:checked ~ #sichigosan_content{
    display: block;
  }

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

  .rank_title {font-size: 35px; font-weight: bold; text-align: center; margin-top:30px; line-height: 30px;}
  .rank_subtitle {font-size: 25px; font-weight: bold; text-align: center;}
}

@media screen and (min-width : 768px) {
  .title4 {
    margin:0px 0px 10px 40px;
    padding: 1rem 1rem;
    border-left: 5px solid #000;
    font-size: 20px;
    font-weight: bold;
  }

   /* PC 768px */
 @media screen and (min-width : 768px) {
  article {
    margin: 30px auto 60px;
  }

  /*title*/
  .title1 {
    max-width: 500px;
  }

  /*menu*/
  .menu {
    margin: auto;
    max-width: 500px;
  }

  /*配送会社*/
  .btn {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .box-btn {
    margin: 10px;
    width: 29%;
  }
  .box-btn a:hover {
    color: #fff;
    background-color: #333;
  }


  /*footer*/
  .footer_navi {
    margin-top: 8rem;
  }
  .footer_logo {
    padding: 4rem 0 0 0;
    box-sizing: border-box;
    width: 10%;
  }
  .guide_ul {
    width: 100%;
    overflow: hidden;
  }
}

}