@charset "UTF-8";
/* CSS Document */
/*!
base
------------------------------
*/

@font-face {
    font-family: 'NotoSansJP';
    font-style: normal;
    font-weight: 400;
    src: url('../font/NotoSansJP-Regular.woff') format('woff'),
        url('../font/NotoSansjp-Regular.eot')  format('eot');
    font-display: swap;
}
@font-face {
    font-family: 'NotoSansJP';
    font-style: normal;
    font-weight: 700;
    src: url('../font/NotoSansJP-bold.woff') format('woff'),
         url('../font/NotoSansJP-bold.eot')  format('eot');
    font-display: swap;

}
@font-face {
    font-family: 'NotoSansJP';
    font-style: normal;
    font-weight: 900;
    src: url('../font/NotoSansJP-black.woff') format('woff'),
         url('../font/NotoSansJP-black.eot')  format('eot');
    font-display: swap;
}




.pagelink_nav {
  position: fixed;
  top: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  right: 0;
  height: 60px;
}
.pagelink_nav ul {
}
/*
.pagelink_nav ul a {
  display: block;
  margin: 0 10px;
  line-height: 60px;
  text-decoration: none;
  color: #000;
  font-weight: bold;
}
*/
.pagelink_nav ul a{
  width: 6px;
  height: 6px;
}

.pagelink_nav ul a::before {
  content:"—";
  color: #7D8DAB;
  font-size: 10px;
  display: block;
  padding-top: 12px;
  margin-bottom: 12px;
  width: 12px;
  height: 12px;
  text-align: end;

}
.pagelink_nav ul a .is-current{
  width: 14px;
  height: 14px;
}

.pagelink_nav ul .is-current::before {
  content:"●"!important;
  color: #7D8DAB;
  font-weight: bold;
  font-size: 14px;
  width: 14px;
  height: 14px;
}

main {
  padding-top: 60px;
}

.pagelink_nav_section {
  min-height: 400px;
  padding: 20px;
  text-align: center;
}
.pagelink_nav_section:nth-child(1) {
  background: #fee;
}
.pagelink_nav_section:nth-child(2) {
  background: #efe;
}
.pagelink_nav_section:nth-child(3) {
  background: #eef;
}
.pagelink_nav_section:nth-child(4) {
  background: #fef;
}





body {
    line-height: 1.8;
    letter-spacing: 0.5px;
    font-size: 14px;
    color: #212529;
    font-family: 'NotoSansJP', "Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, sans-serif;
/*    font-family: YuGothic, 'Yu Gothic medium', 'Hiragino Sans', Meiryo, 'sans-serif', "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, "NotoSansJP";*/
}
body.active {
    height: 100%;
    overflow: hidden;
}
a {
    text-decoration: none;
    color: inherit;
}
img {
    width: 100%;
    height: auto;
  vertical-align: middle;
}
picture {
    width: 100%;
    height: auto;
}
@media(min-width: 768px) {
    a[href^="tel:"] {
        pointer-events: none;
    }
}

.font_mincho {
  font-family: 'Noto Serif JP', serif;
  font-weight: 500;
}

.bg_gry {
    background-color: #f7f9fa;
    width: 100%;
}

.bg_wht {
  background-color: #fff!important;
  width: 100%;
}

.bg_wht_allow:after {
	content: '';
	display: block;
	position: absolute;
	box-sizing: border-box;
	top: 0px;
    left: 49%;
    width: 70px;
    height: 70px;
    margin-left: -25px;
    border: #fff 40px solid;
    border-top: transparent 40px solid;
  background: #f7f9fa;
  background-attachment: fixed;
  background-size: 200% 300%;/*サイズを大きくひきのばす*/
  animation: bggradient 10s ease infinite;
  background-position: center;
}

.bg_crm {
  background-color: #F7F3DB!important;
  border-radius: 20px 0 0 0;
  width: 100%;
}

.bg_bubble {
   background-image: url('../img/lock_bubble.png');
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
    background-repeat: no-repeat;
}

.bg_jp {
  height: 800px;
   background-image: url('../img/jp_search.png');
  background-size: contain;
  background-position: center top;
    background-repeat: no-repeat;
}

.bg_promise {
   background-image: url('../img/promise.jpg');
  background-size: cover;
  background-position: center top;
    background-repeat: no-repeat;
}

.bg_for-first {
    background-image: url(../img/page_v.jpg);
}

.bg_ble_gry {
  background-color: #EEF0F4;
}

.bg_high_blu {
  background-color: #7D8DAB;
}

.bg_mid_blu {
  background-color: #5C7196;
}

.bg_low_blu {
  background-color: #334D7C;
}



.c_light_gry {
    color: #909294!important;
}
.c_wht {
    color: #fff!important;
}
.c_light_bwn {
    color: #796C45!important;
}
.c_bwn {
  color: #382114!important;
}
.c_blu {
  color: #00205B!important;
}

header {
    width: 100%;
  border-bottom: 1px solid #ccc;
}
.header_container {
    border-bottom: 1px solid #ccc;
}
.top_head {
    padding: 0 15px;
    margin: 0 auto;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 86px;
}
.top_head_left_cont {
    width: 340px;
}
.top_head_center_cont {
    width: 90px;
}
.top_head_right_cont {
    width: 340px;
  display: flex;
    justify-content: end;
}

.top_head_right_cont a {
    font-size: 13px;
    color: #909294;
    padding-left: 10px;
}

.nav_head {
    padding: 0 15px;
    margin: 0 auto;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 60px;
    font-size: 16px;
  position: relative;
}



.main_v {
    padding: 80px 15px;
    text-align: left;
    color: #fff;
    width: 100%;
    height: 488px;
  background-position: center;
    background-image: url(../img/main_v.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    align-items: flex-end;
}
.main_catch_en {
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    padding-bottom: 10px;
    font-size: 20px;
    font-weight: 100;
}
.main_catch {
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    font-size: 32px;
    letter-spacing: 10px;
    font-weight: 100;
}


.main_v_container {
    margin: 0 auto;
    max-width: 1200px;
    width: 100%;
}

.heading01 {
    font-size: 30px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    color: #00205B;
  padding-bottom: 48px;
}
.heading01::before {
    content: attr(data-en);
    display: block;
    color: #796C45;
    font-size: 13px;
  font-family: "adobe-garamond-pro", serif;
  padding-bottom: 8px;
}
.heading01::after {
    content: '';
    display: block;
    width: 40px;
    height: 1px;
    background-color: #796C45;
  margin-top: 12px;
}

.heading01_w {
    font-size: 30px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    color: #FFFFFF;
  padding-bottom: 40px;
}
.heading01_w::before {
    content: attr(data-en);
    display: block;
    color: #fff;
    font-size: 13px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding-bottom: 12px;
}
.heading01_w::after {
    content: '';
    display: block;
    width: 40px;
    height: 1px;
    background-color: #fff;
  margin-top: 12px;
}

.heading01_bwn {
    font-size: 30px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    color: #382114;
  padding-bottom: 40px;
}
.heading01_bwn::before {
    content: attr(data-en);
    display: block;
    color: #382114;
    font-size: 13px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding-bottom: 12px;
}
.heading01_bwn::after {
    content: '';
    display: block;
    width: 40px;
    height: 1px;
    background-color: #382114;
  margin-top: 12px;
}


.f_a_auto {
  text-align: center;
}

.f_a_auto::after {
  margin: 12px auto;
}

.btn {
    color: #796C45;
    cursor: pointer;
    display: block;
    font-size: 16px;
    font-weight: 400;
    line-height: 45px;
    margin: 0 auto;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    vertical-align: middle;
    width: 100%;
}
.btn:hover {
    text-decoration: none;
}
.btn-5 {
  text-align: center;
    width: 230px;
    border-radius: 10px 0 10px 0;
    border: 1px solid #796C45;
    box-shadow: inset 0 0 20px rgba(121, 108, 69, 0);
    outline: 1px solid;
    outline-color: rgba(121, 108, 69, 0.5);
    outline-offset: 0px;
    text-shadow: none;
    -webkit-transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
.btn-5::after { /* 擬似要素で矢印アイコンをつくる */
    content: '';
    border: 0;
    border-top: solid 2px #796C45;
    border-right: solid 2px #796C45;
    display: inline-block;
    width: 8px;
    height: 8px;
    /* 矢印アイコンの位置を設定 */
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%) rotate(45deg); /* rotate(45deg)で矢印を回転（向きを変更）させる */
}
.btn-5:hover {
    border: 1px solid #796C45;
    box-shadow: inset 0 0 20px rgba(121, 108, 69, 0.5), 0 0 20px rgba(121, 108, 69, 0.2);
    outline-color: rgba(121, 108, 69, 0);
    outline-offset: 15px;
}

.btn-re::after { /* 擬似要素で矢印アイコンをつくる */
    content: '';
    border: 0;
    border-top: solid 2px #796C45;
    border-right: solid 2px #796C45;
    display: inline-block;
    width: 8px;
    height: 8px;
    /* 矢印アイコンの位置を設定 */
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%) rotate(-135deg); /* rotate(45deg)で矢印を回転（向きを変更）させる */
}

