@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Libre+Bodoni:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kiwi+Maru:wght@300;400;500&display=swap');



html {
  width: 100%;
  }

body {
  font-size: 14px;
  background-color: #ffffff;
  font-family: 'Noto Serif JP', serif;
  line-height: 1.2em;
}
h1,h2,h3,h4,h5,h6 {
  font-family: 'Libre Bodoni','Noto Serif JP', serif;
}
a {
  color: #0083e8;  
}
p {
  font-size: 14px;
  line-height: 1.8em;
  font-family: 'Noto Serif JP', serif;
}
#contents {
  min-height: 100vh;
}
.responsive-nav a {
  color: #454545!important;
  font-size: 14px!important;
}
#footer {
  margin-top: auto;
  background-color: #1b2538;
}
.footer-widget-area {
  font-size: 12px;
  padding: 0px 0 25px;
}
.copyright {
  background-color: #8e40a1;
  color: #f4f4f4;
  font-size: 12px;
  padding: 15px 0 15px 0;
}
.fa-phone-alt{
  transform: scaleX(-1);
}
.related-posts .entry-meta {
  margin-bottom: 10px;
}
@media screen and (min-width: 740px) {
  footer {
    margin-bottom: 0px;
  }
}
.header {
    z-index: 9999;
    position: fixed;
    width: 100%;
}
.header.change-color {
  opacity: .8;
  transition: 0.3s;
}
.site-branding {
  padding: 10px 0;
}
.header__content {
  height: 55px;
}
.site-branding__heading {
  text-align: left;
}
.site-branding__heading img {
  width: 60px;
  margin-left: 5%;
}
@media screen and (min-width: 740px) {
  .site-branding__heading img {
    width: 100px;
    margin-left: 5%;
  }
}
#container #contents {
    min-height: 100vh;
    margin-top: 0px!important;
}
#commentarea {
  display: none;
}
.entry__content{
  margin: 0 auto;
}
.entry-meta{
  margin-bottom: 100px;
}
.entry-meta__list {
  color: #a9a9a9;
}
.related-posts{
  margin-top: 200px;
}
.entry__title {
  font-size: 20px;
}
.entry__title a {
  color: #121212;
}
.post-175,
.post-173,
.post-177{
  padding-top: 100px;
}
.wp-block-heading{
  margin-top: 50px;
}
@media screen and (min-width: 740px) {
  .entries .entry--has_media__link {
    width: 120px;
    height: 120px;
  }
  .entries .entry--has_media__media {
    width: 160px;
  }
}
#responsive-btn {
  background-color: transparent;
  border-color: transparent!important;
  color: #333!important;
}


:root{
  --textw : #fff ;
  --textb : #080808 ; 
  --backb : #080808 ;
  --purple: #8e40a1;
  --purple2: #9b74a4;
  --purple3: #4d2357;
  --purple4: #f4f0f7;
}
.purple_bc{
  background-color: var(--purple);
}
.purple2_bc{
  background-color: var(--purple2);
}
.purple3_bc{
  background-color: var(--purple3);
}
.purple4_bc{
  background-color: var(--purple4);
}
.purple{
  color: var(--purple);
}
.purple{
  color: var(--purple2);
}
.white{
  color: var(--textw);
}

