@charset "UTF-8";
@import url("//fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap");
@import url("//fonts.googleapis.com/css2?family=M+PLUS+1p:wght@500;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600&display=swap");
@import url("//code.ionicframework.com/ionicons/2.0.0/css/ionicons.min.css");
@import url("//use.fontawesome.com/releases/v5.0.6/css/all.css");
@import url("//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick.css");
@import url("//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick-theme.css");
@import url("//cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.min.css");
/*-----------------------------------
------------------------------------*/
.pcDISP {
  display: initial;
}

.spDISP {
  display: none !important;
}

.mgnT50 {
  margin-top: 50px !important;
}

a {
  color: #e60012;
  text-decoration: none;
  transition: 0.3s ease-in-out;
}

a:hover {
  opacity: 0.4;
  text-decoration: none;
}

.fade-here,
.fade-scale,
.fade-up,
.fade-down,
.fade-from-left,
.fade-from-right {
  transition: 0.5s ease-in-out;
}

html {
  /*font-size: 62.5%;*/
  overflow-y: auto;
}

body {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  background: #001a4d;
  background: url(/img/special/bluelock/2023/bg.jpg) repeat-y top center;
  background-size: 100% auto;
}

.CLM__half, .CLM__three, .CLM__four {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: -ms- left;
  justify-content: -webkit- left;
  justify-content: left;
  align-items: -ms- top;
  align-items: -webkit- top;
  align-items: top;
}
.CLM__half img, .CLM__three img, .CLM__four img {
  width: 100%;
}
.CLM__half .wide100, .CLM__three .wide100, .CLM__four .wide100 {
  width: 100% !important;
}
.CLM__half > li, .CLM__half > article, .CLM__half > figure {
  width: 48%;
  margin-right: 4%;
}
.CLM__half > li:nth-child(2n), .CLM__half > article:nth-child(2n), .CLM__half > figure:nth-child(2n) {
  margin-right: 0;
}
.CLM__three > li, .CLM__three > article, .CLM__three > figure, .CLM__three > div {
  width: 32%;
  margin-right: 2%;
}
.CLM__three > li:nth-child(3n), .CLM__three > article:nth-child(3n), .CLM__three > figure:nth-child(3n), .CLM__three > div:nth-child(3n) {
  margin-right: 0;
}
.CLM__four > li, .CLM__four > article {
  width: 23.5%;
  margin-right: 2%;
}
.CLM__four > li:nth-child(4n), .CLM__four > article:nth-child(4n) {
  margin-right: 0;
}

.nowrapCLM {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-wrap: nowrap;
  justify-content: -ms- space-between;
  justify-content: -webkit- space-between;
  justify-content: space-between;
  align-items: -ms- top;
  align-items: -webkit- top;
  align-items: top;
}
.nowrapCLM > li,
.nowrapCLM > article {
  flex: 1;
  margin-right: 3%;
}
.nowrapCLM > li:last-child,
.nowrapCLM > article:last-child {
  margin-right: 0;
}
.nowrapCLM > li img,
.nowrapCLM > article img {
  width: 100%;
}
.nowrapCLM > li a,
.nowrapCLM > article a {
  display: block;
}

.sec {
  width: 100%;
  text-align: center;
}
.sec__inner980 {
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
  padding: 80px 5vw;
}
.sec__inner1100 {
  width: 100%;
  min-width: 980px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 5vw;
}
.sec__inner1200 {
  width: 100%;
  min-width: 980px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 5vw;
}
.sec__innerWide {
  width: 100%;
  min-width: 980px;
  max-width: 1500px;
  margin: 0 auto;
  padding: 80px 5vw;
  box-sizing: border-box;
}

/* ==========================================================================
   header
========================================================================== */
#header {
  display: initial;
}

.menutriggerWrap {
  position: fixed;
  right: 0;
  z-index: 11111111;
  width: 70px;
  height: 70px;
  background: #000;
}

.menu-trigger {
  display: inline-block;
  width: 30px;
  height: 20px;
  position: absolute;
  top: 15px;
  right: 20px;
  z-index: 222222;
  margin-top: 10px;
  cursor: pointer;
  z-index: 1;
}
.menu-trigger:hover {
  opacity: 1;
}
.menu-trigger span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  margin: 0 auto;
  background-color: #fff;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
}
.menu-trigger span:nth-of-type(2) {
  top: 9px;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 0;
}
.menu-trigger.active span {
  background-color: #fff;
}
.menu-trigger.active span:nth-of-type(1) {
  transform: translateY(9px) rotate(-45deg);
}
.menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
  transform: translateY(-9px) rotate(45deg);
}