.big_b {
  width: 416px;
  line-height: 56px;
}

.ppl_b {
    color: #00205B;
    border: 1px solid #00205B;
    box-shadow: inset 0 0 20px rgba(0, 32, 91, 0);
    outline-color: rgba(0, 32, 91, 0.5);
}

.ppl_b:after {
    border-top: solid 2px #00205B;
    border-right: solid 2px #00205B;
}

.ppl_b:hover {
    border: 1px solid #00205B;
    box-shadow: inset 0 0 20px rgba(0, 32, 91, 0.3), 0 0 20px rgba(0, 32, 91, 0.05);
    outline-color: rgba(0, 32, 91, 0);
}

.wht_b {
    color: #fff;
    border: 1px solid #fff;
    box-shadow: inset 0 0 20px rgba(255, 255, 255, 0);
    outline-color: rgba(255, 255, 255, 0.5);
}

.wht_b:after {
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
}

.wht_b:hover {
    border: 1px solid #fff;
    box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.3), 0 0 20px rgba(255, 255, 255, 0.05);
    outline-color: rgba(255, 255, 255, 0);
}


.bwn_b {
    color: #382114;
    border: 1px solid #382114;
    box-shadow: inset 0 0 20px rgba(56, 33, 20, 0);
    outline-color: rgba(56, 33, 20, 0.5);
}

.bwn_b:after {
    border-top: solid 2px #382114;
    border-right: solid 2px #382114;
}

.bwn_b:hover {
    border: 1px solid #382114;
    box-shadow: inset 0 0 20px rgba(56, 33, 20, 0.3), 0 0 20px rgba(56, 33, 20, 0.05);
    outline-color: rgba(56, 33, 20, 0);
}


.wrap_container {
  width: 100%;
  max-width: 1230px;
  padding: 96px 15px;
  margin: 0 auto;
}

.wrap_cont_flex {
  display: flex;
  justify-content: space-between;
}

.wrap_cont_flex_box {
  width: 47%;
  position:relative;
}

.wrap_cont_flex_box_tenpo {
  width: 48%;
  position:relative;
}

.about_logo {
  width: 70%;
  margin: 0 auto;
}
.wrap_cont_sub_flex {
  background: #F7F8FA;
  padding: 24px 40px;
  display: flex;
  justify-content: space-between;
}

.wrap_cont_sub_flex_left {
  width: 64%;
}

.heading02 {
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    color: #00205B;
    border-bottom: 1px solid #909294;
  padding-bottom: 4px;
  margin-bottom: 24px;
  font-size: 20px;
}

.wrap_cont_sub_flex_right {
  width: 30%;
}