/*box*/
.mainbox{
  width: 100%;
}
.s-mainbox{
  width: 100%;
  padding-top: 100px;
  padding-bottom: 80px;
}
.subbox{
  width: 100%;
  margin: 0 auto;
  display: block;
}
.backImg{
  background-image: url(https://merfois.xxxotop.cfbx.jp/images/background.jpeg);
}
@media screen and (min-width: 740px) {
  .subbox{
    width: 60%;
  }
}

/* icon */
.icon{
  width: 30%;
  display: flex;
  justify-content: space-between;
  margin: 20px 0 10px 0;
}
.icon a :hover{
  opacity: 0.7;
}
.icon img{
  width: 50px;
  filter: brightness(0) saturate(100%) invert(19%) sepia(2%) saturate(6%) hue-rotate(315deg) brightness(96%) contrast(94%);
}
@media screen and (min-width: 740px) {
  .icon{
    width: 120px;
  }
}

/* top */

.topimg {
  width: 100%;
  padding-top: 50vh;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  animation: img_anime 16s ease infinite;
}
.toptext{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 35%;
  
}

@keyframes img_anime {
  0% {
  background-image: url(https://merfois.xxxotop.cfbx.jp/images/image-002.png); /* 背景画像1を指定 */
  }
  20% {
  background-image: url(https://merfois.xxxotop.cfbx.jp/images/image-002.png); /* 背景画像1を指定 */
      }
  35% {
  background-image: url(https://merfois.xxxotop.cfbx.jp/images/image-003.png); /* 背景画像2を指定 */
      }
  53% {
  background-image: url(https://merfois.xxxotop.cfbx.jp/images/image-003.png); /* 背景画像2を指定 */
      }
  68% {
  background-image: url(https://merfois.xxxotop.cfbx.jp/images/image-005.png); /* 背景画像3を指定 */
      }
  85% {
  background-image: url(https://merfois.xxxotop.cfbx.jp/images/image-005.png); /* 背景画像3を指定 */
      }
  100% {
  background-image: url(https://merfois.xxxotop.cfbx.jp/images/image-002.png); /* 背景画像1を指定 */
      }
  } 

.toptext img{
  width: 30%;
  height: auto;
  filter: drop-shadow(0px 0px 5px #f7f7f7);
}
.toptext h2 {
  width: 100%;
  text-align: center;
  color: var(--textb) ;
  text-shadow: 0px 0px 5px #f7f7f7;
  font-size: 10vw;
  font-weight: normal;
  margin: 10px 0 0 0;
  
}
.topimg h2 span{
  display: none;
}
.tpsf-img{
  width: 35%;
}
.tpsf-tel{
  font-size: 20px;
  color: #333;
}
.tpsf-tel a{
  text-decoration: none;
  color: #333;
}
@media screen and (min-width: 740px) {
  .topimg {
    padding-top: 100vh;
    background-image: url(https://bepco-japan.com/images/kimuchi-wide.png);
  }
  .toptext{
    width: 100%;
    display: flex;
    justify-content: left;
    flex-wrap: nowrap;
    top: 20%;
    transform: translate(10%,50%);
  }
  .toptext img{
    width: 40%;
   }
  .toptext h2 {
    font-size: 6vw;
    width: 50%;
    margin: 0 0 0 0;
  }
}

.TopBox{
  width: 90%;
  position: relative;
  margin: 0 auto;
  padding: 0 0 100px 0;
  display: block;
}

.TopBoxImg{
  width: 100%;
  position: relative;
  overflow: hidden;
  padding-top: 60%;
}
.TopBoxImg img{
  width: 100%;
  height: 100%;
  position: absolute;
  object-fit: cover;
  top: 0;
  object-position: 0 35%;
}
.TopBoxTx{
  width: auto;
  padding: 5px 10px 30px 10px;
  top: 85%;
  display: block;
}
.TopBoxTx h2{
  font-size: 30px;
}
.TopBoxTx p{
  text-align: left;
}
@media screen and (min-width: 740px) {
  .TopBox{
    width: 80%;
  }
  .TopBoxImg{
    width: 60%;
    padding-top: 60%;
  }
  .TopBoxTx{
    width: calc(33.3% + 148px);
    max-width: 500px;
    position: absolute;
    padding: 50px 25px 40px 25px;
    top: 10%;
    right: 0;
  }
  .TopBox2{
    width: 100%;
    display: flex;
    padding: 0 0 0 0;
  }
}


.t-con{
  width: 100%;
  margin:  0 auto;
  padding: 80px 0 80px 0;
}
.title{
  margin: 0 auto;
  font-size: 36px;
  font-weight: 300;
  line-height: 1.0em;
  -moz-user-select: -moz-none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  position: relative;
  margin-bottom: 40px;
  text-align: center;
}
.title h2{
  font-size: 30px;
  letter-spacing: .5px;
}
.title .white{
  color: var(--textw);
}
.title span{
  display: block;
  font-size: 16px;
  margin-top: -8px;
  font-weight: normal;
  letter-spacing: -0.5px;
  font-family: 'Noto Serif JP', serif;
  color: #aaaaaa;
}
.m-title{
  margin-bottom: 20px;
  font-size: 22px;
  line-height: 1.6em;
}
.m-title span{
  margin-top: 0px;
  font-size: 20px;
}
.tiLine {
  position: relative;
  padding: 0 65px;
  text-align: center;
}

.tiLine:before {
  position: absolute;
  top: calc(50% - 1px);
  left: 20%;
  width: 20%;
  height: 2px;
  content: '';
  background: #000;
}
.tiLine::after {
  position: absolute;
  top: calc(50% - 1px);
  left: 60%;
  width: 20%;
  height: 2px;
  content: '';
  background: #000;
}

.tiLine span {
  position: relative;
  padding: 0 1em;
  font-family: 'Noto Serif JP', serif;
}
.conbox{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-inline-start: 0px;
}
.conlist{
  width: 45%;
  list-style: none;
  margin: 5px 5px 15px 5px;
  text-align: center;
}
.conlist a{
  text-decoration: none;
}
.clbox{
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  overflow: hidden;

}
.climg{
  width: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: .3s ease-in-out;
}
.conlist:hover .climg{
  transform: scale(1.2);
  transition-duration: 0.5s;
}

.conlist h3{
  color: var(--textb) ;
  margin: 10px 0 0 0;
  width: 100%;
  font-size: 20px;
}
.conlist h3 span{
  display: block;
  font-size: 12px;
  margin-top: 5px;
  font-weight: normal;
  letter-spacing: -0.5px;
}
.conlist p{
  margin: 2px 0 10px 0;
  color: var(--textb) ;
}
.sub-page-contents {
  padding-top: 90px;
}
@media screen and (min-width: 740px) {
  .t-con{
    padding: 120px 0 120px 0;
  }
  .title h2{
    font-size: 30px;
  }
  .title span{
    font-size: 14px;
  }
  .m-title span{
    margin-top: 0px;
    font-size: 24px;
  }
  .tiLine {
    position: relative;
    padding: 0 65px;
    text-align: center;
  }
  
  .tiLine:before {
    position: absolute;
    top: calc(50% - 1px);
    left: 25%;
    width: 20%;
    height: 2px;
    content: '';
    background: #000;
  }
  .tiLine::after {
    position: absolute;
    top: calc(50% - 1px);
    left: 55%;
    width: 20%;
    height: 2px;
    content: '';
    background: #000;
  }
  
  .tiLine span {
    position: relative;
    padding: 0 1em;
  }
  .conlist{
    width: 18%;
    position: relative;
    list-style: none;
    margin: 5px;
    overflow: hidden;
  }
  .conlist h3{
    font-size: 22px;
    font-family: 'Noto Serif JP', serif;
  }
  .conlist h3 span{
    font-size: 14px;
  }
}



.LRBox{
  width: 90%;
  margin: 0 auto;
  padding: 0 0 50px 0;
  display: block;
}
.LRTop{
  padding-top: 40px;
}
.LRImg{
  width: 100%;
  height: auto;
  aspect-ratio: 5 / 3;
  overflow: hidden;
  }
.LRImg img{
  width: 100%;
  object-fit: cover;
  object-position: 0% 100%;
  
}
.LRTx{
  width: auto;
  padding: 5px 10px 30px 10px;
  top: 85%;
  display: block;
}
@media screen and (min-width: 740px) {
  .LRBox{
    width: 100%;
    display: flex;
    align-items: center;
    padding: 0 0 0 0;
  }
  .LRImg{
    width: 70%;
    }
  .LRTx{
    padding: 5px 10px 30px 30px;
    width: 60%;
  }
  .LRTx .title{
    text-align: left;
  }
  .LRTx .title span{
    padding-left: 10px;
  }
  .LR{
    flex-flow: row-reverse;
}
}

/*
.LRBox{
  width: 100%;
  position: relative;
  margin: 0 auto;
  padding: 0 0 50px 0;
  display: block;
}
.LRImg{
  width: 100%;
  height: auto;
  
  overflow: hidden;
  position: relative;
  }
.LRImg img{
  width: 100%;
  object-fit: cover;
  object-position: 0% 100%;
  aspect-ratio: 5 / 3;
}
.LRTx{
  width: auto;
  padding: 5px 10px 30px 10px;
  top: 85%;
  display: block;
}
@media screen and (min-width: 740px) {
  .LRBox{
    display: flex;
    align-items: center;
    padding: 0 0 0 0;
  }
  .LRImg{
    width: 60%;
    }
  .LRTx{
    padding: 5px 10px 30px 30px;
  }
  .LRTx .title{
    text-align: left;
  }
  .LRTx .title span{
    padding-left: 10px;
  }
  .LR{
    flex-flow: row-reverse;
}
}
*/



/* プロフィール */

.ProCon{
    width: 100%;
    padding: 80px 0 100px 0 ;
}
.pr-flex{
    width: 100%;
    margin: 0 auto 30px auto;
    display: flex;
    flex-wrap: wrap;
}
.pf-img{
  width: 100%;
  margin: 0 auto;
  }
.pf-img img{
    width: 90%;
    margin: 0 auto;
    display: block;
}
.pf-tx1{
    padding: 5px 5px 0 5px;
}
.pf-tx1 p{
    padding: 0 10px 0 10px;
}
.role{
    font-size: 18px;
    padding-bottom: 10px;
    color: #9b74a4;
    font-weight: bold;
    text-align: center;
}
.pf-tx1 h2{
    color: #8e40a1;
    font-size: 30px;
    letter-spacing: 1px;
    margin: 0 0 30px 0;
    text-align: center;
}
.pf-tx1 h2 span{
    display: block;
    font-size: 20px;
    margin-top: 30px;
    font-weight: bold;
    letter-spacing: 2px;
    padding-left: 2px;
    text-align: center;
    color: #9b74a4;
}
.pf-tx1 h3{
    font-size: 16px;
    margin: 10px 0 5px 0;
}
.pr-messBox{
    width: 90%;
    margin: 0 auto;
    background-color: #c5c5c5;
    padding: 30px 30px 30px 30px;
}
.pr-messBox h3{
    color: #b94047;
    font-size: 40px;
    letter-spacing: 1px;
    margin: 0 0 30px 0;
    text-align: center;
}
@media screen and (min-width: 740px) {
    .pr-flex{
        width: 60%;
        margin: 0 auto 30px auto;
        display: flex;
        flex-wrap: nowrap;
    }
    .pf-img{
      width: 20vw;
        height: 20vw;
    }
    .pf-img img{
        width: 20vw;
    }
    .pf-tx1{
        padding: 5px 0 0 20px;
    }
    .pf-tx1 .role{
        font-size: 18px;
        font-weight: bold;
        text-align: left;
        padding-bottom: 12px;
        margin: 0 0 10px 0;
    }
    .pf-tx1 h2{
        font-size: 35px;
        text-align: left;
    }
    .pf-tx1 h2 span{
        font-size: 22px;
        padding-left: 8px;
        text-align: left;
        margin-top: 40px;
    }
    .pr-messBox{
        width: 60%;
    }
}

/* テーブル */
.subptb{
  border-spacing: 0;
  margin: 10px 10px 80px 10px;
  width: 100% ;
}
.subptb th{
  border-bottom: solid 2px #212121;
  padding: 10px 0 10px 5px;
  text-align: left;
  min-width: 50px;
}
.subptb td{
  border-bottom: solid 2px #616161;
  text-align: left;
  padding: 10px 10px;
  margin: 0 5px 0 0;
}
.map {
  width: 100%;
  height: 0;
  padding-top: 60%;
  margin: 60px auto 60px auto;
  position: relative;
}
.map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 740px){
  .subptb{
    width: 60%;
    margin: 0 auto;
  }
  .subptb th{
    min-width: 150px;
    padding: 10px 0 10px 15px;
  }
  .map {
    width: 60%;
    padding-top: 25%;
  }
}


/* 投稿 */
.sub-page-contents {
  padding-top: 90px;
}
.entry__title {
  font-size: 30px;
}
.entry-meta__list .vCard{
  display: none;
}
@media screen and (min-width: 740px) {
}

/*subpage*/
.texbox{
  width: 90%;
  padding: 20px 0px 30px 0px;
  text-align: left;
  display: inline-block;
}
.texbox2{
  width: 100%;
  padding: 20px 0px 30px 0px;
  text-align: center;
  display: block;
  margin: 0 auto;
}
.texbox2 p{
  width: 90%;
  text-align: left;
  margin: 0 auto;
}
.backb{
  background-color: var(--backb) ;
  color: var(--textw) ;
}
.flex{
}
.ceo{
  width: 50%;
}
@media screen and (min-width: 740px) {
  .flex{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
  }
  .texflex{
    width: 50%;
  }
  .texbox2{
    width: 50%;
    padding: 20px 0px 30px 0px;
    text-align: center;
  }
  .texbox2 p{
    text-align: center;
  }
  .ceo{
    width: 40%;
  }
}




/*footer*/
.social {
  position: fixed;
  top: 300px;
  width: 70px;
}
.social ul {
  padding: 0px;
  -webkit-transform: translate(-270px, 0);
  -moz-transform: translate(-270px, 0);
  -ms-transform: translate(-270px, 0);
  -o-transform: translate(-270px, 0);
  transform: translate(-270px, 0);
}
.social ul li {
  display: block;
  margin: 8px;
  background: rgba(0, 0, 0, 0.36);
  width: 300px;
  text-align: right;
  padding: 5px;
  -webkit-border-radius: 0 30px 30px 0;
  -moz-border-radius: 0 30px 30px 0;
  border-radius: 0 30px 30px 0;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -ms-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;
}
.social ul li:hover {
  -webkit-transform: translate(90px, 0);
  -moz-transform: translate(90px, 0);
  -ms-transform: translate(90px, 0);
  -o-transform: translate(90px, 0);
  transform: translate(90px, 0);
  background: rgba(255, 255, 255, 0.4);
}
.social ul li:hover a {
  color: #000;
}
.social ul li:hover i {
  color: #fff;
  background: red;
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  transform: rotate(360deg);
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -ms-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;
}
.social ul li i {
  margin-left: 10px;
  color: #000;
  background: #fff;
  padding: 5px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  font-size: 16px;
  background: #ffffff;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}

@media screen and (min-width: 740px) {
  .social {
      position: fixed;
      top: 300px;
      width: 80px;
  }
  .social ul {
      padding: 0px;
      -webkit-transform: translate(-270px, 0);
      -moz-transform: translate(-270px, 0);
      -ms-transform: translate(-270px, 0);
      -o-transform: translate(-270px, 0);
      transform: translate(-270px, 0);
  }
  .social ul li {
      display: block;
      margin: 10px;
      background: rgba(0, 0, 0, 0.36);
      width: 320px;
      text-align: right;
      padding: 10px;
      -webkit-border-radius: 0 30px 30px 0;
      -moz-border-radius: 0 30px 30px 0;
      border-radius: 0 30px 30px 0;
      -webkit-transition: all 1s;
      -moz-transition: all 1s;
      -ms-transition: all 1s;
      -o-transition: all 1s;
      transition: all 1s;
  }
  .social ul li:hover {
      -webkit-transform: translate(110px, 0);
      -moz-transform: translate(110px, 0);
      -ms-transform: translate(110px, 0);
      -o-transform: translate(110px, 0);
      transform: translate(110px, 0);
      background: rgba(255, 255, 255, 0.4);
  }
  .social ul li:hover a {
      color: #000;
  }
  .social ul li:hover i {
      color: #fff;
      background: red;
      -webkit-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
      -webkit-transition: all 1s;
      -moz-transition: all 1s;
      -ms-transition: all 1s;
      -o-transition: all 1s;
      transition: all 1s;
  }
  .social ul li i {
      margin-left: 10px;
      color: #000;
      background: #fff;
      padding: 10px;
      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      border-radius: 50%;
      width: 40px;
      height: 40px;
      font-size: 20px;
      background: #ffffff;
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
  }
}
.bottom-sticky-nav {
  display: none !important;
  opacity: 1 !important;
}


/*スマホの時*/

@media (max-width: 720px) {
  .bottom-sticky-nav {
      height: 50px;
      position: fixed;
      display: block !important;
      opacity: 1 !important;
      background: var(--purple3);
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 100;
  }
  .bottom-sticky-nav ul {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      justify-content: space-evenly;
  }
  .bottom-sticky-nav ul li {
      flex: 1;
  }
  .bottom-sticky-nav ul li a {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 10px;
      height: 50px;
      color: #fff;
      text-decoration: none;
  }
  .bottom-sticky-nav ul li a:hover,
  .bottom-sticky-nav ul li a:focus {
      text-decoration: none;
      opacity: .5;
  }
  .bottom-sticky-nav ul li a i {
      font-size: 18px;
  }
  .bottom-sticky-nav ul li a span {
      font-size: 10px;
      line-height: 1.2;
  }
  footer {
      margin-bottom: 50px;
  }
}
/*----------------*/
/* news */
/*----------------*/
.news_list {
  margin: 80px auto;
  font-size: 14px;
  word-break: break-all;
  overflow: hidden;
  width: 90%;
  margin-top: 0px;
}
.news_list a {
  padding: 20px 0;
  display: block;
  text-decoration: none;
  box-shadow: none;
}
.news_list a:hover {
  background-color: #dcdcdc;
  text-decoration: none;
  box-shadow: none;
}
.news_list hr {
  margin: 0;
  padding: 0;
  color: #808080;
  height: 0.1px;
}
.news_list .add_New {
  font-size: 74%;
  color: var(--textw) ;
  background-color: #643250;
  border-radius: 3px;
  margin-right: 10px;
  padding: 5px 5px 0px 5px;
  line-height: 1.5;
  white-space: nowrap;
}
.news_list .cat {
  font-size: 74%;
  padding: 1px 5px;
  margin-left: 5px;
  vertical-align: middle;
  color: var(--textw) ;
  background-color: #808080;
  border-radius: 3px;
}
.news_list dl {
  margin: 0 0;
  padding: 0 0;
  border: 0;
}
.news_list .ndate {
  width: 130px;
  margin: 0 0 10px 20px;
  padding: 0;
  border: 0;
  color: #808080;
  font-size: 12px;
  font-weight: bold;
  white-space: nowrap;
}
.news_list .ncat {
  width: 80px;
  margin: 0;
  padding: 0;
  border: 0;
  color: Gray;
  font-weight: normal;
  white-space: nowrap;
}
.news_list .dtit {
  overflow: hidden;
  color: Gray;
  display: flex;
  vertical-align: middle;
  margin-left: 20px;
}
.news_title {
  width: 100%;
  color: #333;
  margin-top: 3px;
  white-space: nowrap;
}
@media screen and (min-width: 740px) {
  .news_list {
    width: 40%;
  }
}














/*----------------*/
/* 商品ページ */
/*----------------*/

.item-header{
  margin: 100px 0 0 0;
}
#img-box{
  width: 100%;
}
.itemimg{
  width: 100%;
}
.itemimg img{
  width: 100%;
}
.detail-box{
  padding: 30px 0 50px 0;
}
.item-info{
  width: 90%;
  margin: 0 auto;
  padding: 0 0 50px 0;
}
.skuform{
  padding: 10px 0 40px 0;
}
.skuname{
  font-size: 26px;
  font-weight: bold;
}
.zaikostatus{
  font-size: 10px;
  font-weight: normal;
}
.field_price{
  font-size: 26px;
  font-weight: bold;
}
.tax{
  font-size: 10px;
  font-weight: normal;
}
.c-box{
  margin: 10px 0 0 0;
}
.sidebar{
  display: none;
}

@media screen and (min-width: 740px) {
  .item_page_title{
    text-align: center;
    font-size: 40px;
    margin: 0 0 30px 0;
  }
  .itmflex{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: top;
    justify-content: center;
  }
  #img-box{
    width: 40%;
  }
  .flexsub{
    width: 30%;
    padding: 0 0 0 20px;
  }
  .detail-box{
    padding: 0px 0 50px 0;
  }
  .ditSub{
    width: 60%;
    padding: 50px 0 0 0;
    margin: 0 auto;
  }
}




/* ボタン */
.button_line001 a {
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  max-width: 200px;
  padding: 10px 25px;
  color: #313131;
  transition: 0.3s ease-in-out;
  font-weight: 600;
  text-decoration: none;
  margin: 50px auto 0 auto;
  font-size: 12px;
  line-height: 8px;
}
.button_line001 a:before {
  position: absolute;
  bottom: 0px;
  left: 50%;
  content: '';
  width: 50%;
  height: 2px;
  background: rgba(0,0,0,.1);
  transform: translateX(-50%);
}
.button_line001 a:after {
  position: absolute;
  bottom: 0px;
  left: 25%;
  content: '';
  width: 50%;
  height: 2px;
  background: #ba55d3;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: transform .3s;
}
.button_line001 a:hover {
  opacity: 0.7;
  color: #ba55d3;
}
.button_line001 a:hover:after {
  transform: scale(1, 1);
}


a.btn_02 {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 120px;
	margin: auto;
	padding: 1rem 4rem;
	font-weight: bold;
	border: 2px solid #27acd9;
	background: #27acd9;
	color: #fff;
	transition: 0.5s;
}
a.btn_02:hover {
	color: #27acd9;
	background: #fff;
}

.button006{
  margin-bottom: 100px;
}
.button006 a {
  background: #eee;
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 10px auto 20px auto;
  max-width: 240px;
  padding: 10px 25px;
  color: #313131;
  transition: 0.3s ease-in-out;
  font-weight: 500;
  padding: 20px 0px 20px 0;
  text-decoration: none;
}
.button006 a:before {
  content: '';
  position: absolute;
  top: calc(50% - 2px);
  right: -2em;
  transform: translateY(calc(-50% - 2px)) rotate(30deg);
  width: 12px;
  height: 2px;
  background-color: #ba55d3;
  transition: 0.3s;
}
.button006 a:after {
  content: '';
  position: absolute;
  top: 50%;
  right: -2em;
  transform: translateY(-50%);
  width: 60px;
  height: 2px;
  background-color: #ba55d3;
  transition: 0.3s;
}
.button006 a:hover:before, .button006 a:hover:after {
  right: -2.5em;
}
.button006 a:hover {
  background: #edf6ff;
  color: #ba55d3;
}


/*----------------*/
/* form */
/*----------------*/
.cp_iptxt {
	position: relative;
	width: 80%;
	margin: 40px auto;
}
.cp_iptxt input[type='text'],
.cp_iptxt input[type='date'],
.cp_iptxt input[type='time'],
.cp_iptxt textarea
 {
	font: 15px/24px sans-serif;
	box-sizing: border-box;
	width: 100%;
	letter-spacing: 1px;
	padding-left: 5.5em;
  -webkit-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
.cp_iptxt input[type='text']:focus,
.cp_iptxt input[type='date']:focus,
.cp_iptxt input[type='time']:focus,
.cp_iptxt textarea:focus
 {
	outline: none;
  padding-left: 10px;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
.ef {
	padding: 4px 0;
	border: 0;
	border-bottom: 1px solid #1b2538;
	background-color: transparent;
}
.ef ~ .focus_line {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0;
	height: 2px;
	transition: 0.4s;
	background-color: #da3c41;
}
.ef:focus ~ .focus_line,
.cp_iptxt.ef ~ .focus_line {
	width: 100%;
	transition: 0.4s;
}
.ef ~ label {
	position: absolute;
	z-index: -1;
	top: 4px;
	left: 0;
	width: 100%;
	transition: 0.3s;
	letter-spacing: 0.5px;
	color: #aaaaaa;
}
.ef:focus ~ label, 
.cp_iptxt.ef ~ label {
	font-size: 12px;
	top: -16px;
	transition: 0.3s;
	color: #da3c41;
}
.submit {
  display: flex;
  justify-content: space-between;
  padding-top: 20px;
  width: 80%;
  margin: 0 auto;
}
.submit p {
  font-size: 10px;
  line-height: 2em;
  margin: 3px 2px;
  text-align: left;
}
.check{
  cursor: pointer;
}
.cp_iptxt select {
  height: 30px;
  padding: 0 30px 0 5.5em;
  position: relative;
  width: 100%;
  z-index: 0;
}
.cp_text{
  width: 80%;
  margin: 0 auto;
}
@media screen and (min-width: 740px) {
  .submit {
    min-height: 50px;
  }
  .cp_text{
    width: 60%;
  }
}

/*----------------*/
/* welcart */
/*----------------*/
.item-info {
  line-height: 25px;
}
#wc_cart{
  line-height: 25px;
  margin: 100px auto 0 auto;
  width: 90%;
}
#wc_cart #cart .upbutton {
  text-align: left;
  padding: 10px 0 10px 0 ;
}
.item-description{
  width: 90%;
  margin: 10px auto;
}
#itempage .item-description h3 {
  font-weight: bold;
  padding: 0.5em 1em;
  border: 3px solid #616161;
  box-shadow: 3px 3px 0 0 #616161;
  position: relative;
  background-color: transparent;
  margin-bottom: 30px;
}
#itempage .item-description h3::before, #itempage .item-description h3::after {
  content: '';
  height: 0;
  width: 0;
  border: solid transparent;
  position: absolute;
  left: 30px;
}
#itempage .item-description h3::before {
  border-color: transparent;
  border-top-color: #616161;
  border-right-color: #616161;
  border-width: 10px;
  top: 100%;
  left: 26px;
}
#itempage .item-description h3::after {
  border-color: transparent;
  border-top-color: #fff;
  border-right-color: #fff;
  border-width: 6.5px;
  top: 99%;
}

@media screen and (max-width: 740px) {
  
}





/*******************************************************/
.cart-page{
  padding: 0 0 100px 0;
}
#cart {
	width: 100%;
}
#wc_customer,
#wc_delivery{
  padding-top: 100px;
}

#cart div.error_message {
	font-weight: bold;
	color: #FF0000;
	margin-top: 10px;
}

#cart .upbutton {
	text-align: right;
	padding-right: 20px;
}

