@charset "UTF-8";
html {
  font-size: 62.5%;
}

a {
  cursor: pointer;
  color: #039;
}

.font-tbudmg {
  font-family: tbudrgothic-std, sans-serif;
  font-weight: 700;
  font-style: normal;
}

/* ボタン
-------------------------------------------------- */
#itolife .lp_btn {
  display: block;
  background: #ff9730;
  color: #fff;
  width: 280px;
  height: 60px;
  text-align: center;
  cursor: pointer;
  font-size: 1.8rem;
  line-height: 60px;
  border-radius: 5px;
  padding: 0;
  text-decoration: none;
}

#itolife .lp_btn:hover {
  background: #ff652a;
}

#itolife .lp_btn.lp_btn_cart.disable {
  background: #bbb;
  pointer-events: none;
}

#itolife .lp_btn.lp_btn_cart.cart_in {
  background: #ffc66a;
  color: #555;
}

#itolife .lp_btn.lp_btn_cart.purchased {
  background: #bbb;
  pointer-events: none;
}

#itolife .promo_contents_inner.solo .lp_btn {
  width: 160px;
  height: 40px;
  line-height: 40px;
  font-size: 1.4rem;
  margin: 0 auto;
}

#itolife {
  position: relative;
  overflow: hidden;
  width: 100%;
  line-height: 1.6;
}

#itolife .promo_container {
  background: #c8c7ad url(/modpub/images/promo/itolife/img_pc.jpg) no-repeat center top;
  background-size: cover;
  background-attachment: fixed;
  padding-top: 20px;
}

#itolife .promo_container h1 {
  position: relative;
  background: url(/modpub/images/promo/itolife/logo_pc_02.png) no-repeat 0 0;
  width: 698px;
  padding-top: 402px;
  left: 50%;
  margin-left: -350px;
  height: 0;
  line-height: 200%;
  overflow: hidden;
}

#itolife .promo_container .twitter_icon {
  position: absolute;
  border-radius: 5px;
  width: 50px;
  height: 50px;
  background: #00acee;
  top: 30px;
  left: 50%;
  margin-left: 370px;
  box-shadow: 0px 0px 16px -6px rgba(0, 0, 0, 0.6);
}

#itolife .promo_container .twitter_icon:hover {
  opacity: 0.8;
}

#itolife .promo_container .twitter_icon::after {
  position: absolute;
  content: "\f099";
  color: #fff;
  font-family: "Font Awesome 5 Brands";
  font-weight: 400;
  top: 0%;
  left: 50%;
  margin-left: -25%;
  font-size: 3rem;
}

#itolife .promo_container .promo_contents {
  width: 1000px;
  position: relative;
  margin: 0 auto;
  padding-bottom: 50px;
}

#itolife .promo_container .promo_contents .promo_contents_inner {
  position: relative;
  background: rgba(255, 255, 255, 0.85);
  border-radius: 15px;
  margin-top: 50px;
}

#itolife .promo_container .promo_contents .promo_contents_inner.all-pack {
  padding: 140px 0 50px;
}

#itolife .promo_container .promo_contents .promo_contents_inner.all-pack .text-attention {
  margin: 0 auto 50px;
  text-align: center;
  color: #ff0000;
  border: 1px solid #ff0000;
  padding: 0.2em 1em;
  border-radius: 6px;
  max-width: 500px;
}

#itolife .promo_container .promo_contents .promo_contents_inner.all-pack .text-attention p {
  display: inline;
  font-size: 1.8rem;
  text-align: center;
  text-shadow: 2px  2px 1px #ffffff, -2px  2px 1px #ffffff, 2px -2px 1px #ffffff, -2px -2px 1px #ffffff, 2px  0px 1px #ffffff, 0px  2px 1px #ffffff, -2px  0px 1px #ffffff, 0px -2px 1px #ffffff;
}

#itolife .promo_container .promo_contents .promo_contents_inner.all-pack::before {
  position: absolute;
  content: "";
  display: block;
  width: 216px;
  height: 100px;
  background: url(/modpub/images/promo/itolife/title_01_after_pc.png) no-repeat 0 0;
  background-size: contain;
  top: -130px;
  left: 50%;
  margin-left: 220px;
}

#itolife .promo_container .promo_contents .promo_contents_inner.all-pack h2 {
  position: absolute;
  background: url(/modpub/images/promo/itolife/title_01_pc.png) no-repeat center 0;
  width: 892px;
  padding-top: 143px;
  height: 0;
  overflow: hidden;
  line-height: 200%;
  top: -35px;
  left: 0;
  right: 0;
  margin: 0 auto;
}

#itolife .promo_container .promo_contents .promo_contents_inner.solo {
  padding: 100px 0 50px;
}

#itolife .promo_container .promo_contents .promo_contents_inner.solo h2 {
  position: absolute;
  background: url(/modpub/images/promo/itolife/title_03_pc.png) no-repeat center 0;
  width: 614px;
  padding-top: 72px;
  height: 0;
  overflow: hidden;
  line-height: 200%;
  top: -20px;
  left: 0;
  right: 0;
  margin: 0 auto;
}

#itolife .promo_container .promo_contents .promo_contents_inner.backnumber_area {
  margin-bottom: 20px;
}

