@charset "utf-8";
/* CSS Document */

/*fade-in*/
 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 1500ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}

h1.fs-c-heading { display: none;}
.sale-bnr { display: none;} 


#original_wrapper {
    max-width: 1216px;
    margin: 0 auto;
}

#original_wrapper h2 {
    font-weight: 700;
    font-style: normal;
    text-align: center;
    font-size: 280%;
}
#original_wrapper h2.popup-h2 {font-size: 150%;font-weight: 700;}
@media only screen and (min-width: 750px){
#original_wrapper h2.popup-h2 {font-size: 230%;font-weight: 700;}
}

.topimg{
    width: 100vw;
    max-width: 1216px;
    margin-right: auto;
    margin-left: auto;
}

/*リード*/
.lead {margin-top: 50px;}
.lead p {text-align: center;font-size: 130%;line-height: 1.5em;}

/*PCの横幅*/
section.product {
    margin: 0 auto;
    width: 80%;
    margin-bottom: 50px;
}
section.popup_img {
    margin: 0 auto;
    width: 600px;
    margin-bottom: 50px;
}

/*スマホ設定*/
@media (max-width: 768px) {

.topimg{
margin: 0 calc(50% - 50vw);
width: 100vw;
max-width: inherit;
}

#original_wrapper h2 {
    font-weight: 700;
    font-style: normal;
    text-align: center;
    font-size: 200%;
}

/*リード*/
.lead p {text-align: center;font-size: 90%;line-height: 1.8em;}

/*スマホは横幅いっぱい*/
section.product {
    margin: 0 calc(50% - 50vw);
    width: 100vw;
    max-width: inherit;
    margin-bottom: 50px;
}
section.popup_img {
    margin: 0 calc(50% - 50vw);
    width: 100vw;
    max-width: inherit;
    margin-bottom: 50px;
}
}


/*-----テキスト-----*/
.info-center , .info-left{margin: 16px 16px 30px;}
.info-center h3 {
        text-align: center;
        font-size: 120%;
        margin: 0;
        font-weight: 600;
        }
.info-center p {
        text-align: center;
        margin-bottom: 20px;
        }
.info-left h3 {
        text-align: left;
        font-size: 100%;
        margin: 0;
        }
.info-left p {
        text-align: left;
        margin-bottom: 20px;
        line-height:1.5em
        }

@media only screen and (min-width: 750px){
.info-left {width:600px; margin: 50px auto;}
.info-center h3 {font-size: 160%;}
.info-center p {font-size: 110%;}
.info-left h3 {font-size: 130%;}
.info-left p {font-size: 110%;}
}
/*-----/テキストここまで-----*/

/*-----商品一覧部分（カミスンから修正）-----*/
#original_wrapper h3.pro_name{
	padding: 0 5px;
}
#original_wrapper .price{font-size:1.3rem;}
/*-----/商品一覧部分（カミスンから修正）ここまで-----*/

/*----地図-----*/
.map iframe {width: 100%;height:400px;}
@media only screen and (min-width: 768px){
.map iframe {width: 600px;height:450px;}}
/*----/地図-----*/

/*-----サイズtable-----*/
.size_table table {
  /*width: 100%;このサイトでは横スクロール無し*/
  width:95vw;/*このサイトでは横幅指定*/
  margin: 10px auto;
  border-spacing: 0;
  /*display: block;
  overflow-x: auto;このページでは横スクロール無し*/
  white-space: nowrap; /* 折り返し防止 */
}
@media only screen and (min-width: 750px){
.size_table table {
  max-width:450px;
}}

.size_table th,
.size_table td {
  padding: 8px;
  border-right: solid #000000 1px;
  border-bottom: solid #000000 1px;
  text-align: center;
}

.size_table th {
  background: #ededed;
  text-align: center;
  font-weight: 400;
  border-top: solid #000000 1px;/* tableのtopにボーダー入れるとPCで横幅いっぱいにボーダーが表示されてしまうの解消のため */
}

/* 横スクロール時一番左の列（サイズ）を固定 */
.size_table table tr th:first-child,
.size_table table tr td:first-child {
  position: sticky;
  left: 0;
  z-index: 10;
  border-left: solid #000000 1px;
}
.size_table table tr th:first-child{
  background: #ededed;
}
  
/* スクロールバーの全体 */
.size_table table::-webkit-scrollbar {
  width: 6px;  /* 横スクロールバーの太さ */
  height: 6px; /* 縦スクロールバーの太さ */
}

/* スクロールバーのつまみ（バー部分） */
.size_table table::-webkit-scrollbar-thumb {
  background-color: #b3b3b3;  /* 色 */
  border-radius: 4px;       /* 丸みをつける */
}

/* スクロールバーのつまみをホバーした時 */
.size_table table::-webkit-scrollbar-thumb:hover {
  background-color: #7e7e7e;  /* ホバー時の色 */
}

/* スクロールバーの背景部分 */
.size_table table::-webkit-scrollbar-track {
  background: #f1f1f1;  /* 背景色 */
  border-radius: 4px;    /* 丸みをつける */
}