#navigation {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(0, 0, 0, 0.9);
  z-index: 1000;
  height: 100%;
  overflow-y: auto;
  padding: 60px 0 40px;
  box-sizing: border-box;
  text-align: center;
}
#navigation .navigation_inner {
  width: 980px;
  margin: auto;
  box-sizing: border-box;
}

.bluelockHeader__jLogo {
  position: fixed;
  left: 15px;
  top: 15px;
  z-index: 100000;
}
.bluelockHeader__jLogo a img {
  width: 40px;
}
.bluelockHeader__gnav li {
  padding: 20px;
  border-bottom: 1px solid #fff;
  transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
}
.bluelockHeader__gnav li:hover {
  background: #696969;
}
.bluelockHeader__gnav li a, .bluelockHeader__gnav li span {
  color: #fff;
  font-size: 20px;
  font-size: 2rem;
}
.bluelockHeader__gnav li a:hover, .bluelockHeader__gnav li span:hover {
  opacity: 1;
}
.bluelockHeader__gnav li span {
  pointer-events: none;
  color: #828080;
}
.bluelockHeader__gnav li.nolink:hover {
  background: inherit;
}

/* ==========================================================================
   kv
========================================================================== */
.kvArea .sec__inner980 {
  width: 90%;
  max-width: 1100px;
  padding: 30px 0;
  display: none;
}
.kvArea img {
  width: 100%;
  vertical-align: top;
}
.kvArea__lead {
  text-align: center;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 600;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 2;
}

/* ==========================================================================
   navArea
========================================================================== */
.navArea {
  position: relative;
  background: url(/img/special/bluelock/2023/nav_bg_left.jpg) no-repeat top left #ffffff;
}
.navArea:after {
  position: absolute;
  top: 0;
  right: 0;
  background: url(/img/special/bluelock/2023/nav_bg_left.jpg) no-repeat top right;
  background-size: 500px;
}
.navArea .sec__inner980 {
  padding: 0;
}
.navArea__nav {
  flex-wrap: nowrap;
}
.navArea__nav__list {
  width: calc((100% - 0px) / 3) !important;
  /*border-right: 1px solid #747474;*/
  text-align: center;
  margin-right: 0 !important;
}
.navArea__nav__list a {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 500;
  font-size: clamp(16px, 2vw, 20px);
  text-align: center;
  color: #000000;
  display: block;
  line-height: 1.3;
  box-sizing: border-box;
  padding: 36px 10px;
}
.navArea__nav__list a:hover {
  background: #013f97;
  color: #ffffff;
  opacity: 1;
}
body.top .navArea__nav__list.colabo a {
  background: url(/img/special/bluelock/2023/bg.jpg) repeat-y top center;
  color: #ffffff;
  opacity: 1;
}
body.kokuritsu .navArea__nav__list.scolabo a {
  background: url(/img/special/bluelock/2023/bg.jpg) repeat-y top center;
  color: #ffffff;
  opacity: 1;
}
body.goods .navArea__nav__list.goodsinfo a {
  background: url(/img/special/bluelock/2023/bg.jpg) repeat-y top center;
  color: #ffffff;
  opacity: 1;
}
.navArea__nav__list p {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 500;
  font-size: clamp(16px, 2vw, 20px);
  text-align: center;
  color: #999999;
  display: block;
  line-height: 1.3;
  box-sizing: border-box;
  padding: 27px 10px;
}
.navArea__nav__list p span {
  display: block;
  font-size: clamp(10px, 1.4vw, 14px);
}

/* ==========================================================================
   titleArea
========================================================================== */
.schedule h2, .charactor h2 {
  display: block;
  font-family: "M PLUS 1p", sans-serif;
  font-size: clamp(24px, 3.6vw, 36px);
  color: #ffffff;
  margin: 0px auto 50px auto;
}

.kokuritus_info h2 {
  display: block;
  font-family: "M PLUS 1p", sans-serif;
  font-size: clamp(24px, 3.6vw, 36px);
  color: #ffffff;
  margin: 0px auto 50px auto;
  line-height: 1.5;
  text-align: center;
}
.kokuritus_info h2 span {
  display: block;
  font-size: clamp(18px, 2.4vw, 24px);
}