#cart table {
	border: 1px solid #CCCCCC;
}

#cart table#cart_table {
	margin-bottom: 10px;
}

#cart th, 
#cart td {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FFFFFF;
	border-right-color: #CCCCCC;
	border-bottom-color: #CCCCCC;
	border-left-color: #FFFFFF;
	padding-top: 3px;
	padding-right: 5px;
	padding-bottom: 3px;
	padding-left: 5px;
	vertical-align: middle;
	text-align: center;
	white-space: normal;
	word-break:break-all;
}
#cart td.signal_red {
	font-weight: bold;
	color: #FF0000;
}
#cart th {
	color: #FFFFFF;
	background-color: #999999;
	white-space: nowrap;
	font-weight: normal;
    font-size: 0.9em;
}

#cart th.aright,
#cart td.aright {
	text-align: right;
	white-space: nowrap;
}

#cart th.aleft,
#cart td.aleft {
	text-align: left;
}

#cart td.productname {
	text-align: left;
}

#cart input.quantity {
	width: 40px;
	text-align: center;
	font-size: 13px;
}

#cart th.num,
#cart th.thumbnail,
#cart th.price,
#cart th.unitprice,
#cart th.quantity,
#cart th.subtotal {
	text-align: center;
	vertical-align: middle;
} 

