@charset "utf-8";
/* 特集ページ　商品説明フレーム限定CSS設定 */

/* contents.css　リンク設定流用 */
.context-mask a.btn_link, .context-mask a.btn_link_down, .context-mask a.btn_link_right { display: inline-block; padding: 0.8em 12px; margin-bottom: 5%; font-weight: 500; line-height: 1.5em; text-align: center; border-radius: 4px; box-sizing: border-box; box-shadow: 2px 2px 0px 0px #006837; background-color: #31a468; min-width: 258px; text-decoration: none; font-size: 15px; transition: .1s; position: relative;color: #FFF; }
/* line 508, ../scss/contents.scss */
.context-mask a.btn_link .popup, .context-mask a.btn_link_down .popup, .context-mask a.btn_link_right .popup { display: block; width: 65px; position: absolute; top: -32px; left: 14%; margin-left: -32px; -webkit-transform: translateY(0) scale(1); -moz-transform: translateY(0) scale(1); -o-transform: translateY(0) scale(1); -ms-transform: translateY(0) scale(1); transform: translateY(0) scale(1); transition: all .3s ease-in-out; }
/* line 521, ../scss/contents.scss */
.context-mask a.btn_link .popup img, .context-mask a.btn_link_down .popup img, .context-mask a.btn_link_right .popup img { width: 100%; height: auto; }
/* line 526, ../scss/contents.scss */
.context-mask a.btn_link:hover, .context-mask a.btn_link_down:hover, .context-mask a.btn_link_right:hover { background-color: #48bd80; box-shadow: none; transform: translate(2px, 2px); }
/* line 530, ../scss/contents.scss */
.context-mask a.btn_link:hover .popup, .context-mask a.btn_link_down:hover .popup, .context-mask a.btn_link_right:hover .popup { -webkit-transform: translateY(-8px) scale(1.2); -moz-transform: translateY(-8px) scale(1.2); -o-transform: translateY(-8px) scale(1.2); -ms-transform: translateY(-8px) scale(1.2); transform: translateY(-8px) scale(1.2); }
@media screen and (max-width: 640px) { /* line 492, ../scss/contents.scss */
  .context-mask a.btn_link, .context-mask a.btn_link_down, .context-mask a.btn_link_right { display: block; margin: 0 auto 10% auto; width: 72%; } }

/* line 546, ../scss/contents.scss */
.context-mask a.btn_link_down, .context-mask a.btn_link_right { position: relative; }
/* line 549, ../scss/contents.scss */
.context-mask a.btn_link_down:after, .context-mask a.btn_link_right:after { content: ""; display: inline-block; float: right; width: 0.8em; height: 0.8em; vertical-align: middle; transform: rotate(90deg); background: url(../images/common_contents/ico_arrow_link_right.svg) right top no-repeat; background-size: contain; position: absolute; top: 37%; right: 1em; }

/* line 565, ../scss/contents.scss */
.context-mask a.btn_link_right { padding: 1em 12px; text-align: left; padding-right: 2em; }
/* line 570, ../scss/contents.scss */
.context-mask a.btn_link_right:after { top: 44%; right: 0.5em; transform: none; }
@media screen and (min-width: 640px) { /* line 565, ../scss/contents.scss */
  .context-mask a.btn_link_right { font-size: 18px; min-width: auto; width: auto; } }

/* line 582, ../scss/contents.scss */
.gridBox .context-mask a.btn_link_right { width: 100%; margin-bottom: 3%; }

/* line 587, ../scss/contents.scss */
.linkBox { text-align: center; background: #f7f7f5; box-sizing: border-box; padding: 5%; margin-bottom: 10%; }
@media screen and (min-width: 640px) { /* line 587, ../scss/contents.scss */
  .linkBox { padding: 3% 0 0 0; margin-bottom: 5%; } }
/* line 597, ../scss/contents.scss */
.linkBox .context-mask a.btn_link, .linkBox .context-mask a.btn_link_down, .linkBox .context-mask a.btn_link_right { margin-bottom: 3%; }
@media screen and (min-width: 640px) { /* line 597, ../scss/contents.scss */
  .linkBox .context-mask a.btn_link, .linkBox .context-mask a.btn_link_down, .linkBox .context-mask a.btn_link_right { min-width: auto; width: 29%; margin-left: 1.5%; margin-right: 1.5%; } }

/* ブラウザサイズ依存表示非表示設定 */
@media screen and (max-width: 640px) { 
.context-mask .pconly{display: none;}
}

@media screen and (min-width: 640px) {
.context-mask .sponly{display: none;}
}