@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 100;
}

@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 200;
}

@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 300;
}

@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}

@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
/**
.wrap {
  background: #fff !important;
}
**/
body,
button,
input,
select,
textarea {
  font-family: "-apple-system", "Hiragino Kaku Gothic Pro", "Osaka", "Yu Gothic", YuGothic, Meiryo, sans-serif;
  font-size: 13px;
}

body {
  line-height: 1.5;
}

img.fit {
  width: 100%;
  height: auto;
}

img.to-detail {
  position: absolute;
  top: 64px;
  right: 80px;
}

img.button {
  display: block;
  margin: 0 auto;
}

h4 {
  margin-bottom: 1em;
  font-weight: bold;
}

.container {
  position: relative;
  margin: 0 auto;
  width: 910px;
  font-size: 13px;
}

.subcontainer {
  padding: 23px;
}

ul.contents-list {
  float: left;
  padding-left: 20px;
  list-style-position: outside;
  list-style-type: disc;
}

.set-contents {
  float: right;
}

.hgc {
  background-image: url(//gamilasecret.jp/wp-content/themes/gamilasecret_pc/img/gift/bg-stripe.png);
}

.instagram-banner {
  background-image: url(//gamilasecret.jp/wp-content/themes/gamilasecret_pc/img/gift/bg-instagram.png);
}

.hsscs-header,
.hmcs-header {
  background-color: #807757;
}

.gs-header {
  background-color: #443a2b;
}

.instagram-header {
  background-color: #5e130f;
}

.instagram-guide {
  background-color: #f9c8aa;
}

.instagram-guide .subcontainer {
  background-color: #f6dabc;
  height: 420px;
}

.instagram-guide .subcontainer ul li {
  margin-bottom: 1em;
}

.instagram-guide .subcontainer > div {
  width: 416px;
}

.instagram-guide .subcontainer > div:first-of-type {
  float: left;
  padding-right: 13px;
}

.instagram-guide .subcontainer > div:last-of-type {
  float: right;
  padding-left: 13px;
}

.instagram-guide .subcontainer > div h4 {
  font-size: 1.4em;
  margin-top: 20px;
  padding-left: 13px;
}

.instagram-guide .subcontainer > div ul {
  padding-left: 13px;
}

.instagram-guide .subcontainer .introduction-to-instagram {
  margin-top: 2em;
}

.instagram-guide .subcontainer .introduction-to-instagram > div {
  padding: 0;
  width: 195;
}

.instagram-guide .subcontainer .introduction-to-instagram > div:first-of-type {
  float: left;
}

.instagram-guide .subcontainer .introduction-to-instagram > div:first-of-type div {
  border: 1px solid #000;
  background-color: #fff;
  width: 196px;
}

.instagram-guide .subcontainer .introduction-to-instagram > div:first-of-type div a img {
  display: block;
  padding: 8px;
  margin: 0 auto;
}

.instagram-guide .subcontainer .introduction-to-instagram > div:first-of-type div a:first-of-type img {
  padding: 13px 0 4px;
}

.instagram-guide .subcontainer .introduction-to-instagram > div:first-of-type div a:last-of-type img {
  padding: 4px 0 13px;
}

.instagram-guide .subcontainer .introduction-to-instagram > div:last-of-type {
  float: right;
}

.hsscs-hero,
.hmcs-hero,
#instagram-campaign {
  background-color: #121212;
}

#instagram-campaign {
  border-top: 1px solid #121212;
}

.hsscs-set,
.hmcs-set {
  background-color: #f0f0f0;
  height: 180px;
}

.hsscs-set h4,
.hmcs-set h4 {
  padding-top: 26px;
}

.hsscs-set .set-contents a,
.hmcs-set .set-contents a {
  margin-left: 8px;
}

.hsscs-set .set-contents a:first-of-type,
.hmcs-set .set-contents a:first-of-type {
  margin-left: 0;
}

.regular-item-introduction h3 {
  font-weight: bold;
}

.regular-item-introduction p.description {
  height: 66px;
}

.regular-item-introduction ul {
  margin-bottom: 8px;
}

.regular-item-introduction ul li {
  display: inline-block;
}

.regular-item-introduction ul li:before {
  content: "・";
}

.regular-item-introduction a {
  margin-right: 8px;
}

.regular-item-shopping h2 {
  font-size: 20px;
}

.regular-item-shopping .display-price {
  font-size: 24px;
}

.regular-item-shopping .display-price .tax {
  font-size: 16px;
}

.shopping {
  clear: both;
  background-color: #f0f0f0;
}

.shopping h4 {
  font-weight: normal;
}

.shopping.campaign {
  background-color: #fff;
}

.shopping.campaign .subcontainer > div:first-of-type {
  width: 470px;
}

.shopping.campaign .subcontainer > div:last-of-type {
  padding-left: 20px;
  width: 382px;
}

.shopping.campaign .subcontainer > div .show-price .price {
  width: 180px;
}

.shopping .subcontainer > div {
  vertical-align: top;
  display: inline-block;
}

.shopping .subcontainer > div:first-of-type {
  width: 564px;
}

.shopping .subcontainer > div:last-of-type {
  padding-left: 0;
  width: 274px;
}

.shopping .subcontainer > div h4 {
  font-size: 1.4em;
}

.shopping .subcontainer > div a {
  margin-right: 6px;
}

.shopping .subcontainer > div select {
  margin-top: 6px;
  padding: .2em 1em;
  width: 100%;
}

.shopping .subcontainer > div .show-price {
  position: relative;
  margin-bottom: 13px;
  font-size: 1.4em;
  text-align: right;
}

.shopping .subcontainer > div .show-price img {
  top: 0;
  left: 0;
  position: absolute;
}

.shopping .subcontainer > div .show-price .price {
  display: inline-block;
  font-size: 2.0em;
  width: 163px;
}

.shopping .subcontainer input.to-cart-button {
  display: block;
  margin: 26px auto 0;
  border: 0;
  background-image: url(//gamilasecret.jp/wp-content/themes/gamilasecret_pc/img/gift/pc-to-cart-button.png);
  cursor: pointer;
  width: 626px;
  height: 60px;
}
.shopping .subcontainer input.to-cart-button:hover {
  opacity: .8;
}

.ingredients .subcontainer div {
  margin-top: 1em;
  padding: .8em 1em;
  border: 1px solid #a4a4a4;
}

.ingredients .subcontainer div p {
  margin-bottom: .8em;
  line-height: 1;
}

.extra-information {
  clear: both;
}

.extra-information h4 {
  font-weight: normal;
  font-size: 1.2em;
}

.extra-information .regulation {
  margin-top: 2em;
  padding: .8em 1em;
  border: 1px solid #a4a4a4;
  height: 230px;
  overflow: scroll;
}

/** formal 20170621 add **/
.formal .subcontainer .clear {
  clear: both;
}
.formal .subcontainer p {
  text-align: center;
  padding-bottom: 23px;
}
.formal .subcontainer div {
  width: 48%;
}
.formal .leftBox{
  float: left;
}
.formal .rightBox{
  float: right;
}
.formalSp {
  padding-bottom:20px;
}
.formalSp div {
  margin-bottom:20px;
}