.grad_blue {
  width: 100%;
  background:linear-gradient(45deg, #FFA350,#534877,#0E8BE6);
  background-size: 200% 300%;/*サイズを大きくひきのばす*/
  animation: bggradient 7s ease infinite;
  position: relative;
}

@keyframes bggradient{
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.grad_blue:after {
	content: '';
	display: block;
	position: absolute;
	box-sizing: border-box;
	bottom: -80px;
    left: 49%;
    width: 70px;
    height: 70px;
    margin-left: -25px;
    border: #fff 40px solid;
    border-top: transparent 40px solid;
  background:linear-gradient(45deg, #FFA350,#534877,#0E8BE6);
  background-attachment: fixed;
  background-size: 200% 300%;/*サイズを大きくひきのばす*/
  animation: bggradient 7s ease infinite;
  background-position: center;
}
.grad_allow_none:after {
  content:none;
}

.grad_yellow {
  width: 100%;
  background:linear-gradient(45deg, #FCF5DF,#FAC356,#FAC356);/*グラデーションを定義*/
  background-size: 200% 300%;/*サイズを大きくひきのばす*/
  animation: bggradient 3s ease infinite;
}

@keyframes bggradient{
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}


.wrap_container_sub {
  margin: 0 auto;
  padding: 60px 15px;
  width: 100%;
  max-width: 1230px;
}

.pro_title {
  font-size: 30px;
  font-family: "adobe-garamond-pro", serif;
  line-height: 1.5;
  padding: 12px 0;
}

.pro_title_sub {
  font-size: 14px;
  padding: 4px 16px 2px;
  border-radius: 4px;
  border: 1px solid #fff;
  display: inline-block;
}

.pro_title_sub_bwn {
  font-size: 14px;
  padding: 4px 16px 2px;
  border-radius: 4px;
  border: 1px solid #382114;
  display: inline-block;
}

.pro_logo {
  width: 164px;
}

.pro_catch {
  line-height: 1.5;
  font-size: 32px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}

.pro_catch_big {
  text-align: center;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
      font-size: 30px;
    letter-spacing: 6.0px;
    padding-top: 12px;
}




.m_t-100 {
  margin-top: -120px;
}

.s_image {
  max-width: 860px;
  width: 100%;
  margin: 0 auto;
}

.border_cont {
  border-top: 1px solid #909294;
}

.archive_set {
  border-top: 1px solid #909294;
  width: 100%;
    max-width: 860px;
    margin: 0 auto;
}

.archive_set li{
  border-bottom: 1px solid #909294;
  position: relative;
}

.archive_set li::after { /* 擬似要素で矢印アイコンをつくる */
    content: '';
    border: 0;
    border-top: solid 2px #1C1B1F;
    border-right: solid 2px #1C1B1F;
    display: inline-block;
    width: 6px;
    height: 6px;
    /* 矢印アイコンの位置を設定 */
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%) rotate(45deg); /* rotate(45deg)で矢印を回転（向きを変更）させる */
  transition: 0.3s;
}

.archive_set li:hover::after { 
    right: 10px;
}

.n_parts_flex {
  display: flex;
  align-items: center;
  padding: 20px 0;
}

.n_parts_date {
  padding-right: 24px;
}

.sns_flex {
  width: 248px;
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
}

.sns_flex li{
  width: 32px;
  font-size: 32px;
  color: #00205B;
}

.sns_flex li a img{
  vertical-align: text-bottom;
}

footer {
  background: #F7F8FA;
}

.footer_logo {
  width: 224px;
  margin: 0 auto;
}

.footer_nav_flex {
  display: flex;
  justify-content: space-between;
  width: 832px;
}

.footer_nav {
  display: flex;
  flex-wrap: wrap;
  padding: 24px 0 12px;
}

.footer_nav li{
  padding-right: 24px;
  padding-bottom: 12px;
}

.footer_nav_pro_cont {
  padding: 32px 0;
  border-top: 1px solid #909294;
  border-bottom: 1px solid #909294;
}

.footer_nav_pro_flex {
  display: flex;
  justify-content: space-between;
}

.footer_nav_pro_parts {
  width: 25%;
  padding-right: 8px;
}

.footer_nav_pro_parts ul li {
  padding-bottom: 12px;
  display: flex;
}

.footer_nav_pro_parts ul li:before {
  margin-top: 9px;
  border-top: 1px solid;
  content: "";
  width: 8px;; /* 線の長さ */
  margin-right: 0.5em; /* 文字の右隣 */
}

.baton_logo {
  width: 15px;
  margin-right: 4px;
}

.flex_center {
  display: flex;
  justify-content: center;
  align-items: baseline;
}

.bubble_set {
  mix-blend-mode: hard-light;
  opacity: 0.3;
  position: absolute;
  width: 200px;
  top: 20%;
  left: -30%;
  overflow: hidden;
}

.bubble_set_right {
  mix-blend-mode: hard-light;
  opacity: 0.5;
  position: absolute;
  width: 200px;
  bottom: 0%;
  right: -30%;
  overflow: hidden;
}

.wo_set {
  position: absolute;
  width: 400px;
  top: 0%;
  left: -60%;
}

.wo_set2 {
  position: absolute;
  width: 400px;
  top: 0%;
  left: 100%;
}

.fade-in {
  opacity: 0;
/*  transition-duration: 500ms;*/
  transition-property: opacity, transform;
}

.fade-in_text {
  opacity: 0;
}

.fade-in_fast {
  opacity: 0;
/*  transition-duration: 1000ms;*/
  transition-property: opacity, transform;
}

.fade-in-up {
  transform: translateY(50px);
}

.fade-in-left {
  transform: translateX(-5%);
}

  
 

li:nth-child(1) .fade-in {
  animation-delay: 0.2s!important;
}
li:nth-child(2) .fade-in {
  animation-delay: 0.4s!important;
}
li:nth-child(3) .fade-in {
  animation-delay: 0.6s!important;
}
li:nth-child(4) .fade-in {
  animation-delay: 0.8s!important;
}
li:nth-child(5) .fade-in {
  animation-delay: 0.2s!important;
}
li:nth-child(6) .fade-in {
  animation-delay: 0.4s!important;
}
li:nth-child(7) .fade-in {
  animation-delay: 0.6s!important;
}
li:nth-child(8) .fade-in {
  animation-delay: 0.8s!important;
}


.fade-in:nth-child(1)  {
  animation-delay: 0.2s!important;
}
.fade-in:nth-child(2)  {
  animation-delay: 0.4s!important;
}
.fade-in:nth-child(3) {
  animation-delay: 0.6s!important;
}
.fade-in:nth-child(4) {
  animation-delay: 0.8s!important;
}
.fade-in:nth-child(5) {
  animation-delay: 0.2s!important;
}
.fade-in:nth-child(6)  {
  animation-delay: 0.4s!important;
}
.fade-in:nth-child(7) {
  animation-delay: 0.6s!important;
}
.fade-in:nth-child(8) {
  animation-delay: 0.8s!important;
}


.scroll-in_up {
  animation-name: fadeup;
    animation-duration: 0.8s;
    animation-fill-mode: forwards;
  }

 @keyframes fadeup {
    0% {
      opacity: 0;
  transform: translateY(30px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }


.scroll-in_left {
  animation-name: fadeleft;
    animation-duration: 0.8s;
    animation-fill-mode: forwards;
  animation-delay: 0.8s;
  }

 @keyframes fadeleft {
    0% {
      opacity: 0;
  transform: translateX(-5%);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }



/*左右のアニメーション*/
.slide-in {
	overflow: hidden;
    display: inline-block;
}

.slide-in_inner {
	display: inline-block;

}
.slideAnimeLeftRight {
  animation-name:slideTextX100;
  animation-duration:0.8s;
  animation-fill-mode:forwards;
    opacity: 0;
}

@keyframes slideTextX100 {
  from {
  transform: translateX(-100%); /*要素を左の枠外に移動*/
        opacity: 0;
  }

  to {
  transform: translateX(0);/*要素を元の位置に移動*/
    opacity: 1;
  }
}

.slideAnimeRightLeft {
	animation-name:slideTextX-100;
	animation-duration:0.8s;
	animation-fill-mode:forwards;
    opacity: 0;
}


@keyframes slideTextX-100 {
  from {
	transform: translateX(100%);/*要素を右の枠外に移動*/
    opacity: 0;
  }

  to {
	transform: translateX(0);/*要素を元の位置に移動*/
    opacity: 1;
  }
}

.page_title_container {
  padding: 72px 15px 15px;
  width: 100%;
  max-width: 1230px;
  margin: 0 auto;
}

.heading03 {
    font-size: 36px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    color: #00205B;
  padding-bottom: 40px;
}
.heading03::after {
    content: attr(data-en);
    display: block;
    color: #909294;
    font-size: 16px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding: 0px;
}

@keyframes flowing-anim {
 0%{
     width: 0%;
   }
100%{
     width: 100%;
   }
}

.page_v {
  border-radius: 0 10px 10px 0;
    width: 95%;
    height: 488px;
  overflow: hidden;
  background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.bg_product {
    background-image: url("../img/archives_title.png");
}


.heading04 {
    font-size: 20px;
  text-align: center;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding-bottom: 40px;
}
.heading04::before {
    content: attr(data-en);
    display: block;
    color: #00205B;
    font-size: 13px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding: 0px;
}

.width860 {
  width: 100%;
  max-width: 860px;
  margin: 0 auto;
}

.page_link_title {
  font-size: 24px;
  font-family: "adobe-garamond-pro", serif;
  text-align: center;
  padding-bottom: 24px;
}

.page_link_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}


.page_link_flex li {
  width: 25%;
  border-right: 1px solid #E0E0E0;
  text-align: center;
  margin: 0 auto;
  position: relative;
}


.page_link_flex li a{
  display: block;
  width: 100%;
    padding: 0 30px 0 15px;
}

.page_link_flex li:last-child {
  border-right: 0px;
}

.page_link_flex li::after { /* 擬似要素で矢印アイコンをつくる */
    content: '';
    border: 0;
    border-top: solid 2px #1C1B1F;
    border-right: solid 2px #1C1B1F;
    display: inline-block;
    width: 6px;
    height: 6px;
    /* 矢印アイコンの位置を設定 */
    position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%) rotate(135deg); /* rotate(45deg)で矢印を回転（向きを変更）させる */
  transition: 0.3s;
}

.page_link_flex li:hover::after { 
    top: 70%;
}


.wrap_cont_small {
  width: 100%;
  max-width: 680px;
/*  position: relative;*/
}

.wrap_cont_small_middle {
  margin: 0 auto;
  width: 100%;
  max-width: 840px;
  position: relative;
  padding: 64px 0;
}

.wrap_cont_middle {
  text-align: left;
  margin: 0 auto;
  width: 100%;
  max-width: 990px;
  position: relative;
  padding: 64px 0;
}

.wrap_cont_middle_fm {
  text-align: left;
  margin: 0 auto;
  width: 100%;
  max-width: 990px;
  position: relative;
  padding: 96px 15px;
}

.wrap_container_wht {
  width: 100%;
  max-width: 1200px;
  padding: 96px 15px;
  margin: 0 auto;
  border-radius: 20px 0 20px 0;
  background: #fff;
}

.wrap_container_gry {
  width: 100%;
  max-width: 1200px;
  padding: 96px 15px;
  margin: 0 auto;
  border-radius: 20px 0 20px 0;
  background-color: #f7f9fa;
  overflow-x: clip;
}

.page_wrap_cont_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 20px 0 20px 0;
}

.page_wrap_cont_parts {
  width: 50%;
}

.heading05 {
  font-size: 26px;
  color: #796C45;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}

.heading05 span{
  border-bottom: 1px solid #796C45;
  padding-bottom: 2px;
}

.heading06 {
    font-size: 26px;
  text-align: center;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding-bottom: 40px;
  color: #00205B;
  padding-bottom: 32px;
}
.heading06::before {
    content: attr(data-en);
    display: block;
    color: #796C45;
    font-size: 13px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding: 0px;
}

.wrap_full_sub {
  padding:0 15px;
}

.storong_txt {
  font-size: 26px;
  color: #00205B;
}

.storong_txt span{
  font-weight: bold;
  border-bottom: 1px solid #796C45;
  padding-bottom: 2px;
}

.parts_step_txt {
  font-size: 16px;
  padding: 16px;
  border-radius: 0px 0 20px 0;
  text-align: left;
  background: #f7f9fa;
}

.wrap_cont_parts_step {
  width: 31%;
  border: 1px solid #E0E0E0;
  border-radius: 20px 0 20px 0;
}

.wrap_cont_parts_step .bg_wht{
  border-radius: 20px 0 0 0;
}

.parts_step {
  margin: 0 auto;
    max-width: 220px;
  width: 100%;
  padding-bottom: 12px;
}

.cont_gry_border_top {
  border-radius: 20px 0 0 0;
}
.cont_gry_border_mid {
  border-radius: 0 0 0 0;
}
.cont_gry_border_btm {
  border-radius: 0 0 20px 0;
}
.cont_gry_border_line {
 background-image : linear-gradient(to right, #00205B 2px, transparent 2px),linear-gradient(to bottom, #00205B 2px, transparent 2px),linear-gradient(to left, #00205B 2px, transparent 2px),linear-gradient(to top, #00205B 2px, transparent 2px);
 background-size: 8px 2px,0,8px 2px,0;
 background-repeat: repeat-x,repeat-y,repeat-x,repeat-y;
 background-position:left top,right 0px,3px bottom,left 7px;
}

.bubble_sub_right {
   transform: rotate( -180deg );
    opacity: 0.5;
    position: absolute;
    width: 200px;
    bottom: -20%;
    right: -8%;
  z-index: -1;
  overflow: hidden;
}

.bubble_sub_left {
   transform: rotate( -180deg );
    opacity: 0.5;
    position: absolute;
    width: 200px;
    top: 0%;
    left: -8%;
  z-index: -1;
}

 

.arrow_bottom {
    position: relative;
    line-height: 1.8;
    padding: 60px 1rem 0;
  margin-bottom: 60px;
    border-bottom: 1px solid #00205B;
    color: #333333;
    text-align: center
}

.arrow_bottom::before,
.arrow_bottom::after {
    position: absolute;
    left: 50%;
    transform:translate(-50%);
    bottom: -30px;
    width: 60px;
    height: 30px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
}

.arrow_bottom::before {
    background-color: #00205B;
}

.arrow_bottom::after {
    bottom: -28.5px;
    background-color: #f7f9fa;
}

.wc_1230 {
  width: 100%;
  max-width: 1230px;
}

.wc_960 {
  width: 100%;
  max-width: 960px;
}

.w560 {
  padding-top: 40px;
  margin: 0 auto;
  width: 100%;
  max-width: 560px;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding-top: 60px;
}

.breadcrumb li:not(:last-of-type)::after {
  content: "›";
  margin: 0 .6em; /* 記号の左右の余白 */
  color: #777; /* 記号の色 */
}

.tabs {
  margin-top: 50px;
  background-color: #fff;
  margin: 0 auto;}

/*タブのスタイル*/
.tab_item {
  width: calc(100%/4);
    border-radius: 20px 20px 0 0;
    height: 64px;
    background-color: #d9d9d9;
    line-height: 20px;
    padding-top: 12px;
    font-size: 16px;
    text-align: center;
    color: #565656;
    display: block;
    float: left;
    text-align: center;
    font-weight: bold;
    transition: all 0.2s ease;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
    border-top: 3px solid #00205B;
  display: none;
  padding: 40px 0;
  clear: both;
  overflow: hidden;
  position: relative;
}


/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
  background-color: #00205B;
  color: #fff;
}

.tab_item span {
    display: block;
    font-size: 12px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding: 0px;
}

.selectbox_pre {
    position: relative;
}

.selectbox_pre::before,
.selectbox_pre::after {
    position: absolute;
    content: '';
    pointer-events: none;
}

.selectbox_pre::before {
    right: 0;
    display: inline-block;
    width: 2.8em;
    height: 2.8em;
    border-radius: 0 3px 3px 0;
    content: '';
}

.selectbox_pre::after {
    position: absolute;
    top: 50%;
    right: 1.4em;
    transform: translate(50%, -50%) rotate(45deg);
    width: 6px;
    height: 6px;
    border-bottom: 2px solid #00205B;
    border-right: 2px solid #00205B;
    content: '';
}

.selectbox_pre select {
  margin-top: 4px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 100%;
    height: 2.8em;
    padding: .4em 3.6em .4em .8em;
    border: 1px solid #E0E0E0;
    border-radius: 3px;
    color: #333333;
    font-size: 1em;
    cursor: pointer;
}

.selectbox_pre select:focus {
    outline: 1px solid #E0E0E0;
}

.checkbox {
    display: flex;
    flex-wrap: wrap;
    gap: .5em 2em;
    border: none;
}

.checkbox label {
    display: flex;
  margin-top: 4px;
    align-items: center;
    gap: 0 .5em;
    position: relative;
    cursor: pointer;
}

.checkbox label::before {
    width: 18px;
    height: 18px;
    border-radius: 3px;
    border: 2px solid #d6dde3;
    content: '';
}

.checkbox label:has(:checked)::after {
    position: absolute;
    top: 5px;
    left: 7px;
    transform: rotate(45deg);
    width: 5px;
    height: 10px;
    border: solid #00205b;
    border-width: 0 3px 3px 0;
    content: '';
}

.checkbox input {
    display: none;
}

.search_note{
  padding-top: 40px;
  }

.search_note li{
    padding-left: 1em;
    text-indent: -1em;
  }

.jp_search{
  display: flex;
    flex-wrap: wrap;
    gap: 8px;
  
}

.jp_search p{
  font-size: 14px;
  color: #00205B;
  font-weight: bold;
  width: 200px;
}

.jp_search li{
  font-size: 16px;
  padding-right: 6px;
  display: inline-block;
  border-right: 1px solid #E0E0E0;
  margin-top: 4px;
    line-height: 1.0;
}

.search_cont_parts {
  width: 31%;
}

.jp_search {
  position: absolute;
  width: 200px;
}

.hokkaido {
  top: 100px;
  left: 50%;
}

.tohoku {
  top: 200px;
  right: 10%;
}

.kanto {
  top: 350px;
  right: 13%;
}

.tokai {
  top: 500px;
  right: 15%;
}

.koushinetsu_hokuriku {
  top: 170px;
  left: 28%;
}

.kinki {
  top: 280px;
  left: 20%;
}

.chugoku {
  top: 390px;
  left: 10%;
}

.kyusyu {
  top: 520px;
  left: 5%;
}

.shikoku {
  top: 570px;
  left: 38%;
}

.search_result {
  padding: 60px 0 8px 8px;
  font-size: 16px;
  border-bottom: 2px solid #99A6BD;
  margin-bottom: 40px;
}

.search_result span{
  font-size: 20px;
  margin-right: 4px;
}

.middle_cont_flex_parts {
  width: 48px;
}

.middle_cont_flex {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.middle_cont_flexbox:after {
    content: "";
    display: block;
    width: 48%;  /* .boxに指定したwidthと同じ幅を指定する */
    height: 0;
}

.middle_cont_flex li{
  width: 48%;
  position: relative;
  padding-bottom: 24px;
  border-bottom: 1px solid #E0E0E0;
  margin-bottom: 32px;
}

.middle_cont_flex li p{
  font-size: 14px;
  padding-bottom: 4px;
}

.tenpo_name::after{/* 擬似要素で矢印アイコンをつくる */
    content: '';
    border: 0;
    border-top: solid 2px #212529;
    border-right: solid 2px #212529;
    display: inline-block;
    width: 8px;
    height: 8px;
    /* 矢印アイコンの位置を設定 */
    position: absolute;
    top: 15px;
    right: 30px;
    transform: translateY(-50%) rotate(45deg);
  transition: 0.3s;
}

.tenpo_name:hover::after{
    right: 20px;
}

.splide__pagination {
    bottom: 2em;
}

.splide__pagination__page {
    background: #e0e0e0;
    border: 0;
    border-radius: 50%;
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 3px;
    padding: 0;
    position: relative;
    transition: transform .2s linear;
}

.splide__arrow {
    display: none;
}

.splide__pagination li {
    margin: 10px;
}

.tenpo_name {
  font-size: 18px;
  text-decoration: underline;
}

.tenpo_name:hover {
  text-decoration: none;
}

.tenpo_tag {
  font-size: 12px;
  padding: 8px;
  background: #EEF0F4;
  margin-right: 8px; 
  border-radius: 4px;
}
.heading07 {
  font-size: 20px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding-top: 32px;
  padding-bottom: 8px;
}

.jp_search_tenpo {
  width: auto;
  position: static;
}

.jp_search_tenpo li{
  padding-top: 4px;
}

.heading08 {
  font-size: 36px;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  color: #00205B;
  padding-bottom: 24px;
}

.tenpo_details {
list-style: none;
padding-left: 1em; /* 文章のスタート位置。li:beforeが入るスペースを確保*/
}

.tenpo_details div{
  position: relative;
padding-left: 24px;
  padding-bottom: 16px;
  margin: 16px 0 16px 8px;
  border-bottom: 1px solid #E0E0E0;
}
.tenpo_details div:first-of-type{
  margin: 0px 0 16px 8px;
}

.address_txt:before {
font-family: FontAwesome;
content: "\f3c5" ;
position: absolute;
left: 0; top: 0; 
}
.tel_txt:before {
font-family: FontAwesome;
content: "\f095" ;
position: absolute;
left: 0; top: 0; 
}
.schedule_txt:before {
font-family: FontAwesome;
content: "\f073" ;
position: absolute;
left: 0; top: 0; 
}
.access_txt:before {
font-family: FontAwesome;
content: "\f239";
position: absolute;
left: 0; top: 0; 
}
.url_txt:before {
font-family: FontAwesome;
content: "\f35d" ;
position: absolute;
left: 0; top: 0; 
}

.other_txt {
  padding-left: 46px!important;
}

.other_txt:before {
font-family: FontAwesome;
content: "備考：" ;
position: absolute;
left: 0; top: 0; 
}

.search_paling {
  border-radius: 20px 0 20px 0;
  border: 1px solid #00205B;
  padding: 32px 32px 16px 32px;
}

.btn span{
  font-size: 12px;
  display: block;
  line-height: 1.0;
}

.cv_btn {
  padding: 8px 0 12px 0;
  line-height: 32px;
  width: 100%;
}

.flow_step {
  padding: 24px;
  background: #F7F8FA;
}

.flow_step p {
  font-size: 16px;
  font-weight: normal;
}
.flow_step p span {
  font-weight: normal;
  color: #00205B;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding-right: 4px;
}

.btn_b_wrap {
  width: 80%;
  margin: 0 auto;
}

.btn_b_wrap_center {
  width: 100%;
  max-width: 416px;
  margin: 0 auto;
}

.dli-caret-down {
  display: block;
    vertical-align: middle;
    color: #00205B;
    margin: 24px auto;
    line-height: 1;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent;
    border-width: 1.5em;
    border-top-color: currentColor;
    border-bottom: 0;
}

.document_small_flex_parts {
  width: 35%;
}
.document_middle_flex_parts {
  width: 60%;
}

.content_none::after {
  content:none;
}

.box_shadow {
  box-shadow: 0px 0px 25px -7px #bababa;  
}

.top_page_link_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  padding-top: 32px;
}

.top_page_link_flex li{
    font-size: 14px;
  margin-top: 16px;
  border-right: 1px solid #E0E0E0;
  width: 50%;
  text-align: center;
}

.top_page_link_flex li:nth-child(2){
  border-right: 0px;
}

.top_page_link_flex li:nth-child(4){
  border-right: 0px;
}

.top_page_link_flex li::before {
    content: attr(data-en);
    display: block;
    color: #796C45;
    font-size: 10px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding-bottom: 2px;
}

  #navbtn{
    display:none;
  }

.reason_point {
  font-size: 14px;
  display: inline-block;
  font-weight: bold;
  color: #796C45;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  padding: 2px 8px 0;
  margin-bottom: 8px;
  background: #F7F8FA;
  border-radius: 4px;
}

.reason_num01 {
  position: absolute;
  top: -50px;
    left: -50px;
    width: 96px;
    height: auto;
}

.reason_num02 {
  position: absolute;
  top: -50px;
    left: -50px;
    width: 96px;
    height: auto;
}

.reason_num03 {
  position: absolute;
  top: -50px;
    right: -50px;
    width: 96px;
    height: auto;
}
.about_logo_big {
  margin: -200px auto 0!important;
}

.ceo_name {
  font-size: 24px;
  padding-bottom: 8px;
  border-bottom: 1px solid #E0E0E0;
}

.ceo_name span{
  font-size: 14px;
  padding-left: 8px;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}

.search-form-003 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  overflow: hidden;
  border: 1px solid #b8bbbf;
  border-radius: 8px;
  width: 50%;
}

.search-form-003 input {
  width: 100%;
  height: 45px;
  padding: 5px 15px 5px 0;
  border: none;
  box-sizing: border-box;
  font-size: 14px;
  outline: none;
}

.search-form-003 input::placeholder {
  color: #909294;
}

.search-form-003 button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 45px;
  border: none;
  background-color: #fff;
  cursor: pointer;
}

.search-form-003 button::after {
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M23.7%2020.8%2019%2016.1c-.2-.2-.5-.3-.8-.3h-.8c1.3-1.7%202-3.7%202-6C19.5%204.4%2015.1%200%209.7%200S0%204.4%200%209.7s4.4%209.7%209.7%209.7c2.3%200%204.3-.8%206-2v.8c0%20.3.1.6.3.8l4.7%204.7c.4.4%201.2.4%201.6%200l1.3-1.3c.5-.5.5-1.2.1-1.6zm-14-5.1c-3.3%200-6-2.7-6-6s2.7-6%206-6%206%202.7%206%206-2.6%206-6%206z%22%20fill%3D%22%23909294%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  content: "";
}

.survey_img {
  width: 50%;
  margin: 0 auto;
  padding: 24px 0;
}

.survey_txt {
  font-size: 14px;
  padding-top: 24px;
  border-top: 1px solid #E0E0E0;
}

.border_motif {
  border-radius: 20px 0 20px 0;
}

.award_flex_parts{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 990px;
  width: 100%;
}

.award_flex_parts li{
  width: 22%;
  aspect-ratio: 9/10;
}

.award_flex_parts img{
  object-fit:contain;
width:100%;
height:100%;
}


.tbl-r02  {
  width: 100%;
    border: solid 1px #EEF0F4;
}

.tbl-r02 th {
  background: #F7F8FA;
    padding: 20px 15px;
    border-bottom: solid 1px #EEF0F4;
  vertical-align: middle;
    width: 188px;
  color: #00205B;
  font-size: 20px;
  font-family: "adobe-garamond-pro", serif;
font-style: normal;
}
.tbl-r02 td {
  font-size: 16px;
    border-bottom: solid 1px #EEF0F4;
 padding: 20px 16px;
}
.tbl-r02 td a{
  text-decoration: underline;
}

.tbl-r02 td a:hover{
  text-decoration: none;
}

.archives_link_flex {
  display: flex;
  justify-content: center;
  align-items: center;
}

.archives_link_flex li{
  border-radius: 30px;
  background-color: #EEF0F4;
  text-align: center;
  padding: 0px 12px;
  color: #00205B;
  margin: 0 8px 12px;
  position: relative;
  font-weight: bold;
  line-height: 1.0;
}
.archives_link_flex li a{
    padding: 0 30px 0 15px;
  line-height: 2.3;
}

.archives_link_flex li a:hover{
    text-decoration: underline;
}

.archives_link_flex li::after { /* 擬似要素で矢印アイコンをつくる */
    content: '';
    border: 0;
    border-top: solid 2px #00205B;
    border-right: solid 2px #00205B;
    display: inline-block;
    width: 6px;
    height: 6px;
    /* 矢印アイコンの位置を設定 */
    position: absolute;
    top: 45%;
    right: 25px;
    transform: translateY(-50%) rotate(135deg); /* rotate(45deg)で矢印を回転（向きを変更）させる */
  transition: 0.3s;
}

.archives_link_flex li:hover::after { 
    top: 55%;
}

.archive_flex_left {
  width: 60%;
  padding: 48px;
}

.archive_flex_right {
  width: 40%;
}

.bg_otosu {
   background-image: url('../img/otosu_title.png');
  background-size: cover;
  background-position: left;
    background-repeat: no-repeat;
  border-radius: 0px 0px 20px 0px;
}

.bg_ataeru {
   background-image: url('../img/ataeru_title.png');
  background-size: cover;
  background-position: left;
    background-repeat: no-repeat;
  border-radius: 0px 0px 20px 0px;
}
.bg_mamoru {
   background-image: url('../img/mamoru_title.png');
  background-size: cover;
  background-position: left;
    background-repeat: no-repeat;
  border-radius: 0px 0px 20px 0px;
}
.bg_archive_title_01 {
  background: #F6FAFB;
  border-radius: 20px 0 20px 0px;
  margin-bottom: 48px;
}

.bg_archive_title_02 {
  background: #FBFBFC;
  border-radius: 20px 0 20px 0px;
  margin-bottom: 48px;
}

.bg_archive_title_03 {
  background: #F8F2EF;
  border-radius: 20px 0 20px 0px;
  margin-bottom: 48px;
}
 
.archive_title_step {
  width: 96px;
  position: absolute;
  top: -50px;
  left:-50px;
}
 
.archive_title_img {
  width: 88px;
  position: absolute;
  top:25px;
  left:225px;
  z-index: auto;
}

.archive_title_img img{
  mix-blend-mode: multiply;
}

.heading02 span{
  font-size: 14px;
  color: #212529;
  display: block;
}

.archive_card_flex {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.archive_card_flex::after {
  width: 22%;
  display: block;
content:"";
}

.archive_card_flex li {
  width: 22%;
  margin-top: 48px;
}


.archive_card_flex li a{
  transition: 0.3s;
}
.archive_card_flex li a:hover {
  opacity: 0.5;
}

.archive_card_catch {
  font-size: 12px;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}

.archive_card_title {
  font-size: 15px;
}


.archive_tag {
  font-size: 10px;
    display: inline-block;
    padding: 4px 8px;
    background: #EEF0F4;
    margin-right: 8px;
    margin-bottom: 8px;
    border-radius: 4px;
}

.archive_enter {
  font-size: 16px;
  text-decoration: underline;
  text-align: right;
  display: inline-block;
    padding-top: 48px;
}

.archive_enter:hover {
  text-decoration: none;
}

.heading09 {
    font-size: 36px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    color: #00205B;
    padding-bottom: 24px;
    border-bottom: 1px solid #EEF0F4;
}
.heading09::after {
    content: attr(data-en);
    display: block;
    color: #909294;
    font-size: 14px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    padding: 0px;
}

.archive_cat {
  padding: 6px 12px 4px;
  border-radius: 8px 0 8px 0;
  color: #fff;
  display: inline-block;
  margin-bottom: 8px;
}

.advice_wrap {
  background: #F7F8FA;
  padding: 32px 40px;
  margin-top: 32px;
  border-radius: 20px 0 20px 0;
}

.advice_wrap_cat {
  padding: 32px 40px;
  margin-top: 32px;
  border-radius: 20px 0 20px 0;
  border: 1px solid #E0E0E0;
}



.bg_single_sld {
  background-image: url(../img/bg_single_sld.png);
  background-repeat: no-repeat;
  background-size: 52%;
  background-position: left bottom;
  width: 100%;
  height: auto;
}


.single_cont_flex_left {
  width: 55%;
  padding: 0 24px;
}

.single_cont_flex_right {
  width: 43%;
}

.splide_s {
  max-width: 565px;
  width: 100%;
  box-shadow: 0px 0px 22px -5px #d1d1d1;
border-radius: 0px;
}

.splide_s .splide__pagination {
  bottom:-4em;
}
.heading10 {
    font-size: 32px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    color: #00205B;
    padding-bottom: 24px;
  line-height: 1.3;
}
.heading10::after {
    content: attr(data-en);
    display: block;
    color: #796C45;
    font-size: 14px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    padding-top: 12px;
}

.accordion {
border-top: 1px solid #E0E0E0;
margin: 3em auto;
}
.toggle {
display: none;
}
.option {
position: relative;
}
.title,
.content {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
transition: all 0.3s;
  font-size: 16px;
}
.title {
padding: 1.5em 1em;
display: block;
color: #333;
font-weight: bold;
}
.title::after,
.title::before {
content: "";
position: absolute;
right: 1.25em;
top: 40%;
width: 2px;
height: 0.75em;
background-color: #999;
transition: all 0.3s;
}
.title::after {
transform: rotate(90deg);
}
.content {
  font-size: 16px;
max-height: 0;
overflow: hidden;
border-bottom: 1px solid #E0E0E0;
  transition: 0.1s;
}
.content p {
margin: 0;
font-size: 0.9em;
line-height: 1.5;
padding: 1.5em 1em;
}
.toggle:checked + .title + .content {
max-height: 1000px;
padding-bottom: 1em;
transition: 0.3s;
}
.toggle:checked + .title::before {
transform: rotate(90deg) !important;
}

.movie_box_single {
  width: 90%;
  margin: 0 auto;
}

.youtube_ifreme {
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto;
}

.sns_share_flex {
    width: 160px;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

 .sns_share_flex li{
  width: 32px;
  font-size: 32px;
  color: #909294;
}

.sns_flex li a img{
  vertical-align: text-bottom;
}

.dot_border {
  background-image: linear-gradient(to right, #00205B 2px, transparent 2px),linear-gradient(to bottom, #00205B 2px, transparent 2px),linear-gradient(to left, #00205B 2px, transparent 2px),linear-gradient(to top, #00205B 2px, transparent 2px);
    background-size: 8px 2px,0,0,0;
    background-repeat: repeat-x,repeat-y,repeat-x,repeat-y;
    background-position: left top,right 0px,3px bottom,left 7px;
}


.splide_recom .splide__pagination {
    bottom: -1em;
}

.splide_s .splide__arrow ,
.splide_cat .splide__arrow ,
.splide_recom .splide__arrow {
  display: block;
  background: none;
  }
  .splide__arrow svg {
    fill: #000;
    height: 1.7em;
    width: 1.7em;
}

.splide_cat .splide__pagination {
    bottom: -1em;
}

.splide_cat .splide__arrow {
  display: block;
  background: none;

  }
 .splide_cat .splide__arrow svg {
    fill: #000;
    height: 1.7em;
    width: 1.7em;
}

.splide__pagination__page.is-active {
    background: #212529;
    transform: scale(1);
    z-index: 1;
}

.splide_recom .splide__pagination,
.splide_cat .splide__pagination {
position: static;
}

.splide_recom,
.splide_cat {
width: 90%;
  margin: 0 auto;
}

.splide__arrow--next {
    right: -3em;
}
.splide__arrow--prev {
    left: -3em;
}


.splide.is-initialized{
  margin: 0 auto;
}

.news_archive_wrap li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px 0;
  border-bottom: 1px solid #e0e0e0;
}

.news_date {
  font-size: 12px;
  display: inline-block;
  color: #fff;
  padding:4px 12px;
  margin-bottom: 8px;
  border-radius: 30px;
  background: #00205B;
  font-family: "adobe-garamond-pro", serif;
}

.news_archive_title {
  font-size: 16px;
  text-decoration: underline;
  padding: 16px 0;
}

.news_detail {
  font-size: 14px;
}

.news_contents_area {
  text-align: center;
}

.news_contents_area img{
  width: 80%;
  height: auto;
  text-align: center;
  border-radius: 20px 0 20px 0;
}

.news_contents_area h2{
  font-size: 20px;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    color: #00205B;
    padding-bottom: 24px;
  text-align: left;
  line-height: 1.3;
}

.news_contents_area p{
  text-align: left;
  font-size: 16px;
}


.media_archive_wrap  {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.media_archive_wrap:after  {
  width: 25%;
  display: block;
content:"";
}

.media_archive_wrap li{
  width: 25%;
  border-bottom: 1px solid #E0E0E0;
  margin: 0 0 20px;
}

.media_archive_wrap li a{
  padding: 0 20px 0px;
  display: block;
  border-right: 1px solid #E0E0E0;
  margin: 0 0 20px;
}


.media_archive_wrap li:nth-of-type(4n) a {
  border-right: 0px;
}

.media_archive_wrap li:nth-child(n+5) {
  border-bottom: 0px;
}

.media_archive_img {
  width: 100%;
  aspect-ratio: 8/10;
}

.media_archive_img img {
    object-fit: contain;
    width: 100%;
    height: 100%;
    vertical-align: middle;
}

.archive_year {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}


.archive_year li{
  color: #00205B;
  display: inline-block;
  width: 10.1%;
  text-align: center;
    padding: 4px 0 2px;
    border: 1px solid #00205B;
    border-radius: 4px;
}

.media_single_flex {
  display: flex;
  justify-content: space-between;
}

.media_single_flex li{
  width: 31%;
  aspect-ratio: 8/10;
}

.media_single_flex li img{
    object-fit: contain;
    width: 100%;
    height: 100%;
    vertical-align: middle;
}

.media_single_flex_btn {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}

.media_single_flex_btn:after {
  width: 31%;
  display: block;
content:"";
}

.media_single_flex_btn li{
  width: 31%;
}

.media_single_flex_btn li .btn-5 {
  width: 100%;
}
.toggle_footer {
display: none;
}
.splide_ab .splide__slide img {
  transition: 8s ease-out;
}
.splide_ab .splide__slide.is-active img {
  transform: scale(1.10);
  transition-delay: 0s;
}
/* スライドのサイズ調整 */
.splide_ab .splide__slide img {
  height: auto;
  width: 100%;
}



.accordion_tenpo {
margin: 3em auto;
}
.toggle_tenpo {
display: none;
}
.option_tenpo {
position: relative;
}


.title_tenpo,
.content_tenpo {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
transition: all 0.3s;
  font-size: 16px;
}

.title_tenpo {
    padding: 0 2em;
    width: 416px;
    position: absolute;
    z-index: 10;
    background: #fff;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    line-height: 56px;
    display: block;
    color: #00205B;
    width: 300px;
    margin: 0 auto;
    border-radius: 10px 0 10px 0;
    border: 2px solid #00205B;
}

.title_tenpo::after,
.title_tenpo::before {
content: "";
position: absolute;
right: 1.25em;
top: 40%;
width: 2px;
height: 0.75em;
background-color: #00205B;
transition: all 0.3s;
}
.title_tenpo::after {
transform: rotate(90deg);
}
.content_tenpo {
  font-size: 16px;
max-height: 0;
  padding: 0 24px;
overflow: hidden;
  transition: 0.1s;
  border-radius: 20px 0 20px 0;
    border: 1px solid #99A6BD;
/*    border-top: 1px solid #00205B;*/
  margin-top: -30px;
}

.toggle_tenpo:checked + .title_tenpo + .content_tenpo {
max-height: 1000px;
padding-bottom: 1em;
transition: 0.3s;
  padding:  80px 24px 32px;
}
.toggle_tenpo:checked + .title_tenpo::before {
transform: rotate(90deg) !important;
}



.pager  ul.pagination {
  text-align: center;
  margin: 0;
  padding: 24px 0;
}

.pager .pagination li {
  border-radius: 4px;
  display: inline;
  margin: 0 2px;
  padding: 0;
  display: inline-block;
  border: 1px solid #E0E0E0;
  width: 50px;
  height: 50px;
  text-align: center;
  position: relative;
}

.pager .pagination li a{
  vertical-align: middle;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display:table;
  text-decoration: none;
  transition: 0.3s;
}

.pager .pagination li a span{
  display:table-cell;
  vertical-align:middle;
}

.pager .pagination li a:hover{
  opacity: 0.5;
}

.pager .pagination li a.active{
  border-radius: 4px;
  color: #fff;
  background: #99A6BD;
}

@media only screen and (max-width: 767px){
  .pager .pagination li{
    display: none;
  }

  .pager .pagination li.pre,
  .pager .pagination li.next{
    display: inline-block;
    width: 40%;
    height: 50px;
    text-align: center;
  }

  .pager .pagination li.pre a,
  .pager .pagination li.next a{
    width: 100%;
    text-align: center;
  }

  .pager .pagination li.pre span::after{
    content: "　前の10件へ";
  }

  .pager .pagination li.next span::before{
    content: "次の10件へ　";
  }

}

.archive_title_point {
  position: absolute;
  top: -68px;
  left:0px;
}

.archive_title_point_img {
  width: 80px;
}

.archive_title_point_title {
  font-weight: 500;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  color: #796C45!important;
  font-size: 20px;
  padding: 16px;
}

/*
-------------------------------------------------------------------------------

under 1230px

-------------------------------------------------------------------------------
*/
@media screen and (max-width: 1230px) {
.archive_title_step {
    width: 96px;
    position: absolute;
    top: -65px;
    left: 50px;
}
}

/*
-------------------------------------------------------------------------------

under 768px

-------------------------------------------------------------------------------
*/
@media screen and (max-width: 768px) {
  
  .top_head {
    padding: 0 15px;
    height: 66px;
}
  .top_head_right_cont {
    width: 100px;
}
  .top_head_left_cont {
    width: 100px;
}
  .top_head_center_cont {
    width: 72px;
}
    .nav_head{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,0.9);
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    /* 初期：非表示 */
    visibility: hidden;
    opacity: 0;
    /* ふわっと表示 */
    transition: 0.5s ease-in-out;
}
/* ナビゲーションボタン（開く） */
#navbtn{
  display: block;
  position: absolute;
  top: 24px;
  right: 15px;
  padding: 0;
  outline: none;
  border: none;
  background: none;
  width: 30px;
  height: 20px;
  cursor: pointer;
}

#navbtn::before,
#navbtn::after{
  content : '';
  display: block;
  height: 1px;
  background-color: #333333;
  transform: translateY(4px);
  transition: 0.3s ease-in-out;
}

#navbtn::before{
  transform: translateY(-15px);
  box-shadow: 0 10px #333333;
}

/* ナビゲーションボタン（閉じる） */
.open #navbtn{
  z-index: 100;
}
.open #navbtn::before{
  transform: rotate(-45deg);
  box-shadow: none;
}
.open #navbtn::after{
  transform: rotate(45deg);
  box-shadow: none;
}
/* ナビゲーションメニュー 開いた時*/
.open .nav{
  visibility: visible;
  opacity: 1;
}
  
  .wrap_cont_flex {
    display: block;
}
  
  .wrap_cont_flex_box {
    width: 100%;
    position: relative;
    margin-bottom: 40px;
}
  
  .wrap_cont_sub_flex {
    background: #F7F8FA;
    padding: 32px 24px;
    display: block;
}
  
  .wrap_cont_sub_flex_left {
    width: 100%;
}
  .wrap_cont_sub_flex_right {
    margin-top: 40px;
    margin: 0 auto;
        width: 100%;
    padding-bottom: 24px;
}
  
  .big_b {
    width: 90%;
    line-height: 56px;
}
  
  .footer_nav_flex {
   display: block;
    width: 100%;
} 
  
  header {
    border-bottom: 0px;
  }
  
  .header_container {
    border-bottom: 0px;
}
  
  .reason_num01 {
  position: absolute;
  top: -30px;
    left: -10px;
    width: 64px;
    height: auto;
}

