/* 共通スタイルの上書き */
/* ----------------------------------------------------- */
#gokkoland .title_area,
#gokkoland .cont_area {
  background: repeating-linear-gradient(90deg, #40b078, #40b078 12.5%, #2aa66d 12.5%, #2aa66d 25%);
}
#gokkoland .bread {
  background-color: #fff;
}
#gokkoland .bread li > *,
#gokkoland .bread li > *::after {
  color: #2aa66d;
}
#gokkoland .cont_area {
  padding-top: 0;
}
#line-add ._navbox-ire {
  padding-top: var(--s4);
  margin-top: var(--s4);
  border-top: 1px solid var(--c-gray1);
}
/* テレビラジオCM TOP */
/* ----------------------------------------------------- */
#media .tb_st1 th {
  width: 20%;
}
.tvcmList {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: var(--s5);
}
@media screen and (min-width: 768px) {
  .tvcmList {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.tvcmList li {
  width: 100%;
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.tvcmList iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}
/* しってるガスのひみつ */
/* ----------------------------------------------------- */
.gokkoland-wrap {
  padding-top: var(--s5);
}
.gokkoland-logo {
  display: block;
  max-width: 85%;
  width: 100%;
  height: auto;
  margin: 0 auto;
}
.gokkoland-wrap ._tit,
.gokkoland-wrap ._lead {
  color: #fff;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}
.gokkoland-wrap ._tit {
  text-align: center;
}
.gokkoland-wrap ._lead {
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}
.gokkoland-thumbnail {
  display: block;
  max-width: 85%;
  margin: var(--s4) auto 0;
  border: 8px solid #fff;
  border-radius: 12px;
  overflow: hidden;
}
.gokkoland-thumbnail img {
  width: 100%;
  height: auto;
  margin: 0 !important;
  object-fit: cover;
}
.gokkoland-textWrap {
  max-width: 85%;
  margin: var(--s3) auto 0;
}
.gokkoland-app {
  padding: 2em;
  background-color: #fff;
  margin: 0 auto;
  border-radius: 12px;
}
.gokkoland-app_inr {
  display: flex;
  gap: var(--s5);
}
.gokkoland-app_inr {
  display: flex;
  gap: var(--s5);
}
.gokkoland-app_detail {
  padding: 1em 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.gokkoland-app_ttl {
  font-size: var(--f24);
  font-weight: 700;
}
.gokkoland-app_btn {
  font-size: var(--f14);
}
.gokkoland-app_qr {
  max-width: 164px;
  aspect-ratio: 1 / 1;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .gokkoland-app {
    width: fit-content;
    display: flex;
    padding: 2em;
  }
}
@media screen and (max-width: 768px) {
  .gokkoland-app {
    width: 80%;
    padding: 2em 1em;
    text-align: center;
  }
  .gokkoland-app_inr {
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--s2);
  }
  .gokkoland-app_ttl {
    margin-bottom: var(--s2);
  }
}
/* line */
/* ----------------------------------------------------- */
.line-intro {
  margin-bottom: var(--s6);
}
.line-intro-title {
  font-size: var(--f32);
  font-weight: 700;
  text-align: center;
}
.line-images {
  margin-top: var(--s5);
  display: flex;
  align-items: center;
  gap: var(--s5);
}
.line-images img {
  width: 100%;
  height: auto;
}
.line-mock {
  flex-basis: 30%;
}
.line-option {
  flex-basis: 70%;
}
/* LINE 友だち追加方法 */
.add-method {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: var(--s2);
}
@media screen and (min-width: 768px) {
  .add-method {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.add-method_item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 2px solid var(--c-green);
  border-radius: var(--s2);
  overflow: hidden;
}
.add-method_content {
  padding: var(--s2) var(--s1);
  background-color: var(--c-green);
  font-weight: 600;
  color: #fff;
  text-align: center;
}
.add-method_content span {
  font-size: var(--f22);
}
.add-method_details {
  padding: var(--s4) var(--s2);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
}
.line-add_qr {
  max-width: 50%;
}
.add-method_details img {
  border: 2px solid var(--c-green);
  width: 100%;
  height: auto;
  margin: 0;
}
.line-add_id {
  position: relative;
  width: 90%;
  margin: 0 auto;
  padding: 1em 2em;
  background-color: #fff;
  border: 2px solid var(--c-green);
  color: var(--c-green);
  font-weight: 600;
}
.line-add_id::after {
  position: absolute;
  top: 50%;
  right: 0.5em;
  transform: translateY(-50%);
  display: inline-block;
  font-family: saisan;
  content: '\e844';
  font-size: 1.25em;
}
/* LINE クリエイターズスタンプ */
.line-stamp_contents {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: var(--s3);
}
@media screen and (min-width: 768px) {
  .line-stamp_contents {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.line-stamp_contents_detail {
  border-radius: 12px;
  overflow: hidden;
}
.line-stamp_contents_detail._kirari {
  background: linear-gradient(to bottom, transparent 10%, #00b0ec 10%);
}
.line-stamp_contents_detail._izumi {
  background: linear-gradient(to bottom, transparent 10%, #f0831e 10%);
}
.line-stamp_contents_detail .bt_st1 {
  margin-top: var(--s2);
}
.line-stamp_contents_detail._kirari .bt_st1 a {
  color: #00b0ec;
  background-color: #fff;
  border-color: #fff;
}
.line-stamp_contents_detail._izumi .bt_st1 a {
  color: #f0831e;
  background-color: #fff;
  border-color: #fff;
}
.line-stamp_contents_detail._kirari .bt_st1 a:hover,
.line-stamp_contents_detail._izumi .bt_st1 a:hover {
  background-color: #fef200;
  border-color: #fef200;
}
.line-stamp_contents_detail img {
  width: 100%;
  height: auto;
  margin: 0;
}
.line-stamp_qr {
  padding: var(--s4);
  display: flex;
  gap: var(--s3);
}
.line-stamp_qr_image {
  max-width: 110px;
}
.line-stamp_qr_text {
  flex-grow: 1;
  color: #fff;
}
.line-stamp_qr_text dt {
  font-size: var(--f18);
  font-weight: 600;
  color: #fef200;
}
.line-stamp_qr_text dd {
  font-size: var(--f14);
  margin-top: var(--s1);
  font-weight: 600;
}
/* LINE アプリからのスタンプ購入方法 */
.line-purchase_contents {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: var(--s5);
}
@media screen and (min-width: 768px) {
  .line-purchase_contents {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.line-purchase_contents img {
  width: 100%;
  height: auto;
}
.line-purchase_step:not(:last-child)::after {
  content: '';
  display: block;
  border-right: 3px solid var(--c-green);
  border-top: 3px solid var(--c-green);
  width: 18px;
  height: 18px;
}
@media screen and (max-width: 767px) {
  .line-purchase_step {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--s2);
  }
  .line-purchase_step:not(:last-child)::after {
    transform: rotate(135deg);
  }
}
@media screen and (min-width: 768px) {
  .line-purchase_step {
    position: relative;
  }
  .line-purchase_step:not(:last-child)::after {
    position: absolute;
    top: 45%;
    right: calc(0% - var(--s5));
    transform: translate(-50%, -50%) rotate(45deg);
  }
}
.line-purchase_step_detail {
  margin-top: var(--s2);
  font-size: var(--f14);
}
.line-purchase_step_detail strong,
.line-purchase_step_detail span {
  color: var(--c-red);
}
/* LINE 公式 ヘルプページ */
.line-help_lnk {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: var(--s3);
}
.line-help_lnk .bt_st1 a {
  width: 100%;
}
@media screen and (min-width: 768px) {
  .line-help_lnk {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}