.goods_info h2 {
  display: block;
  font-family: "M PLUS 1p", sans-serif;
  font-size: clamp(24px, 3.6vw, 36px);
  color: #ffffff;
  margin: 0px auto 50px auto;
  line-height: 1.5;
  text-align: center;
}
.goods_info h2 span {
  display: block;
  font-size: clamp(18px, 2.4vw, 24px);
}

/* ==========================================================================
   COMMENT
========================================================================== */
.comment {
  display: block;
  margin: 120px auto 100px auto;
  width: 100%;
  max-width: 1000px;
  text-align: center;
  color: #ffffff;
}
.comment p {
  font-size: clamp(14px, 1.8vw, 18px);
  line-height: 2.5;
  font-weight: 400;
}
.comment .single_img {
  display: block;
  margin: 30px auto 0px auto;
  width: 100%;
  max-width: 760px;
}
.comment .single_img img {
  width: 100%;
}
.comment .single_img p {
  text-align: right;
  margin: 0px;
}
.comment .catch {
  display: block;
  padding: 20px;
  max-width: 940px;
  background: rgba(255, 255, 255, 0.1);
  font-size: clamp(24px, 3vw, 30px);
  line-height: 1.5;
  font-weight: 700;
  margin: 30px auto 30px auto;
}
.comment .catch span {
  display: block;
  font-family: "Oswald", sans-serif;
  font-size: clamp(30px, 4.2vw, 42px);
}
.comment .youtube {
  width: 100%;
  max-width: 760px;
  aspect-ratio: 16/9;
  margin: 30px auto 0px auto;
}
.comment .youtube iframe {
  width: 100%;
  height: 100%;
}

/* ==========================================================================
   CHARACTOR
========================================================================== */
.charactor {
  display: block;
  margin: auto;
  padding: 200px 0px 200px 0px;
  width: 100%;
  text-align: center;
  background: url(/img/special/bluelock/2023/bg_navy.jpg) repeat-y top center;
  background-size: 100% auto;
  clip-path: polygon(0 100px, 100% 0, 100% calc(100% - 100px), 0 100%);
}
.charactor.bibs {
  background: none;
}
.charactor .single_img {
  display: block;
  margin: 30px auto 0px auto;
  width: 100%;
  max-width: 1000px;
}
.charactor .single_img img {
  width: 100%;
  margin: 30px auto 0px auto;
}
.charactor .single_img.alignR {
  text-align: right;
}
.charactor ul {
  display: block;
  max-width: 1050px;
  margin: auto;
  padding: 0px;
  list-style: none;
}
.charactor ul:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0px;
  font-size: 0em;
  line-height: 0;
  clear: both;
}
.charactor ul li {
  display: block;
  float: left;
  width: 33.333%;
  margin: 0px;
  padding: 0px;
}
.charactor ul li img {
  width: 100%;
}
.charactor .btn {
  display: block;
  width: 300px;
  margin: 50px auto 10px auto;
  background-color: #e60012;
  border-radius: 5px;
  border: 2px solid #ffffff;
  color: #ffffff;
  text-align: center;
  padding: 20px 0px 20px 0px;
  transition: 0.3s ease-in-out;
  font-weight: 500;
  font-size: clamp(12px, 1.6vw, 16px);
}
.charactor .btn:hover {
  background-color: #e40000;
  text-decoration: none;
}
.charactor .btn_back {
  position: relative;
  display: inline-block;
  width: 200px;
  background-color: #e60012;
  text-align: center;
  color: #ffffff;
  font-size: 10px;
  font-size: 1rem;
  font-weight: 500;
  line-height: 40px;
  margin: auto;
}
.charactor .btn_back:after {
  position: absolute;
  font-family: "ionicons";
  content: "\f30f";
  right: 7%;
  color: #fff;
  transition: 0.5s all;
  -moz-transition: 0.5s all;
  -webkit-transition: 0.5s all;
  transform: rotate(270deg);
}
.charactor .btn_back:hover {
  background-color: #e40000;
  opacity: 0.8;
}

