@charset "utf-8";
/* CSS Document */

.pc_display {
  display: inline-block !important;
}

h2 img {
  max-width: 100%;
}

.contents {
  font-family: '游ゴシック体', YuGothic, '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック', 'Yu Gothic', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'メイリオ', sans-serif;
  font-size: 16px;
  line-height: 1.6;
}
@media (hover: hover) {
  a[href]:hover img.hoverImg {
    filter: alpha(opacity=70);
    opacity: 0.7;
    -moz-opacity: 0.7;
  }
}
.contents .inner {
  max-width: 960px;
  margin: 0 auto;
  position: relative;
}
.contents img {
  max-width: 100%;
}
.contents #main_v {
  text-align: center;
}
.contents #main_v h1 {
  margin-bottom: 0px;
  font-size: 0px;
}

.contents #main_v h1 img {
  width: 100%;
}

.contents .btn_oubo {
  font-size: 1.8rem;
  color: #fff;
  position: relative;
  z-index: 1;
  text-align: center;
}
.contents .btn_oubo img {
  transition-duration: 0.3s;
}
.contents .btn_oubo img:hover {
  transform: scale(1.02);
}

.contents #main_v .btn_oubo {
  margin-top: -3rem;
}

.contents #navi {
  background: url(../img/bg01.png) center bottom no-repeat;
  background-size: 1920px;
  margin-top: -52px;
  padding-top: 60px;
}

.contents #navi .sns {
  display: flex;
  justify-content: center;
  gap: 0 1%;
  margin-bottom: 4%;
}

.contents #navi .menu {
  display: flex;
  justify-content: center;
  gap: 0 1%;
}

.contents #navi .lead {
  padding: 90px 0 30px 0;
  text-align: center;
}

.contents #navi .lead h2 {
  margin: 3rem 0 0;
}

.contents #pkg {
  background: url(../img/bg02.png) center top no-repeat;
  background-size: 1920px;
  text-align: center;
  padding: 35px 0 310px 0;
}
.contents #pkg h2 {
  z-index: 1;
}

.contents #pkg ul {
  display: flex;
  justify-content: space-between;
  max-width: 640px;
  margin: -30px auto;
  z-index: 2;
  position: relative;
}

.contents #pkg ul:after {
  content: '';
  background-image: url(../img/cp01_txt.png);
  background-size: contain;
  display: block;
  width: 460px;
  height: 130px;
  position: absolute;
  top: calc(100% + -0.5rem);
  left: 50%;
  transform: translateX(-50%);
}

.contents #pkg li {
  text-align: center;
  width: 29.6875%;
}

.contents #pkg li img {
  width: 100%;
}

.contents #pkg li p {
  padding: 1.8rem 0 2rem;
}

#colorbox {
  width: 740px !important;
}

#cboxContent .business_modal {
  width: 740px;
}

#cboxLoadedContent {
  width: 740px;
}

#cboxContent .business_modal .name {
  font-size: 30px;
  padding-bottom: 1.5rem;
  font-weight: bold;
  text-align: center;
}

#cboxContent .business_modal .inner {
  display: flex;
  width: 740px;
  background: #fff !important;
  border-radius: 30px;
  padding: 4rem;
  font-size: 16px;
  position: relative;
  justify-content: space-between;
  align-items: center;
}

#cboxContent .business_modal img {
  max-width: 100%;
}

#cboxContent .business_modal .pkg {
  width: 30.90909091%;
}

#cboxContent .business_modal .profile {
  width: 66%;
}

#cboxContent .business_modal .profile .txt {
  display: flex;
  justify-content: space-between;
}

#cboxContent .business_modal .profile .txt .intro {
  width: 54%;
  line-height: 1.875;
  margin-top: -1rem;
}

#cboxContent .business_modal .profile .txt .photo {
  width: 42.52873563%;
}

#cboxContent .business_modal .btn {
  position: absolute;
  top: -50px;
  right: 0;
  cursor: pointer;
}