#itolife .promo_container .promo_contents .promo_contents_inner.backnumber_area h2 {
  background-position: 0 -60px;
}

#itolife .promo_container .promo_contents .promo_contents_inner .row-1 {
  margin-bottom: 30px;
  overflow: hidden;
  display: flex;
  justify-content: center;
}

#itolife .promo_container .promo_contents .promo_contents_inner .row-1 dt {
  width: 300px;
}

#itolife .promo_container .promo_contents .promo_contents_inner .row-1 dt.work_thumb img {
  width: 300px;
  height: auto;
  max-width: none;
  max-height: none;
}

#itolife .promo_container .promo_contents .promo_contents_inner .row-1 .work-wrap-r {
  width: 500px;
  margin-left: 30px;
}

#itolife .promo_container .promo_contents .promo_contents_inner .row-1 .work-wrap-r dd {
  margin-top: 0.8rem;
  width: auto;
}

#itolife .promo_container .promo_contents .promo_contents_inner .row-1 .work-wrap-r dd:first-of-type {
  margin-top: 0;
}

#itolife .promo_container .promo_contents .promo_contents_inner .row-1 .work-wrap-r dd a:hover {
  text-decoration: none;
}

#itolife .promo_container .promo_contents .promo_contents_inner .row-1 .work-wrap-r dd.work_name {
  font-size: 3rem;
}

#itolife .promo_container .promo_contents .promo_contents_inner .row-1 .work-wrap-r dd.maker_name, #itolife .promo_container .promo_contents .promo_contents_inner .row-1 .work-wrap-r dd.work_price {
  font-size: 2rem;
}

#itolife .promo_container .promo_contents .promo_contents_inner .row-1 .work-wrap-r dd.work_text {
  font-size: 1.6rem;
}

#itolife .promo_container .promo_contents .promo_contents_inner .wrap-backnumber_list {
  width: 100%;
}

#itolife .promo_container .promo_contents .promo_contents_inner .wrap-backnumber_list .backnumber_list {
  padding: 20px 0 0 0;
  display: flex;
  flex-wrap: wrap;
  width: 800px;
  margin: 0 auto;
}

#itolife .promo_container .promo_contents .promo_contents_inner .wrap-backnumber_list .backnumber_list > li {
  margin: 0 8px 20px;
  font-size: 12px;
  vertical-align: top;
  width: 184px;
}

#itolife .promo_container .promo_contents .promo_contents_inner .wrap-backnumber_list .backnumber_list > li:nth-of-type(n+5) {
  margin-top: 50px;
}

#itolife .promo_container .promo_contents .promo_contents_inner .wrap-backnumber_list .backnumber_list .work_info dt {
  text-align: center;
  margin-bottom: 10px;
  min-height: 138px;
  background: #ddd;
}

#itolife .promo_container .promo_contents .promo_contents_inner .wrap-backnumber_list .backnumber_list .work_info dt img {
  max-width: 100%;
  max-height: 138px;
  margin: 0 auto;
}

#itolife .promo_container .promo_contents .promo_contents_inner .wrap-backnumber_list .backnumber_list .work_info dd {
  margin-bottom: 5px;
  word-break: break-all;
  height: 3em;
  line-height: 1.4;
  overflow: hidden;
}

#itolife .promo_container .promo_contents .promo_contents_inner .wrap-backnumber_list .backnumber_list .work_info dd a:not(.lp_btn) {
  width: 100%;
  display: inline-block;
  font-size: 1.4rem;
  text-decoration: none;
}

#itolife .promo_container .promo_contents .promo_contents_inner .wrap-backnumber_list .backnumber_list .work_info dd a:not(.lp_btn):hover {
  text-decoration: none;
}

#itolife .promo_container .promo_contents .promo_contents_inner .work_price i {
  font-size: 0.8em;
  font-style: normal;
}

#itolife .promo_container .promo_contents .promo_contents_inner .work_price span {
  margin-left: 0.3em;
}

#itolife .promo_container .promo_contents .promo_contents_inner .work_price span:first-of-type {
  margin-left: 0;
}

#itolife .promo_container .promo_contents .promo_contents_inner .work_price span.strike {
  position: relative;
  color: #666;
  font-size: 0.8em;
  text-decoration: none;
}

#itolife .promo_container .promo_contents .promo_contents_inner .work_price span.strike i {
  font-size: 1em;
}

#itolife .promo_container .promo_contents .promo_contents_inner .work_price span.strike::after {
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  border-top: solid 1px #666;
  content: "";
}

#itolife .promo_container .attention {
  color: #222;
  width: 600px;
  text-align: left;
  text-align: center;
  padding: 0 0 50px;
  font-size: 1em;
  margin: 0 auto;
}

/*
common.cssスタイル
-------------------------------- */
#main_inner {
  margin: 0;
}

#wrapper {
  margin-top: 0;
}

#itolife .maker_name a, #itolife dd.maker_name a {
  color: #06c;
}

#itolife .work_price {
  color: #cc0000;
}

#itolife .work_point {
  color: #009933;
}

#itolife .gray {
  color: #666;
}

#itolife .work_thumb a:hover > img {
  opacity: 0.85;
}