/* ==========================================================================
   SCHEDULE
========================================================================== */
.schedule {
  display: block;
  margin: 100px auto 170px auto;
  width: 100%;
  max-width: 1000px;
  text-align: center;
  color: #ffffff;
}
.schedule p {
  font-size: clamp(14px, 1.8vw, 18px);
  line-height: 2.5;
  font-weight: 400;
}
.schedule ul {
  display: block;
  max-width: 800px;
  margin: auto;
  padding: 0px;
  list-style: none;
  background: rgba(255, 255, 255, 0.1);
  margin: 30px auto 30px auto;
}
.schedule ul li {
  display: table;
  width: 100%;
  margin: 0px;
  padding: 0px;
  text-align: left;
  border-bottom: 1px solid #000000;
}
.schedule ul li.sapporo {
  border-left: 5px solid #911c15;
}
.schedule ul li.kashima {
  border-left: 5px solid #971631;
}
.schedule ul li.urawa {
  border-left: 5px solid #8b1212;
}
.schedule ul li.kashiwa {
  border-left: 5px solid #9c971e;
}
.schedule ul li.tokyo {
  border-left: 5px solid #101490;
}
.schedule ul li.kawasaki {
  border-left: 5px solid #218db0;
}
.schedule ul li.yokohama_m {
  border-left: 5px solid #193396;
}
.schedule ul li.yokohama_fc {
  border-left: 5px solid #207ea0;
}
.schedule ul li.shonan {
  border-left: 5px solid #588e1f;
}
.schedule ul li.niigata {
  border-left: 5px solid #a7521c;
}
.schedule ul li.nagoya {
  border-left: 5px solid #942517;
}
.schedule ul li.kyoto {
  border-left: 5px solid #731c8f;
}
.schedule ul li.gosaka {
  border-left: 5px solid #24278f;
}
.schedule ul li.cosaka {
  border-left: 5px solid #8f1c55;
}
.schedule ul li.kobe {
  border-left: 5px solid #701e1e;
}
.schedule ul li.hiroshima {
  border-left: 5px solid #541c91;
}
.schedule ul li.fukuoka {
  border-left: 5px solid #1c1f78;
}
.schedule ul li.tosu {
  border-left: 5px solid #3798a5;
}
.schedule ul li:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0px;
  font-size: 0em;
  line-height: 0;
  clear: both;
}
.schedule ul li a {
  color: #fff;
  text-decoration: underline;
}
.schedule ul li .team {
  display: table-cell;
  vertical-align: middle;
  font-size: clamp(14px, 1.8vw, 18px);
  line-height: 2.5;
  font-weight: 400;
  padding: 20px 20px 20px 50px;
  width: 35%;
}
.schedule ul li .date {
  display: table-cell;
  vertical-align: middle;
  width: 65%;
  font-size: clamp(14px, 1.8vw, 18px);
  line-height: 2.5;
  font-weight: 400;
  padding: 20px;
  font-family: "Oswald", sans-serif;
}
.schedule ul li .date span {
  display: block;
  font-family: "Oswald", sans-serif;
  font-size: clamp(30px, 4.2vw, 42px);
}