.contents #ecobag {
  background: url(../img/bg03.png) center top repeat-y;
  background-size: 1920px;
  text-align: center;
  position: relative;
  padding-bottom: 18rem;
  padding-top: 2.5rem;
}
.contents #ecobag:before {
  content: '';
  width: 100%;
  height: 84px;
  background: url(../img/cp02_header.png) center top repeat-y;
  background-size: 1920px;
  position: absolute;
  left: 0;
  top: -84px;
  display: block;
}

.contents #ecobag p {
  padding: 3rem 0;
}

.contents #ecobag p img {
  max-width: 100%;
}

.contents #ecobag .detail {
  background: #fff;
  border-radius: 30px;
  max-width: 850px;
  margin: 0 auto;
  overflow: hidden;
  padding-bottom: 5.5rem;
}

.contents #ecobag .detail .inner {
  padding: 0 36px;
}

.contents #ecobag .detail h3 {
  background: #e60012;
  color: #fff;
  font-size: 42px;
  padding: 0.2em 0;
  margin-bottom: 1.2em;
}

.contents #ecobag .detail h4 {
  background: #e60012;
  color: #fff;
  font-size: 30px;
  border-radius: 80px;
  display: inline-block;
  padding: 0.1em 0.8em;
  width: 6em;
}

.contents #ecobag .detail p {
  font-size: 24px;
  color: #333333;
  font-weight: bold;
}

.contents #ecobag .detail p span {
  font-size: 36px;
}

.contents #ecobag .detail .howto {
  padding: 2.2rem 0 1.8rem;
  line-height: 1.4;
}
.contents #ecobag .detail .example {
  background-color: #fef0d2;
  padding-bottom: 3rem;
  margin-bottom: 5rem;
}
.contents #ecobag .detail .example_ttl {
  color: #fff;
  font-size: 30px;
  font-weight: bold;
  background: #e60012;
  line-height: 1.4;
  padding: 1.3rem 0 1.3rem;
  margin-bottom: 3.5rem;
}
.contents #ecobag .detail .example_txt_em {
  font-size: 3.2rem;
  color: #e60112;
}
.contents #ecobag .detail .example_txt {
  font-size: 2.4rem;
  padding: 2rem 0 0;
  line-height: 1.5;
}

.contents #ecobag .product_list {
  background: #fff;
  max-width: 850px;
  border: solid 3px #e60012;
  margin: 0rem auto 0 auto;
}

.contents #ecobag .product_list p.notice {
  font-weight: bold;
  line-height: 1.6;
  text-align: center;
  font-size: 1.5rem;
  padding: 0 0 1.5rem;
}

.contents #ecobag .product_list p.ttl {
  color: #fff;
  font-size: 30px;
  font-weight: bold;
  background: #e60012;
  line-height: 1.4;
  padding: 1.2rem 0;
}

.contents #ecobag .product_list .scroll {
  max-height: 18em;
  overflow-y: scroll;
  text-align: left;
  padding: 1.5rem 5rem;
}

.contents #ecobag .product_list .scroll ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.contents #ecobag .product_list .scroll li {
  border-bottom: solid 1px #e60012;
  padding: 1rem 0.8rem;
  font-weight: bold;
  font-size: 1.8rem;
}

.contents #ecobag .product_list .scroll li:nth-child(odd) {
  width: 75%;
  border-right: 1px solid #e60012;
}
.contents #ecobag .product_list .scroll li:nth-child(even) {
  flex: 1;
}

.contents #ecobag .product_list .scroll .product_list_ttl {
  color: #e60012;
}

.contents #ecobag .detail .flow {
  background: #fff;
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 7rem;
}

.contents #ecobag .detail .flow p {
  text-align: center;
  margin: 2rem auto 0 auto;
  padding: 0;
}

.contents #ecobag .detail .flow li {
  border-top: solid 1px #666666;
  text-align: left;
  padding: 0.8em 0;
  text-indent: -2em;
  padding-left: 2em;
  line-height: 1.3;
}
.contents #ecobag .detail .flow li:nth-of-type(4) {
  border-bottom: solid 1px #666666;
}

