 /* カットロック無料キャンペーン */

 /* フォント */
.cc_font{
	font-family: "游ゴシック", "Yu Gothic","游ゴシック体","YuGothic","Courier","Courier New","monospace","sans-serif","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic" ;
}
.p_m10{
margin-bottom: 10px;
}
.p_m20{
margin-bottom: 20px;
}

/* ナビメニュー */
.cc_nav01 {
text-align: center;
}
.cc_nav01 ul{
　display: flex;
  justify-content: center;
}
.cc_nav01 li {
list-style: none;
width: 10%;
min-width: 90px;
font-size: 0.9em;
}
.cc_nav01 li:not(:last-child){
border-right:2px solid #ddd;
}
.cc_nav01 a{
text-decoration: none;
color: #333;
}
.cc_nav01 a.current{
color: #21944a;
border-bottom:2px solid #21944a;
}
.cc_nav01 a:hover{
color:#F7CB4D;
border-bottom:2px solid #F7CB4D;
}

@media screen and (max-width: 767px) {
.cc_nav01 ul{
    flex-direction: column;
  }
.cc_nav01 li {
  width: 100%;
}
}


/* 見出しトップ */
.heading-1 {
    position: relative;
    padding: .5em .7em .4em;
    border-bottom: 3px solid #21944a;
    color: #333333;
	
}

.heading-1::before,
.heading-1::after {
    position: absolute;
    left: 30px;
    bottom: -15px;
    width: 30px;
    height: 15px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
}

.heading-1::before {
    background-color: #21944a;
}

.heading-1::after {
    bottom: -11px;
    background-color: #fff;
}

/* 対象品 */
.cc_flex{
	margin: 0 auto;
    display: flex;
    gap: 10px;
    justify-content: center; /* 左右中央 */
    align-items: center;     /* 上下中央 */
}
.cc_box1 {
  width: 70%;
}
.cc_box2 {
  width: 30%;
}
@media screen and (max-width: 767px) {
.cc_flex{
    flex-direction: column;
  }
.cc_box1 {
  width: 100%;
}
.cc_box2 {
  width: 100%;
}
}
/*見出しリボン*/
.ribbon1 {
  display: inline-block;
  position: relative;
  height: 50px;/*リボンの高さ*/
  line-height: 50px;/*リボンの高さ*/
  text-align: center;
  padding: 0 30px;/*横の大きさ*/
  font-size: 18px;/*文字の大きさ*/
  background: #21944a;/*塗りつぶし色*/
  color: #FFF;/*文字色*/
  box-sizing: border-box;
　margin-bottom: 10px;
}

.ribbon1:before, .ribbon1:after {
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;
}

.ribbon1:before {
  top: 0;
  left: 0;
  border-width: 25px 0px 25px 15px;
  border-color: transparent transparent transparent #fff;
  border-style: solid;
}

.ribbon1:after {
  top: 0;
  right: 0;
  border-width: 25px 15px 25px 0px;
  border-color: transparent #fff transparent transparent;
  border-style: solid;
}

/*メリット*/
.merit{
background-color: #a9da91;
border-radius: 10px;
padding: 5px 10px;
color: #fff;
text-align: center;
font-weight: bold;
font-size: 14pt;
margin-bottom: 5px;
}

/*サイズ加工囲み*/
.cc_size{
border: solid 2px #93dd75;
border-radius: 10px;
padding: 10px;
text-align: center;
}

.under{
border-bottom: dashed 2px #93d175;
padding-bottom: 2px;
text-align: center;
}

.cc_icon1{
  padding: 0.5em;
  margin: 2px 0;
  display: block;
}
.cc_icon1:before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 5px 0 0;
  background: url("/dcms_media/image/cc_icon.jpg") no-repeat;
  background-size: contain;
  vertical-align: middle;
}


/* サイズ表 */

.ff-table {
  width: 100%;
  border-collapse: collapse;
  white-space: nowrap;
}
.ff-table th,
.ff-table td {
  border: 2px solid #eee;
  padding: 4px 8px;
}
/* サイズ表 */

.ff-table02 {
  width: 100%;
  border-collapse: collapse;
}
.ff-table02 th,
.ff-table02 td {
  border: 2px solid #eee;
  padding: 4px 8px;
}