/* ==========================================================================
   KOKURITSU
========================================================================== */
.kokuritus_info {
  display: block;
  margin: 100px auto 170px auto;
  width: 100%;
  max-width: 1000px;
  color: #ffffff;
}
.kokuritus_info .single_img {
  display: block;
  margin: 30px auto 0px auto;
  width: 100%;
  max-width: 1000px;
}
.kokuritus_info .single_img img {
  width: 100%;
}
.kokuritus_info .single_img p {
  text-align: right;
  margin: 0px;
}
.kokuritus_info h3 {
  font-size: clamp(20px, 3vw, 30px);
  line-height: 1.5;
  font-weight: 600;
  margin: 50px 0px 0px 0px;
  padding: 40px 20px 40px 20px;
  background: rgba(0, 0, 0, 0.4);
  text-align: center;
}
.kokuritus_info h4 {
  font-size: clamp(14px, 1.8vw, 18px);
  line-height: 1.5;
  font-weight: 400;
  margin: 50px 0px 0px 0px;
  background: rgba(255, 255, 255, 0.2);
  padding: 10px 20px 10px 20px;
}
.kokuritus_info h5 {
  display: inline-block;
  font-size: clamp(12px, 1.6vw, 16px);
  line-height: 1.8;
  font-weight: 600;
  margin: 30px 0px -20px 0px;
  color: #000000;
  background-color: #ffffff;
  padding: 5px 20px 5px 20px;
}
.kokuritus_info p {
  font-size: clamp(12px, 1.6vw, 16px);
  line-height: 1.8;
  font-weight: 400;
  margin: 30px 0px 0px 0px;
}
.kokuritus_info p a {
  color: #ffffff;
  text-decoration: none;
}
.kokuritus_info p a:hover {
  text-decoration: underline;
}
.kokuritus_info p.indent0-5 {
  text-indent: -0.5em;
  padding-left: 0.5em;
}
.kokuritus_info p.indent2-5 {
  text-indent: -2.5em;
  padding-left: 2.5em;
}
.kokuritus_info .btn {
  display: block;
  width: 300px;
  margin: 20px 0px 10px 0px;
  background-color: #e60012;
  border-radius: 5px;
  border: 2px solid #ffffff;
  color: #ffffff;
  text-align: center;
  padding: 10px 0px 10px 0px;
  transition: 0.3s ease-in-out;
  font-weight: 500;
}
.kokuritus_info .btn:hover {
  background-color: #e40000;
  text-decoration: none;
}
.kokuritus_info .btn.mgnC {
  margin: 20px auto 10px auto;
}
.kokuritus_info ul.column_2 {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 30px 0px 0px 0px;
}
.kokuritus_info ul.column_2 li {
  display: block;
  width: 48%;
  margin: 0px 4% 0px 0px;
  padding: 0px;
  float: left;
  background: rgba(255, 255, 255, 0.1);
}
.kokuritus_info ul.column_2 li:last-child {
  margin: 0px 0% 0px 0px;
}
.kokuritus_info ul.column_2 li :after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0px;
  font-size: 0em;
  line-height: 0;
  clear: both;
}
.kokuritus_info ul.column_2 li img {
  width: 100%;
}
.kokuritus_info ul.column_2 li p {
  display: block;
  vertical-align: middle;
  font-size: clamp(14px, 1.6vw, 16px);
  line-height: 1;
  font-weight: 400;
  padding: 10px;
  margin: 0px;
}
.kokuritus_info table {
  border-collapse: collapse;
  width: 100%;
  margin: 50px 0px 0px 0px;
  background: rgba(0, 0, 0, 0.2);
}
.kokuritus_info table th, .kokuritus_info table td {
  border: solid 1px #ffffff;
  padding: 2%;
  font-size: clamp(12px, 1.6vw, 16px);
  line-height: 1.5;
  font-weight: 400;
  vertical-align: middle;
  text-align: center;
}
.kokuritus_info table th {
  width: 25%;
  background: rgba(0, 0, 0, 0.2);
  text-align: left;
}
.kokuritus_info table.alignC th {
  text-align: center;
}
.kokuritus_info .youtube {
  width: 100%;
  /*max-width: 600px;*/
  aspect-ratio: 16/9;
  margin: 30px auto 0px auto;
}
.kokuritus_info .youtube iframe {
  width: 100%;
  height: 100%;
}