.contents #ecobag .detail .flow li span {
  color: #e11713;
  font-size: 36px;
  font-weight: bold;
  vertical-align: middle;
}

.contents #ecobag .detail .caption {
  padding: 1rem 0;
  font-size: 15px;
  margin-top: 0;
  text-align: left;
}

.contents #ecobag .detail .caption ul li {
  text-indent: -1em;
  border: none;
  padding: 0 0 0 1.5em;
  line-height: 1.6;
}

.contents #ecobag .caption ul {
  border-bottom: solid 1px #fff;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
}

.contents #ecobag .detail .flow .btn_dl {
  margin: 1rem auto;
}

.contents #ecobag .detail .product {
  padding: 1rem 0 2.5rem;
  line-height: 1.4;
}
.contents #ecobag .img01 {
  padding: 2rem 0 0;
}
.contents #ecobag .img02 {
  padding: 3rem 0 6rem;
}
.contents #ecobag .detail .kikan {
  padding: 1rem 0 5rem;
}

.contents #ecobag .kiyaku {
  background: #fff;
  max-width: 850px;
  border: solid 3px #e60012;
  margin: 7.5rem auto 0 auto;
}

.contents #ecobag .kiyaku p.ttl {
  color: #fff;
  font-size: 30px;
  font-weight: bold;
  background: #e60012;
  line-height: 1.4;
  padding: 1.2rem;
}

.contents #ecobag .kiyaku p {
  line-height: 1.625;
}
.contents #ecobag .kiyaku p.notice {
  font-weight: bold;
  text-align: center;
  font-size: 15px;
  margin-bottom: 2rem;
}

.contents #ecobag .kiyaku p.midashi {
  color: #e60012;
  font-weight: bold;
  line-height: 1.6;
  padding: 2.5rem 0 1rem 0;
  font-size: 18px;
}

.contents #ecobag .kiyaku .scroll strong {
  font-weight: bold;
}

.contents #ecobag .kiyaku .scroll {
  max-height: 20em;
  overflow-y: scroll;
  text-align: left;
  padding: 2.4rem 3.8rem;
}

.contents #myebisen {
  background: url(../img/bg04.png) center top repeat-y;
  background-size: 1920px;
  text-align: center;
  position: relative;
  padding: 100px 0 14.5rem;
}

.contents #myebisen h2 {
  margin-bottom: 4rem;
}

.contents #myebisen .detail {
  background: #fff;
  border-radius: 30px;
  max-width: 850px;
  margin: 0 auto;
  overflow: hidden;
  padding-bottom: 5rem;
}

.contents #myebisen .detail .inner {
  padding: 0 36px;
}

.contents #myebisen .detail h3 {
  background: #e60012;
  color: #fff;
  font-size: 42px;
  padding: 0.2em 0;
  margin-bottom: 1em;
}

.contents #myebisen .detail h4 {
  background: #e60012;
  color: #fff;
  font-size: 30px;
  border-radius: 80px;
  display: inline-block;
  padding: 0.1em 0.8em;
  width: 6em;
}

.contents #myebisen .detail p {
  font-size: 24px;
  color: #333333;
  font-weight: bold;
  padding: 3rem 0;
}

.contents #myebisen .detail p span {
  font-size: 36px;
}

.contents #myebisen .detail .prize {
  margin-bottom: 3rem;
}

.contents #myebisen .detail .prize li {
  display: flex; /* flexbox */
  align-items: flex-end; /* 垂直方向 */
  font-size: 35px;
  font-weight: bold;
}

.contents #myebisen .detail .prize li .small {
  font-size: 2.6rem;
}

.contents #myebisen .detail .prize li img {
  width: 39.07455013%;
}

.contents #myebisen .detail .creator {
  padding-top: 0;
}

.contents #myebisen .detail .creator img {
  max-width: 100%;
}

.contents #myebisen .detail .flow {
  background: #fff;
  font-size: 22px;
  font-weight: bold;
  margin-top: 3rem;
}

.contents #myebisen .detail .flow p {
  text-align: center;
  margin: 1rem auto 1rem auto;
  padding: 0;
}