.reason_num02 {
  position: absolute;
  top: -30px;
    left: -10px;
    width: 64px;
    height: auto;
}

.reason_num03 {
  position: absolute;
  top: -30px;
    left: -10px;
    width: 64px;
    height: auto;
}

.reason_img_adjust{
  text-align: center;
  margin-top: 48px;
}

.reason_img_adjust img{
  width: 90%;
}
  
  
  .last td:last-child {
    border-bottom: solid 1px #ccc;
    width: 100%;
  }
  .tbl-r02 {
    width: 100%;
  }
  .tbl-r02 th,
  .tbl-r02 td {
　　border-bottom: none;
    display: block;
    width: 100%;
  }
  
  .heading03 {
    font-size: 30px;
    padding-bottom: 32px;
}
  
  .page_v {
    width: 95%;
    height: 300px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
  
  .wrap_container {
    padding: 80px 15px;
}
  
  .page_link_flex {
    display: block;
    border-bottom: 1px solid #E0E0E0;
}
  .page_link_flex li {
    width: 100%;
    border-top: 1px solid #E0E0E0;
    border-right: 0px;
    text-align: left;
    margin: 0 auto;
    padding: 16px 0;
    display: flex;
    height: 80px;
    align-items: center;
}
  
  .wo_set {
    position: absolute;
    width: 180px;
    top: 2%;
    left: -7%;
}
  
  .pro_logo {
    width: 144px;
    padding-bottom: 12px;
    }
    
    .heading01_w {
    font-size: 24px;
    padding-bottom: 40px;
}

  .pro_catch {
    font-size: 20px;
}
  
  .wrap_container_wht {
    padding: 80px 15px;
}
  
  .page_wrap_cont_flex {
    display: block;
    border-radius: 20px 0 20px 0;
}
  .page_wrap_cont_parts {
    width: 100%;
}
  
  .wrap_container_gry {
    padding: 80px 15px;
}
  
  .storong_txt {
    font-size: 22px;
}
  
  .wrap_cont_parts_step {
    width: 100%;
    margin-bottom: 48px;
}
  .wrap_cont_parts_step:last-child {
    margin-bottom: 0px;
}
  .wrap_cont_parts_step .bg_wht {
    border-radius: 20px 0 20px 0;
}
  .wo_set2 {
    position: absolute;
    width: 180px;
    top: -2%;
    left: 75%;
}

  .heading01_bwn {
    font-size: 24px;
    padding-bottom: 40px;
}
  
  .wid100_sp {
    width: 100%;
  }
  
  
/** 続きを読むボタン */
.readmore {
  position: relative;
  box-sizing: border-box;
}
.readmore-content {
  position: relative;
  overflow: hidden;
  font-size: 16px;
  /*以下お好み*/
  /*高さの初期値*/
  height: 200px;
}
  
  .rc_350 {
    height: 350px;
  }
.readmore-content p {
  padding-top: 16px;
}
.readmore-content::before {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  content: "";
  /*以下お好み グラデーションの色と高さ 高さはreadmoreのheight以下にすること*/
  height: 40px;
  background: linear-gradient(rgba(255,255,255,0) 0, #f7f9fa 100%);
}
 .read-cont_wht::before {
  /*以下お好み グラデーションの色と高さ 高さはreadmoreのheight以下にすること*/
  height: 70px;
  background: linear-gradient(rgba(255,255,255,0.1) 0%, #fff 100%);
} 
    .read-cont_wht_strong::before {  /*以下お好み グラデーションの色と高さ 高さはreadmoreのheight以下にすること*/
  height: 190px;
  background: linear-gradient(rgba(255,255,255,0.1) 0%, #fff 50%, #fff 100%);
} 

  .p_b_25_sp {
    padding-bottom: 200px;
  }
  
.readmore-label {
  display: table;
  bottom: -35px;
  position: absolute;
  font-size: 16px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  margin: 0 auto;
  z-index: 2;
  border-radius: 8px;
  text-decoration: underline;
}
.readmore-label::before {
  content: "SHOW MORE";
}
.readmore-check:checked ~ .readmore-label::before {
  content: "CLOSE";
}
.readmore-check {
  display: none;
}
/*チェック時にボタンを非表示*/
.readmore-check:checked ~ .readmore-label {
  position: static;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  /* 「続きを読む」を押した後、元に戻す必要がない場合は、上のオプションを消してこの1行だけにする */
  /* display: none; */
}
/*チェック時に高さを自動に戻す*/
.readmore-check:checked ~ .readmore-content {
  height: auto;
  padding-bottom: 16px;
  
}
/*チェック時グラデーション等を削除*/
.readmore-check:checked ~ .readmore-content::before {
  display: none;
}

.mj-showMoreBtn {
  font-family: "adobe-garamond-pro", serif;
  font-size: 12px;
  padding: 4px 16px;
  color: #00205B;
  border: 1px solid #00205B;
    cursor: pointer;
    position: absolute;
    left: 50%;
    bottom: 50px;
    transform: translateX(-50%);
    font-size: 16px;
    border-radius: 30px;
  z-index: 5;
}
.bg_wht_allow:after {
    left: 45%;
}
  
  .tab_item {
    width: 50%;
  }
    .tab_item span {
    display: block;
    font-size: 10px;
  font-family: "adobe-garamond-pro", serif;
    padding: 0px;
}
  .search_cont_parts {
    width: 100%;
    padding-bottom: 16px;
}
  
    .search_cont_parts:last-child {
    padding-bottom: 0;
}
  
  .checkbox {
    display: block;
    border: none;
}
  
  .checkbox label {
    margin-top: 8px;
}
  
  .jp_search {
     position: static; 
    width: 100%;
    display: block;
    padding-bottom: 16px;
}
  .tab_content {
    border-top: 3px solid #00205B;
    display: none;
    padding: 40px 0;
    clear: both;
    overflow: hidden;
     position: static; 
}
  
  .jp_search li {
    margin-top: 6px;
}
  .bg_jp {
    background-image: none
}
  
  .wrap_cont_middle_fm {
    padding: 80px 15px;
}
  .search_result {
    padding: 0px 0 8px 8px;
    margin-bottom: 40px;
}
  
  .middle_cont_flex li {
    width: 100%;
}
.wrap_cont_flex_box_tenpo {
    width: 100%;
    position: relative;
  padding-bottom: 32px;
}
.tenpo_details {
    padding-left: 0em;
}
  
  .tenpo_details div {
    padding-left: 24px;
    padding-bottom: 16px;
    margin: 16px 0 16px 0px;
    border-bottom: 1px solid #E0E0E0;
}
  
  .tenpo_details div:first-of-type {
    margin: 0px 0 16px 0px;
}
  .btn_b_wrap {
    width: 100%;
}
  .cv_btn {
    padding: 0px 0  16px 0;
}
  .document_middle_flex_parts {
    width: 100%;
}
  .document_small_flex_parts {
    width: 55%;
    margin: 0 auto;
}
  
  .grad_blue:after {
    left: 47%;
}
  
  
  .m_t-100 {
    margin-top: 16px;
  }
  
  .pro_catch_big {
    font-size: 24px;
    padding-top: 16px;
    letter-spacing: 6.0px;
}
  .n_parts_flex {
    display: block;
    align-items: center;
    padding: 20px 32px 20px 0;
}
  .footer_nav {
    display: block;
    flex-wrap: wrap;
    padding: 24px 0 12px;
}
  
  .advice_wrap {
    background: #F7F8FA;
    padding: 32px 24px;
    margin-top: 32px;
    border-radius: 20px 0 20px 0;
}
.footer_nav_pro_parts {
    width: 100%;
    padding-right: 8px;
  padding-top: 8px;
    padding-bottom: 12px;
}
  .footer_nav_pro_flex {
    display: block;
}
  
  .accordion_footer {
}

.option_footer {
position: relative;
}
.title_footer,
.content_footer {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
transition: all 0.3s;
}
.title_footer {
    padding-bottom: 20px;
    padding-top: 24px;
display: block;
color: #333;
font-weight: bold;
}
.title_footer::after,
.title_footer::before {
content: "";
position: absolute;
right: 1.25em;
top: 1.5em;
width: 2px;
height: 0.75em;
background-color: #999;
transition: all 0.3s;
}
.title_footer::after {
transform: rotate(90deg);
}
.content_footer {
max-height: 0;
overflow: hidden;
}
.toggle_footer:checked + .title_footer + .content_footer {
max-height: 10000px;
transition: all 1.5s;
}
.toggle_footer:checked + .title_footer::before {
transform: rotate(90deg) !important;
}
  
  .footer_nav_pro_cont {
    padding: 0;
    border-top: 1px solid #909294;
    border-bottom: 1px solid #909294;
}
  .footer_nav li {
    padding-right: 24px;
    padding-bottom: 20px;
    padding-top: 24px;
}
  
  .ft_nav_sp li a{
    display: inline-block;
    width: 100%;
  }
  .ft_nav_sp li {
    display: inline-block;
    width: 100%;
    border-top: 1px solid #909294;
  }
  
  .archives_link_flex li {
    padding: 0px 8px;
    margin: 0 8px 12px;
}
  
  .archives_link_flex li a {
    padding: 0 22px 0 8px;
    line-height: 2.3;
    font-size: 12px;
}
  
  .archives_link_flex li::after {
    width: 4px;
    height: 4px;
    top: 45%;
    right: 20px;
}
  .archive_title_step {
    width: 64px;
    position: absolute;
    top: -35px;
    left: 20px;
}
  
  .archive_flex_left {
    width: 100%;
    padding: 40px 24px 24px;
}
  
  .archive_flex_right {
    width: 100%;
    height: 212px;
}
  
  .bg_otosu {
    border-radius: 20px 0px 0px 0px;
}
.bg_archive_title_01 {
    border-radius: 20px 0px 20px 0px;
    margin-bottom: 48px;
}
  
.archive_card_flex li {
    width: 48%;
    margin-top: 48px;
}
  
  .bg_ataeru {
    border-radius: 20px 0px 0px 0px;
}
  
    .bg_mamoru {
    border-radius: 20px 0px 0px 0px;
}
  
  .archive_enter {
    font-size: 16px;
    text-decoration: underline;
    text-align: center;
    display: block;
    padding-top: 32px;
}
  
  .single_cont_flex_left {
    width: 100%;
    padding: 0 24px;
}
  
  .single_cont_flex_right {
    width: 100%;
    padding-top: 48px;
}
  .bg_single_sld {
    background-size: 95% 25%;
    background-position: left 0 top 320px;
    width: 100%;
}
  

  
  .media_archive_wrap li {
    width: 50%;
    border-bottom: 1px solid #E0E0E0;
    margin: 0 0 20px;
}
  .media_archive_wrap li:nth-of-type(2n) a {
  border-right: 0px;
}

.media_archive_wrap li:nth-child(n+3) {
  border-bottom: 0px;
}
.archive_year li {
    display: inline-block;
    width: 30%;
}
  .archive_year {
    justify-content: space-between;
}
  
  .media_single_flex {
    display: block;
}
.media_single_flex li {
    width: 80%;
    padding: 24px;
    margin: 0 auto;
    aspect-ratio: 8/10;
}
  
  .media_single_flex_btn {
    display: block;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}
  .media_single_flex_btn li {
    width: 100%;
}
  
  .heading05 {
    font-size: 20px;
}

  .award_flex_parts{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 990px;
  width: 100%;
}

.award_flex_parts li{
    width: 48%;
    margin-bottom: 24px;
    aspect-ratio: 9/10;
}
  
  .heading01 {
    font-size: 28px;
}
  
  
  .footer_last li{
    padding: 4px 0;
  }
  
  
  
  .pro_title_sub {
    font-size: 12px;
    margin-top: 8px;
}
  
  .pro_title_sub_bwn {
    font-size: 12px;
    margin-top: 8px;
}
  .grad_blue {
  background-size: 150% 150%;/*サイズを大きくひきのばす*/
  animation: bggradient 4s ease infinite;
  position: relative;
}
  .bg_for-first {
    background-image: url(../img/page_v_sp.jpg);
}
  
  .bg_product {
    background-image: url("../img/archives_title_sp.png");
}

  .checkbox label {
    font-size: 14px;
}

  
}