body { font-family: "Midashi Go MB31","Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,  "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: normal; color: #717171; margin: 0; letter-spacing: 3px; }

.pcOnly { display: block;}
.spOnly { display: none;}

@media only screen and (max-width:768px){
  .pcOnly { display: none;}
  .spOnly { display: block;}
}

p { font-size: 1.2rem; line-height: 1.5; font-weight: 400; margin: 0;}
.fontB { font-weight: bold!important; }
ol, ul{ list-style-type:none; }
li { font-size: 1.2rem; line-height: 1.5;}

a:hover { opacity: 0.5;}
a { text-decoration: none; font-size: 1.2rem; line-height: 1.5; color: #717171; transition: 0.5s;}
a:hover { opacity: 0.5; transition: 0.5s;}

table { border-collapse: collapse; }
th { font-size: 1.2rem; line-height: 1.5; font-weight: normal; text-align: center; padding: 10px; border: solid 1px #000;}
td { font-size: 1.2rem; line-height: 1.5; padding: 10px; border: solid 1px #000;}
dt { font-size: 1.2rem; line-height: 1.5;}
dd { font-size: 1.2rem; line-height: 1.5;}
img[src$=".svg"] { max-width: 100%; }
img { max-width: 100%; }
figure { margin: 0; }
.inner { width: 70%; max-width: 1280px; margin: 0 auto;}

@media only screen and (max-width:768px){
  p { font-size: 1.1rem; }
  a { font-size: 1.1rem; }
  .inner { width: 80%;}
  dt { font-size: 1rem; line-height: 1.5;}
  dd { font-size: 1rem; line-height: 1.5;}
}

h1 { font-size: 1.2rem; line-height: 5; padding: 3% 0 7%; }
h1 img { width: 70%; }
h2 { margin: 100px 0 50px; }
h3 { justify-content: flex-start; display: flex; align-items: center; }
h3 figure { display:contents; } 
h3 img { width: 7%; padding-right: 10px; }

h2.box { margin-top: 100px; }
.partition { display: flex; flex-wrap: wrap; }
.list { width: 30%; background: #00AA9A; color: #fff; position: fixed; top: 0; left: 0; height: 100vh; } 
.topTitle { position: relative; }
.topSticky { position: sticky; top: 0; z-index: 10; background: #fff; }
main { width: 70%; padding-left: 30%; }
.menu { display: none; }
.pcmenu a { font-size: 1.0rem; }
.pcmenu { padding: 15% 10%; text-align: center; } 
.pcmenu li { list-style: none; line-height: 100px; }
.pcmenu ul { padding: 0; }
.pcmenu ul li { line-height: 50px; font-size: 1.0rem; }
.pcmenu ul li a { font-size: 0.8rem; }
.pcmenu li a { color: #fff; }
.fotterArea { text-align: center; }
.fotterArea img { width: 20%; }
.snsArea { padding: 8% 0%; display: flex; justify-content: space-between; width: 100%; margin: 0 auto;}
.snsArea a { width: 50%; margin: 0 auto; } 
.snsArea img { width: 40%; }
.fotterArea p.copyright { font-size: 0.6rem; letter-spacing: 1px; }
.headText p { margin-bottom: 40px; line-height: 3; font-size: 1.1rem; }
.itemArea { display: flex; justify-content: space-between; flex-wrap: wrap; }
.item { width: 45%; margin-bottom:5%; }
.item img { border-radius: 10px; }
.item dl { margin-bottom: 10px; }
.item dt { width: 100%; }
.item dd { font-size: 0.9rem; margin: 0; display: flex; align-items: center; letter-spacing: 2.2px; }
.item p { font-size:0.8rem; }
.item .tagicon { padding: 2px; border: 1px solid #717171; border-radius: 5px; font-size: 0.6rem;   letter-spacing: 1px; width: 18%; margin-left: 5px; text-align: center;} 
.item .sub{  background: #717171; color: #fff; }
.item .postage{ border: 1px solid #00AA9A; background: #00AA9A; color: #fff; }
.container { padding-bottom: 10%; }
.box { width: 100%; margin: 0 0 50px; opacity: 0; transition: all 2s 0s ease; transform: translateY(30px);
}
.active {  opacity: 1; top: 0; transform: translateY(0px); }
.btn { width: 25%; background: #1B6B63; margin: 3% auto 10%; border-radius: 5px; text-align: center; } 
.btn a { color: #fff; padding: 20px 10px; font-size: 1rem; letter-spacing: 1px; display: flex;
 justify-content: center; align-items: center; }

/*SP*/
@media only screen and (max-width:768px){
/*body::before { content: ''; position: fixed; top: 0; left: 0; width: 6px;  height: 100vh;  background-color: #00AA9A;  z-index: 20; }*/
.partition { display: block; }
main { width: 100%; padding-left: 0; }
.list { display: none; }
.inner { width: 80%; }
.fotterArea { margin-top: 50px; color: #fff;}
.menu-toggle { display: flex; flex-direction: column; justify-content: space-between;
  width: 32px; height: 24px; cursor: pointer; position: fixed; top: 20px; right:20px; z-index: 1000;
  transition: transform 0.3s; }
.menu-toggle span { display: block; width: 100%; height: 4px; background-color: #00AA9A; transition: all 0.3s; }
.menu-toggle.active span{ background-color: #fff; }
.menu-toggle.active span:nth-child(1) {  transform: translateY(10px) rotate(45deg); }
.menu-toggle.active span:nth-child(2) {  opacity: 0; }
.menu-toggle.active span:nth-child(3) {  transform: translateY(-10px) rotate(-45deg); }
.menu {  display: none;  position: fixed; top: 0; right: 0; width: 100%;  height: 100%;
  background-color: rgba(0, 170, 154, 0.9); color: white; text-align: center; padding-top: 60px; z-index: 900; }
.menu ul { list-style: none; padding: 0; } 
.menu ul li { margin: 20px 0; }
.menu ul li a { color: white; text-decoration: none; font-size: 24px; }
.section { padding: 100px; height: 100vh; }
.menu ul { list-style: none; padding: 0; }
.menu ul li { margin: 20px 0; }
.menu ul li a { color: white; text-decoration: none; font-size: 1rem; }
.accordion__link { font-size: 0.8rem!important; }
.section { padding: 100px; height: 100vh; }

h1 { font-size: 0.7rem; margin:50px 0 20px; }
h1 img { width: 100%; }
h2 { margin: 0; font-size: 1.2rem; }
.headText p { font-size: 0.8rem; letter-spacing: 1px; }
.itemArea { display: block; margin-bottom: 40%; }
#item { background: #E7F7F5; padding: 60px 0 20px;}
.item { width: 90%; margin-bottom: 20%; background: #fff; padding: 15px; border-radius: 10px; }
.item img { border-radius: 10px; }
.item dl { margin-bottom: 10px; }
.item dt { width: 100%; }
.item dd { margin: 0; display: block; }
.item p { font-size:0.8rem; letter-spacing: 1px; }
.item .price { width: 100%; }
.item .tagicon { width: 100%; margin-left: 0; padding: 5px; }
.btn { width: 80%; } 
.btn a { font-size:0.8rem;margin: 40px auto; }

}