.contents #myebisen .detail .flow li {
  border-top: solid 1px #666666;
  text-align: left;
  padding: 0.8em 0;
  text-indent: -2em;
  padding-left: 2em;
  line-height: 1.3;
}

.contents #myebisen .detail .flow li span {
  color: #e11713;
  font-size: 36px;
  font-weight: bold;
  vertical-align: middle;
}

.contents #myebisen .detail .flow .btn {
  margin: 1rem auto;
  text-align: center;
  display: block;
}

.contents #myebisen .detail .contact {
  padding: 4rem 0 3rem 0;
  margin-top: 2rem;
  background-image: url('../img/cp03_contact_bg.png'), url('../img/cp03_contact_bg.png');
  background-repeat: no-repeat, no-repeat;

  background-position: top, bottom;
}

.contents #myebisen .detail .contact strong {
  font-size: 24px;
  color: #e60012;
  font-weight: bold;
}

.contents #myebisen .detail .contact .caption {
  font-size: 15px;
  margin-top: 0;
  text-align: left;
  margin-bottom: 1rem;
}

.contents #myebisen .detail .contact .caption ul li {
  text-indent: -1em;
  border: none;
  padding: 0 0 0 1.5em;
  font-size: 1.8rem;
}

.contents #myebisen .detail .contact p {
  font-size: 22px;
  text-align: left;
  padding: 1.5rem 0;
}

.contents #myebisen .detail .contact a {
  text-decoration: underline;
}

.contents #myebisen .detail .contact p span {
  font-size: 22px;
  color: #e60012;
}

.contents #twcampaign {
  background: url(../img/bg05.png) center top repeat-y;
  background-size: 1920px;
  text-align: center;
  position: relative;
  padding: 80px 0;
}

.contents #twcampaign h2 {
  margin-bottom: 4rem;
}

#twcampaign .twcampaign_tl {
  overflow: auto;
  height: 850px;
  -webkit-overflow-scrolling: touch;
  background: #fff;
  margin: 0 auto 6.5rem;
  border-radius: 1rem;
}

/*------------------
TOPに戻るボタン
--------------------*/
#back-top {
  position: fixed;
  bottom: 3rem;
  right: 2rem;
  z-index: 9998;
  display: none;
}
#back-top a {
  width: 5.1rem;
  display: block;
  text-decoration: none;
  color: #bbb;
}
#back-top a:hover {
  color: #000;
}
/* arrow icon (span tag) */
#back-top span {
  width: 5.1rem;
  height: 5.1rem;
  display: block;
  background: url(../img/btn_top.png) center center / contain no-repeat;
}
#back-top.fixed {
  bottom: 6rem;
}

#award {
  background-image: url(../img/award_bg.png);
  padding: 10rem 0 17rem;
}
#award .award_inner {
  max-width: 850px;
}
#award .award_ttl {
  text-align: center;
  margin-bottom: 6.5rem;
}
#award .award_content {
  background-color: #fff;
  text-align: center;
  border-radius: 3rem;
  padding: 8.5rem 4.64705882% 10rem;
}
#award .award_winner {
  position: relative;
  left: 2rem;
  margin-bottom: 4.5rem;
}
#award .award_list {
  margin: 7rem 0 5rem;
}
#award .award_design_item {
  width: 42.80155642%;
}
#award .award_item_ttl {
  margin-bottom: 4rem;
}
#award .award_design_list {
  justify-content: center;
  gap: 4.5rem 6%;
}
#award .award_item + .award_item {
  margin-top: 9.5rem;
}
#award .award_ceremony_btn {
  margin-top: 4rem;
  display: inline-block;
}
#award .award_note {
  margin-top: 2.5rem;
  font-size: 1.8rem;
}

@media screen and (min-width: 768px) and (max-width: 850px) {
  .contents #navi {
    background-position: top -5vw center;
  }
}