/* おりたたみ */
details {
  border: 1px solid #aaaaaa;
  border-radius: 2px;
  padding: 0.5em 0.5em 0;
  margin-bottom: 20px;
}

summary {
  font-weight: bold;
  margin: -0.5em -0.5em 0;
  padding: 0.5em;
}

/* 箱見出し */
.midashi2{
  display: inline-block;
  position: relative;
  background: #21944a;
  box-shadow: 0px 0px 0px 5px #21944a;
  border: dashed 2px white;
  padding: 0.2em 0.5em;
  color: #fff;
  font-weight: bold;
  margin-bottom: 10px;
}
.midashi2:after {
  position: absolute;
  content: '';
  left: -7px;
  top: -7px;
  border-width: 0 0 15px 15px;
  border-style: solid;
  border-color: #fff #fff #114a25;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
}

.cc_triangle{
  display: flex;
  justify-content: center; 
  align-items: center;
  color: #93dd75;
}
  /* スマホ（画面幅が767px以下）の場合非表示 */
  @media (max-width: 767px) {
    .cc_triangle {
      display: none; /* 要素を消す */
    }
  }

.cc_triangle2{
  text-align: center;
  font-size: 20pt;
  color: #93dd75;
}
  /* PC（画面幅が768px以下）の場合非表示 */
  @media (min-width: 768px) {
    .cc_triangle2 {
      display: none; /* 要素を消す */
    }
  }
.cc_box03{
	background: #e9f8e3;
	border-radius: 10px;
	padding: 5px;
}
.cc_size2{
	background: #a9e491;
	border-radius: 10px;
	padding: 10px 5px;
}
.cc_size2_1{
background: #fff;
border-radius: 10px;
padding: 5px;
}

/*サイズの測り方見出し*/
.cc_midashi03{
background-color: #e9f8e3;
border-radius: 10px;
padding: 5px 10px;
color: #000000;
text-align: center;
font-weight: bold;
font-size: 14pt;
margin-bottom: 5px;

}

/* サイズ表 */
.cctable-wrap {
  overflow-x: scroll;
}
.cc-table {
  width: 100%;
  border: 1px solid #b3b3b3;
  border-radius: 10px;
  border-spacing: 0;
  border-collapse: collapse;
  white-space: nowrap;
  
}
.cc-table th,
.cc-table td {
  border: 2px solid #b3b3b3;
  padding: 4px 8px;
}
.cc-table tr th:first-child {
  border-radius: 10px 0 0 0;
}
.cc-table tr th:last-child {
  border-radius: 0 10px 0 0;
}
.cc-table tr th:last-child {
  border-radius: 0 0 10px 0;
}
.cc-table tr th:first-child {
  border-radius: 0 0 0 10px;
}
.cc-table th,
.cc-table td {
  border-bottom: 1px solid #b3b3b3;
  border-right: 1px solid #b3b3b3;
  padding: 8px;
}
.cc-tablemidashi {
  background-color: #b3b3b3;
  text-align: center;
  color: #fff;
  font-weight: bold;
}
/* スラッシュ */
.cc_heading
.cc_heading {
  align-items: center; /* 線を上下中央 */
  display: flex; /* 文字と線を横並び */
  justify-content: center; /* 文字を中央寄せ */
}
.cc_heading::before,
.cc_heading::after {
  background-color: #a9e491; /* 線の色 */
  border-radius: 5px; /* 線の両端を丸く */
  content: "";
  height: 20px; /* 線の高さ */
  width: 40px; /* 線の長さ */
}
.cc_heading::before {
  margin-right: 5px; /* 文字との余白 */
  transform: rotate(60deg); /* 傾ける */
}
.cc_heading::after {
  margin-left: 5px; /* 文字との余白 */
  transform: rotate(-60deg); /* 傾ける */
}

/* ご購入前にこちらもチェック */
.cc_check {
  position: relative;
  border-top: solid 2px #93d175;
  border-bottom: solid 2px #93d175;
  background: #f2f2f2;
  line-height: 1.4;
  padding: 1em 0.5em;
  margin: 2em 0 0.5em;
}
.cc_check:after {
  /*タブ*/
  position: absolute;
  font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
  font-weight: bold;
  content: '納期';
  background: #93d175;
  color: #fff;
  left: 0px;
  bottom: 100%;
  border-radius: 5px 5px 0 0;
  padding: 5px 7px 3px;
  font-size: 0.9em;
  line-height: 1;
  letter-spacing: 0.05em;
}