/* ==========================================================================
   GOODS
========================================================================== */
.goods_info {
  display: block;
  margin: 100px auto 170px auto;
  width: 100%;
  max-width: 1000px;
  color: #ffffff;
}
.goods_info .single_img {
  display: block;
  margin: 30px auto 0px auto;
  width: 100%;
  max-width: 800px;
}
.goods_info .single_img img {
  width: 100%;
}
.goods_info .single_img p {
  text-align: right;
  margin: 0px;
}
.goods_info h3 {
  font-size: clamp(20px, 3vw, 30px);
  line-height: 1.5;
  font-weight: 600;
  margin: 50px 0px 0px 0px;
  padding: 40px 20px 40px 20px;
  background: rgba(0, 0, 0, 0.4);
  text-align: center;
}
.goods_info h4 {
  font-size: clamp(14px, 1.8vw, 18px);
  line-height: 1.5;
  font-weight: 400;
  margin: 50px 0px 0px 0px;
  background: rgba(255, 255, 255, 0.2);
  padding: 10px 20px 10px 20px;
}
.goods_info h5 {
  display: inline-block;
  font-size: clamp(12px, 1.6vw, 16px);
  line-height: 1.8;
  font-weight: 600;
  margin: 30px 0px -20px 0px;
  color: #000000;
  background-color: #ffffff;
  padding: 5px 20px 5px 20px;
}
.goods_info p {
  font-size: clamp(12px, 1.6vw, 16px);
  line-height: 1.8;
  font-weight: 400;
  margin: 30px 0px 0px 0px;
}
.goods_info p a {
  color: #ffffff;
  text-decoration: none;
}
.goods_info p a:hover {
  text-decoration: underline;
}
.goods_info p.indent0-5 {
  text-indent: -0.5em;
  padding-left: 0.5em;
}
.goods_info p.indent2-5 {
  text-indent: -2.5em;
  padding-left: 2.5em;
}
.goods_info .btn {
  display: block;
  width: 300px;
  margin: 20px auto 10px auto;
  background-color: #e60012;
  border-radius: 5px;
  border: 2px solid #ffffff;
  color: #ffffff;
  text-align: center;
  padding: 20px 0px 20px 0px;
  transition: 0.3s ease-in-out;
  font-weight: 500;
  font-size: clamp(12px, 1.6vw, 16px);
}
.goods_info .btn:hover {
  background-color: #e40000;
  text-decoration: none;
}
.goods_info .menu {
  display: flex;
  padding: 0;
  margin: 0px 0px 0px 0px;
  list-style: none;
  flex-wrap: wrap;
}
.goods_info .menu li {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  margin: 0px 1% 1% 0px;
  width: 19%;
  background: rgba(255, 255, 255, 0.2);
  text-align: center;
  border-radius: 5px;
}
.goods_info .menu li:nth-child(5n) {
  margin: 0px 0% 1% 0px;
  width: 20%;
}
.goods_info .menu li a {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100%;
  padding: 10% 3% 10% 3%;
  position: relative;
  font-size: clamp(10px, 1.2vw, 12px);
  line-height: 1.2;
  font-weight: 400;
  color: #ffffff;
  text-decoration: none;
}
.goods_info .menu li a::before {
  content: "";
  width: 7px;
  height: 7px;
  border-top: solid 2px #ffffff;
  border-right: solid 2px #ffffff;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 5px;
  margin: auto;
  transform: rotate(135deg);
}
.goods_info ul.column_2 {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 30px 0px 0px 0px;
}
.goods_info ul.column_2:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0px;
  font-size: 0em;
  line-height: 0;
  clear: both;
}
.goods_info ul.column_2 li {
  display: block;
  width: 48%;
  margin: 0px 4% 0px 0px;
  padding: 0px;
  float: left;
  background: rgba(255, 255, 255, 0.1);
}
.goods_info ul.column_2 li:last-child {
  margin: 0px 0% 0px 0px;
}
.goods_info ul.column_2 li img {
  width: 100%;
}
.goods_info ul.column_2 li p {
  display: block;
  vertical-align: middle;
  font-size: clamp(14px, 1.6vw, 16px);
  line-height: 1;
  font-weight: 400;
  padding: 10px;
  margin: 0px;
}

.p-accordion {
  width: 100%;
  margin-inline: auto;
}

.p-accordion__head {
  cursor: pointer;
  background: rgba(0, 0, 0, 0.5);
  display: block;
  color: #ffffff;
  padding: 20px 20px;
  margin-top: 30px;
  font-size: clamp(14px, 1.6vw, 16px);
  line-height: 1;
  font-weight: 400;
}

.p-accordion__head-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.p-accordion__icon {
  display: block;
  position: relative;
  width: 24px;
  transition: transform 0.25s;
}

.p-accordion__icon:before {
  content: "";
  position: absolute;
  display: block;
  width: 15px;
  height: 2px;
  background-color: #fff;
}

.p-accordion__icon:after {
  content: "";
  position: absolute;
  display: block;
  width: 15px;
  height: 2px;
  background-color: #fff;
}

.p-accordion__icon:before {
  left: 0;
  transform: rotate(45deg);
}

.p-accordion__icon:after {
  right: 0;
  transform: rotate(-45deg);
}

.p-accordion__input input[name=p-accordion__block] {
  display: none;
}

.p-accordion__input .p-accordion__block {
  cursor: pointer;
}

.p-accordion__input .p-accordion__content {
  height: 0;
  padding: 0px;
  overflow: hidden;
  opacity: 0.5;
  transition: padding 0.25s ease, opacity 0.3s ease 0s;
  background: rgba(0, 0, 0, 0.5);
}

.p-accordion__input input[name=p-accordion__block]:checked + .p-accordion__head > .p-accordion__head-inner .p-accordion__icon {
  transform: rotate(-180deg);
}

.p-accordion__input input[name=p-accordion__block]:checked + .p-accordion__head + .p-accordion__content {
  /*開閉時*/
  height: auto;
  opacity: 1;
  padding: 2%;
}