#cart .num {
	white-space: nowrap;
	width: 40px;
	text-align: center;
} 

#cart .thumbnail {
	white-space: nowrap;
	width: 70px;
	text-align: center;
} 

#cart .price,
#cart .unitprice {
	white-space: nowrap;
	width: 80px;
	text-align: right;
} 

#cart .quantity {
	white-space: nowrap;
	width: 65px;
	text-align: center;
} 

#cart .subtotal {
	white-space: nowrap;
	width: 100px;
	text-align: right;
} 

#cart .stoc {
	white-space: nowrap;
	width: 90px;
	text-align: center;
} 

#cart .action {
	white-space: nowrap;
	width: 60px;
	text-align: center;
} 

#cart #point_table {
	width: 350px;
	margin-top: 15px;
	margin-bottom: 10px;
	margin-right: auto;
	margin-left: auto;
}

#cart #point_table td {
	height: 30px;
}

#cart #point_table .point {
	font-size: 1.5em;
	font-weight: bold;
}

#cart #point_table input.used_point {
	width: 100px;
	text-align: right;
	padding-right: 5px;
}
#cart input.delButton {
    padding: 5px 5px;
    font-weight: normal;
}

#content #wc_cart img,
#content #wc_confirm img {
	max-width: none;
}
.wc_confirm_notes_area {
	margin: 2em 0;
}
.cart-page .send .to_customerinfo_button{
  background-color: khaki;
}
.ui-dialog, #primary {
  line-height: 15px;
}