.cc_check2 {
  position: relative;
  border-top: solid 2px #93d175;
  border-bottom: solid 2px #93d175;
  background: #f2f2f2;
  line-height: 1.4;
  padding: 1em 0.5em;
  margin: 2em 0 0.5em;
}
.cc_check2:after {
  /*タブ*/
  position: absolute;
  font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
  font-weight: bold;
  content: 'お渡し方法';
  background: #93d175;
  color: #fff;
  left: 0px;
  bottom: 100%;
  border-radius: 5px 5px 0 0;
  padding: 5px 7px 3px;
  font-size: 0.9em;
  line-height: 1;
  letter-spacing: 0.05em;
}

.under2{
border-bottom: dashed 2px #fff;
padding-bottom: 2px;
text-align: center;
width: 150px;
color: #fff;
font-weight: 300;
margin:0 auto;

}

/* 商品名 */
.cc_item {
  position: relative;
  line-height: 1.4;
  padding:0.25em 1em;
  display: inline-block;
  top:0;
  font-size: 14px;
　color: #cdb884;
}

.cc_item:before, .cc_item:after { 
  position: absolute;
  top: 0;
  content:'';
  width: 8px;
  height: 100%;
  display: inline-block;
}
.cc_item:before {
  border-left: solid 1px #93dd75;
  border-top: solid 1px #93dd75;
  border-bottom: solid 1px #93dd75;
  left: 0;
}
.cc_item:after {
  content: '';
  border-top: solid 1px #93dd75;
  border-right: solid 1px #93dd75;
  border-bottom: solid 1px #93dd75;
  right: 0;
}

/* 商品ボタン */
a.cc_btn01 {
    display: flex;
    justify-content: center;
    align-items: center;
	width: 200px;
    margin: 0 auto;
    padding: .9em 2em;
    border: 2px solid #93dd75;
    background-color: #fff;
    color: #000000;
    font-size: 1em;
    text-decoration: none;
	border-radius: 10px;
}

a.cc_btn01:hover {
    border: none;
    background-color: #93dd75;
	border: 2px solid #93dd75;
    font-weight: bold;
	border-radius: 10px;
	color:#fff;
}
.cc_btn1 a {
	text-decoration: none;
}
.cc_btn1{
	margin: 10px;
}

/* 店舗を探す・来店予約ボタン */
.cc_btn02 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 250px;
    margin: 0 auto;
    padding: .9em 2em;
    border: 2px solid #fff;
    border-radius: 5px;
    box-shadow: 0 0 0 3px #21944a;
    background-color: #21944a;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
}

a.cc_btn02:hover {
   display: flex;
    justify-content: center;
    align-items: center;
	width: 250px;
    margin: 0 auto;
    padding: .9em 2em;
    border: 1.5px solid #21944a;
    background-color: #fff;
    color: #000000;
    font-size: 1em;
    text-decoration: none;
	border-radius: 10px;
}
.cc_btn2 a {
	text-decoration: none;
}
.cc_btn2{
	margin: 10px;
}

.cc_flex02{
    display: flex;
    gap: 10px;
    justify-content: center; /* 左右中央 */
    align-items: center;     /* 上下中央 */
}
.cc_box3 {
  width: 50%;
}

@media screen and (max-width: 767px) {
.cc_flex02{
    flex-direction: column;
  }
.cc_box3 {
  width: 100%;
}
}

/* アイコン */
.cc_icon2{
  padding: 0.5em;
  margin: 2px 0;
  display: block;
}
.cc_icon2:before {
  content: "";
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: 0 5px 0 0;
  background: url("/dcms_media/image/cc_icon2.png") no-repeat;
  background-size: contain;
  vertical-align: middle;
}
.cc_icon3{
  padding: 0.5em;
  margin: 2px 0;
  display: block;
}
.cc_icon3:before {
  content: "";
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: 0 5px 0 0;
  background: url("/dcms_media/image/cc_icon3.png") no-repeat;
  background-size: contain;
  vertical-align: middle;
}