.swiper_container {
  margin-inline: auto;
  max-width: 800px;
  position: relative;
  margin-top: 30px;
}

.swiper {
  max-width: 800px;
}

.swiper-wrapper {
  padding-bottom: 20px;
}

.swiper-slide img {
  height: auto;
  width: 100%;
}

/* 前への矢印 */
.swiper-button-prev {
  left: -30px !important;
}

/* 次への矢印 */
.swiper-button-next {
  right: -30px !important;
}

/* ページネーション */
.swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: 0px !important;
}

.swiper-pagination-bullet {
  background: var(--swiper-pagination-bullet-inactive-color, #fff) !important;
}

.swiper-pagination-bullet-active {
  background: var(--swiper-pagination-color, var(--swiper-theme-color)) !important;
}

/* ============================================
	追従ボタン
============================================ */
.floatingbnr {
  display: block;
  position: fixed;
  z-index: 1000;
  bottom: 60px;
  right: 0;
  width: 350px;
  /*border: 3px solid #ffffff;*/
  background-color: #ffffff;
  padding: 20px 20px 20px 20px;
}

.floatingbnr img {
  display: block;
  margin: 0px auto 10px auto;
}

.floatingbnr a.btn_form {
  position: relative;
  display: block;
  width: 100%;
  background-color: #e60012;
  text-align: center;
  color: #ffffff;
  font-size: 10px;
  font-size: 1rem;
  font-weight: 700;
  line-height: 40px;
  margin: auto;
}

.floatingbnr a.btn_form:after {
  position: absolute;
  font-family: "ionicons";
  content: "\f30f";
  right: 7%;
  color: #fff;
  transition: 0.5s all;
  -moz-transition: 0.5s all;
  -webkit-transition: 0.5s all;
}

.floatingbnr a.btn_form:hover {
  background-color: #e40000;
  opacity: 1;
}

.floatingbnr a.nolink {
  pointer-events: none;
}

.floatingbnr .btn__close {
  display: inline-block;
  width: 30px;
  height: 30px;
  position: absolute;
  right: 0px;
  top: 0px;
  pointer-events: all !important;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 30px;
  color: #000000;
}

.button {
  transition: 0.3s;
  opacity: 0;
  visibility: hidden;
}

/*このクラスが付与されると表示する*/
.active {
  opacity: 1;
  visibility: visible;
}

.margT0 {
  margin-top: 0px;
}

.margT10 {
  margin-top: 10px;
}

.margT20 {
  margin-top: 20px;
}

.margT30 {
  margin-top: 30px;
}

.margT40 {
  margin-top: 40px;
}

.margT50 {
  margin-top: 50px;
}

.margT60 {
  margin-top: 60px;
}

.margT70 {
  margin-top: 70px;
}

.margT80 {
  margin-top: 80px;
}

.margB0 {
  margin-bottom: 0px;
}

.margB10 {
  margin-bottom: 10px;
}

.margB20 {
  margin-bottom: 20px;
}

.margB30 {
  margin-bottom: 30px;
}

.margB40 {
  margin-bottom: 40px;
}

.margB50 {
  margin-bottom: 50px;
}

.margB60 {
  margin-bottom: 60px;
}

.margB70 {
  margin-bottom: 70px;
}

.margB80 {
  margin-bottom: 80px;
}

.pt0 {
  padding-top: 0 !important;
}

.paddT0 {
  padding-top: 0px;
}

.paddT10 {
  padding-top: 10px;
}

.paddT20 {
  padding-top: 20px;
}

.paddT30 {
  padding-top: 30px;
}

.paddT40 {
  padding-top: 40px;
}

.paddT50 {
  padding-top: 50px;
}

.paddT60 {
  padding-top: 60px;
}

.paddT70 {
  padding-top: 70px;
}

.paddT80 {
  padding-top: 80px;
}

.paddB0 {
  padding-bottom: 0px;
}

.paddB10 {
  padding-bottom: 10px;
}

.paddB20 {
  padding-bottom: 20px;
}

.paddB30 {
  padding-bottom: 30px;
}

.paddB40 {
  padding-bottom: 40px;
}

.paddB50 {
  padding-bottom: 50px;
}

.paddB60 {
  padding-bottom: 60px;
}

.paddB70 {
  padding-bottom: 70px;
}

.paddB80 {
  padding-bottom: 80px;
}