@media screen and (max-width: 740px) {
  #cart_table{
    border-collapse: collapse;
    width: 100%;
    table-layout: fixed;
    word-break: break-all;
    word-wrap: break-all;
  }
  #wc_cart #cart .upbutton {
    text-align: center;
    font-size: 14px;
    margin-bottom: 1.041em;
    padding: 0;
}
#wc_cart #cart .upbutton input {
  display: block;
  width: 100%;
  margin: 0.833em auto 0;
  padding: 3px 0.833em;
  font-size: 18px;
}
  #cart_table thead{
    display: none;
  }
  #cart_table .num{
    display: none;
  }
  #cart_table tbody tr {
    display: block;
    position: relative;
    padding: 0.769em 0;
    border-top-width: 1px;
    border-top-style: solid;
}
#cart_table tbody tr {
  display: block;
  position: relative;
  padding: 0.769em 0;
  border-top-width: 1px;
  border-top-style: solid;
}
#cart_table td.thumbnail{
  padding-left: 0;
}
#cart_table tr,
#cart_table th,
#cart_table td {
  display: block;
  width: 100%;
}
#cart_table td{
  position: relative;
  padding-left: 18%;
  padding: 10px 0.385em 10px 18%;
  width: auto;
  border-width: 0;
}
#cart #cart_table .thumbnail{
  width: auto;
  text-align: center;
}
#cart #cart_table .productname{
  text-align: right;
}
#cart #cart_table .unitprice,
#cart #cart_table .quantity,
#cart #cart_table .aright ,
#cart #cart_table .stock{
  white-space: nowrap;
  width: auto;
  text-align: right;
}
#cart #cart_table .action{
  padding: 10px 0 10px 0;
  text-align: center;
  width: auto;
}
#cart_table .action .delButton{
  width: 80%;
}
#cart_table tbody td:before {
	position: absolute;
	top: 3px;
	left: 0;
	text-align: left;
	width: 15%;
	font-weight: bold;
	-webkit-transform: none;
	transform: none;
  padding: 0 0 0 5px;
}
#cart_table .productname:before {
	content: "商品名";
}
#cart_table .unitprice:before {
	content: "単価";
}
#cart_table .quantity:before {
	content: "数量";
}
#cart_table .subtotal:before {
	content: "金額";
}
#cart_table .stock:before {
	content: "在庫あり";
}
#cart_table .discount_price:before {
	content: "キャンペーン割引";
}
#cart_table .tax_price:before {
	content: "内消費税";
}
#cart_table .point_price:before {
	content: "使用ポイント";
}
#cart_table .shipping_price:before {
	content: "送料";
}
#cart_table .cod_price:before {
	content: "代引手数料";
}
#cart_table .used_points:before {
	content: "使用ポイント";
}
.cart-page .send{
  width: 100%;
  margin: 20px auto;
  text-align: center;
}
.cart-page .send input{
  width: 40%;
  padding: 20px 0;
  font-size: 18px;
}
}