@media screen and (max-width: 767px) {
  .pc_display {
    display: none !important;
  }
  .sp_display {
    display: block !important;
  }
  html {
    font-size: 2.6vw;
  }

  .contents #main_v {
    padding: 0;
  }

  .contents {
    font-size: 3.8vw;
  }
  .contents .inner {
    width: 96%;
    padding: 0px;
  }

  .contents img {
    width: 100%;
  }

  .contents .btn_oubo {
    font-size: 3.5vw;
    text-align: center;
  }
  .contents #main_v .btn_oubo {
    margin-top: 0;
  }
  .contents .btn_oubo span {
    display: inline-block;
    padding-left: 1em;
    text-indent: -1em;
    text-align: left;
  }
  .contents #main_v .btn_oubo img {
    width: 90%;
  }
  .contents #main_v .btn_oubo span {
    width: 90%;
  }

  /**/
  .contents .detail h3 {
    font-size: 8vw !important;
  }
  .contents .detail h4 {
    font-size: 6vw !important;
  }

  .contents p {
    padding: 2rem 0 !important;
  }

  .contents .detail {
    padding-bottom: 3vw !important;
  }

  .contents .detail p {
    font-size: 5vw !important;
  }

  .contents .detail p span {
    font-size: 6.5vw !important;
  }

  .contents .detail .caption {
    padding: 0 !important;
  }
  /**/

  .contents #navi {
    margin-top: -14vw;
    padding-top: 14vw;
    background-position: top -2vw center;
  }

  .contents #navi .lead {
    padding: 13vw 0 5vw;
  }

  .contents #navi .sns {
    display: flex;
    flex-wrap: wrap;
    gap: 0 4%;
  }

  .contents #navi .sns li {
    width: 16%;
  }

  .contents #navi .menu {
    display: flex;
    flex-wrap: wrap;
    padding-top: 3vw;
  }

  .contents #navi .menu li {
    width: 36%;
  }

  .contents #pkg {
    background-size: 300%;
    background-repeat: repeat-y;
    padding: 10vw 0 40vw 0;
  }
  .contents #pkg ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    gap: 0 6vw;
    justify-content: center;
  }

  .contents #pkg ul li {
    width: 44%;
  }

  .contents #pkg ul:after {
    display: block;
    background-repeat: no-repeat;
    width: 60vw;
    height: 40vw;
    position: absolute;
    bottom: -24%;
  }

  .contents #pkg li p {
    padding: 0.5rem 0 2rem 0 !important;
  }

  #colorbox {
    width: 94% !important;
  }

  #cboxContent .business_modal {
    width: 100%;
    padding: 11vw 0 0 0;
  }

  #cboxContent .business_modal .profile {
    width: 100%;
  }

  #cboxContent .business_modal .profile .txt {
    margin-top: 3vw;
  }

  #cboxContent .business_modal .btn {
    top: 0px;
  }

  #cboxContent .business_modal .inner {
    display: block;
    width: 100%;
    background: #fff !important;
    border-radius: 30px;
    padding: 7vw 5vw;
    font-size: 16px;
  }
  #cboxContent .business_modal .pkg {
    width: 66%;
    text-align: center;
    margin: 0 auto;
  }

  #cboxContent .business_modal .name {
    padding: 1rem 0;
    font-size: 7vw;
  }

  #cboxContent .business_modal .profile .txt .intro {
    font-size: 4vw;
    line-height: 1.5;
    margin-top: 0;
  }

  .contents #ecobag {
    background-size: 300%;
    padding-bottom: 10vw;
  }

  .contents #ecobag:before {
    background: url(../img/cp02_header.png) center top no-repeat;
    background-size: 300%;
    position: absolute;
    left: 0;
    top: -12vw;
    display: block;
  }

  .contents #ecobag .detail .inner {
    padding: 0 2vw;
  }

  .contents #ecobag .detail .example {
    margin-bottom: 12vw;
  }

  .contents #ecobag .detail .example_img {
    padding: 0 6vw;
  }

  .contents #ecobag .detail .example_ttl {
    font-size: 5vw;
  }

  .contents #ecobag .product_list .scroll li {
    width: 100%;
  }

  .contents #ecobag .product_list p.notice {
    font-size: 3.5vw !important;
    padding: 0.5rem 0 !important;
  }

  .contents #ecobag .detail .flow {
    margin-bottom: 12vw;
  }

  .contents #ecobag .detail .flow li {
    font-size: 4.5vw;
    padding: 1em 0 1em 2em;
  }

  .contents #ecobag .detail .flow li span {
    font-size: 8vw;
    line-height: 0;
  }

  .contents #ecobag .detail .caption li {
    font-size: 4vw;
  }

  .contents #ecobag .product_list .scroll {
    padding: 3vw;
  }

  .contents #ecobag .product_list .scroll li {
    font-size: 4vw;
    padding: 1vw 3vw;
    align-items: center;
    display: flex;
  }

  .contents #ecobag .product_list .scroll .product_list_ttl {
    align-items: flex-start;
  }

  .contents #ecobag .product_list .scroll li:nth-child(odd) {
    width: 70%;
  }

  .contents #ecobag .detail .caption ul li {
    margin-top: 3vw;
  }

  .contents #ecobag .kiyaku p {
    padding-top: 0 !important;
  }
  .contents #ecobag .kiyaku p.midashi {
    padding: 0 !important;
  }
  .contents #ecobag .kiyaku {
    margin: 3rem auto 0 auto;
  }
  .contents #ecobag .kiyaku .scroll {
    padding: 2rem;
  }
  .contents #ecobag .kiyaku p.ttl {
    font-size: 4.6vw;
    padding: 3vw 0 !important;
  }
  .contents #ecobag .kiyaku p.notice {
    font-size: 3.5vw !important;
    padding: 0.5rem 0 !important;
  }

  .contents #myebisen {
    padding: 10vw 0;
    background-size: 300%;
  }

  .contents #myebisen .detail .inner {
    padding: 0 2vw;
  }

  .contents #myebisen .detail .flow li {
    font-size: 4.5vw;
    padding: 1em 0 1em 2em;
  }

  .contents #myebisen .detail .flow li span {
    font-size: 8vw;
    line-height: 0;
  }

  .contents #myebisen .detail .flow p.pkg {
    width: 70%;
  }

  .contents #myebisen .detail .contact {
    background-size: contain;
  }

  .contents #myebisen .detail .contact strong {
    font-size: 5vw;
  }

  .contents #myebisen .detail .contact span {
    font-size: 5vw !important;
  }

  .contents #myebisen .detail .contact p {
    font-size: 4.7vw !important;
  }

  .contents #myebisen .detail .prize li {
    display: block;
    font-size: 6.5vw;
    font-weight: bold;
  }
  .contents #myebisen .detail .prize li img {
    width: 80%;
  }

  .contents #myebisen .detail .prize li span {
    display: block;
  }

  .contents #myebisen .detail .creator {
    padding-top: 0 !important;
  }
  .contents #twcampaign {
    padding: 10vw 0;
    background-size: 300%;
  }
  .contents #twcampaign h2 {
    margin-bottom: 5vw; /* TwTLが無い状態の一時用 */
  }
  #twcampaign .twcampaign_tl {
    height: 100vw;
    margin-bottom: 10vw;
  }

  #award {
    padding: 15vw 0;
  }
  #award .award_ttl {
    margin-bottom: 10vw;
  }
  #award .award_content {
    padding: 10vw 5vw;
  }
  #award .award_winner {
    left: auto;
  }
  #award .award_design_list {
    justify-content: space-between;
  }
  #award .award_design_item {
    width: 46%;
  }
  #award .award_list {
    margin: 12vw 0 5vw;
  }
  #award .award_item + .award_item {
    margin-top: 15vw;
  }
  #award .award_item_ttl {
    margin-bottom: 10vw;
  }
  #award .award_note {
    margin-top: -2vw;
  }

  /*------------------
  TOPに戻るボタン
  --------------------*/
  #back-top {
    bottom: 8rem;
    right: 1rem;
  }
  #back-top.fixed {
    bottom: 8rem;
  }
}