/*----------------*/
/* woocommerce */
/*----------------*/
/*
.woocommerce .woocommerce-breadcrumb {
  margin: 0 0 1em;
  padding: 80px 0 0 0;
  font-size: .92em;
  color: #767676;
}
.woocommerce-message {
  display: flex;
  flex-direction: column-reverse;
  border-top-color: #8fae1b;
}
a.button.wc-forward {
  margin-top: 30px;
  color: #fff;
  background-color: #8fae1b;
}.woocommerce div.product .product_title {
  clear: none;
  margin-top: 0;
  padding: 0 0 0 10px;
}
.woocommerce div.product p.price{
  padding: 0 0 0 10px;
  }
.woocommerce-variation.single_variation {
    margin-bottom: 30px;
}
.woocommerce div.product form.cart div.quantity {
  float: left;
  margin: 0 4px 0 10px;
}
*/

/*----------------*/
/* footer */
/*----------------*/
#block-7 {
  width: 100%;
}
.glofoot{
  padding: 20px 10px 20px 10px;
  background-color: #1b2538;
  width: 100%;
}
.sns{
  text-align: center;
  color: #ededed;
  float: none;
  width: auto;
}
.sns dl dt {
  padding: 20px 0 20px 0;
}
.sns dl dd {
  font-size: 35%;
  line-height: 2;
  line-height: 1.7;
  color: #ccc;
  margin-inline-start: 0px;
}
.sns dl dd img{
  width: 10%;
}
.sns ul{
  list-style: none;
  padding-inline-start: 0px;
}
.sub-nav {
  margin-top: 20px;
  border-top: 1px solid #333;
  padding-bottom: 20px;
  text-align: center;
  float: none;
  width: auto;
}
.gf-nav{
  list-style: none;
  margin: 20px auto;
  font-size: 16px;
  font-weight: bold;
  display: inline-block;
  text-align: left;
  list-style-position: inside;
  padding: 0;
}
.gf-nav li{
  display: flex;
  align-items: center;
  gap: 0 10px;
  padding: 15px;
}
.gf-nav li::before {
  transform: rotate(-45deg);
  width: .4em;
  height: .4em;
  border-bottom: 3px solid #ededed;
  border-right: 3px solid #ededed;
  content: '';
}
.gf-nav li a,.gf-nav2 li a{
  text-decoration: none;
  color: #ededed;
}
.gf-nav li a:hover,.gf-nav2 li a:hover{
  text-decoration: underline;
}
.gf-nav2{
  margin-top: 14px;
  padding-top: 15px;
  padding-bottom: 15px;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  overflow: hidden;
  line-height: 40px;
  list-style: none;
  padding-inline-start: 0px;
}
.gf-nav2 li{
  width: 50%;
  float: left;
}
@media screen and (min-width: 740px) {
  .sub-nav{
    margin: 0 auto;
  }
  .sns dl dd img{
    width: 5%;
  }
  .gf-nav{
    display: flex;
    align-items: center;
    justify-content: space-around;
  }
  .gf-nav2{
    padding: 15px 15% 15px 15%;
  }
  .gf-nav2 li{
    width: 25%;
    float: left;
  }
}