@media screen and (max-width: 820px) {
  .container {
    padding: 0 10px;
  }
  .hero{
    background: none;
  }

  a {
    word-break: break-all;
  }

  h2 {
    text-align: center;
    font-weight: bold;
    font-size: 2.0em;
  }

  h3 {
    text-align: center;
    font-weight: bold;
    font-size: 1.6em;
  }

  h3.komidashi {
    padding: 15px 20px;
  }

  img {
    width: 90%;
    margin-left: auto !important;
    margin-right: auto !important;
    height: auto !important;
    display: block !important;
    margin-bottom: 15px !important;
    float: none !important;
  }

  img.nores {
    width: auto !important;
  }

  img.u-max-full-width {
    width: auto;
    max-width: 100% !important;
  }

  #countdown img {
    width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;
    height: auto !important;
    display: block !important;
    margin-bottom: 0px !important;
    float: none !important;
  }

  .backtop {
    position: absolute;
    right: 0px;
    top: 50px;
    z-index: 1;
    width: 300px;
  }

  .backtop2 {
    position: absolute;
    right: 0px;
    /*    bottom: -150px;*/
    bottom: 0px;
    z-index: 1;
    width: 300px;
  }

  body div.section1 {
    /*		padding-bottom:170px;*/
    padding-bottom: 30px;
  }

  img.img-float-r {
    max-width: 45%;
  }

  /*img.nores{
		width: auto !important;
	}*/
  .nopc {
    display: block;
  }

  .nosp {
    display: none !important;
  }

  img.mb0 {
    margin-bottom: 0px !important;
  }

  .hero {
    padding: 0 0 !important;
    background-position: center top;
    background-size: cover;
  }

  .content1 {
    display: block;
    margin-bottom: 0.5em;
  }

  .content1 span img {
    width: auto !important;
    display: inline-block !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .content1 span {
    display: block;
    text-align: left;
    padding: 0.5em 0.5em 0.5em 0;
  }

  .box {
    font-size: 1.1em;
  }

  /*
----------------------------------*/
  .section {
    padding: 1rem 0 2rem;
  }

  h3.komidashi {
    margin-bottom: 1.5em;
  }

  .mail_form {
    padding: 1rem 0 2rem;
  }

  .mail_form p {
    font-size: 1em;
  }

  .mail_form input[type="mail"] {
    width: 80%;
    font-size: 16px;
    border: 2px solid #666;
  }

  .free_bonus .container {
    flex-direction: column;
    align-items: center;
    margin-bottom: 30px;
  }

  hr.line {
    width: 90%;
  }

  .free_bonus .container {
    flex-direction: column;
    align-items: center;
    margin-bottom: 30px;
    justify-content: center;
  }

  .free_bonus .flex .ico {
    width: 40%;
  }

  .free_bonus .flex .mincho {
    width: 90%;
    margin: 0 auto;
  }

  .present_name {
    font-size: 1.3em;
    padding-left: 0;
    padding-right: 0;
    margin: 0 auto;
    width: 100%;
  }

  .book_name {
    font-size: 1.3em;
    padding-left: 0;
    padding-right: 0;
    margin: 0 auto;
    width: 100%;
  }

  .book_image {
    width: 60%;
    max-height: none;
  }

  .book_image img {
    width: 100%;
    max-height: none;
    height: auto;
  }

  .line_bonus .more {
    font-size: 1.5em;
    margin-bottom: 1em;
  }

  .line_bonus_wrap .upper {
    flex-direction: column;
  }

  .line_bonus_wrap .upper h3 {
    width: 90%;
  }

  .line_bonus_wrap p {
    font-size: 1.5em;
    width: 90%;
  }

  .line_bonus_wrap .lower {
    flex-direction: column;
  }

  .line_bonus_wrap .lower ol {
    padding-left: 0;
    font-size: 1.4em;
    width: 90%;
  }

  .movie_bonus .container {
    flex-direction: column;
  }

  .movie_bonus .flex .ico {
    width: 40%;
  }

  .movie_bonus .flex .mincho {
    width: 90%;
    margin: 0 auto;
  }

  .mail_form .kome {
    font-size: 1.2em;
  }

  .navigator p {
    font-size: 1.2em;
    padding-left: 1em;
    padding-right: 1em;
  }

  .program p {
    font-size: 1.2em;
    margin-bottom: 1.5em;
  }

  .program ul {
    padding-left: 1em;
    padding-right: 1em;
  }

  .program ul li {
    font-size: 1em;
  }

  .psychic-box .img-float-r {
    width: 50%;
  }

.btn_end {
	position: fixed;
    bottom: 10px;
	/*right: 10px;*/
	right: initial;
    width: 100%;
    margin: 0 auto;
	padding: 0 10px 0;
	}
	
	.section.footer{
		padding-bottom: 200px !important;
	}

}

.xs {
  display: none;
}

@media screen and (max-width: 480px) {
  body {
    font-size: 140%;
  }

  .section-heading,
  .section-description {
    text-align: left;
  }

  .xs {
    display: block;
  }

  h2 {
    text-align: center;
    font-weight: bold;
    font-size: 1.3em;
  }

  h2.omidashi {
    margin-bottom: 1em;
    height: calc(100vw * 0.3);
    background-size: cover;
  }

  h3, h3.headline-lg {
    text-align: center;
    font-size: 1.2em;
  }

  h3.komidashi, h3.komidashi2 {
  background-size: 10%;
  background-position: left 0.5em top 50%, right 0.5em top 50%;
    margin-bottom: 1em;
  }
  .pb-2 {
    padding-bottom: 1em;
    margin-bottom: 0;
  }

  .detail table.tb01 td, .detail table.tb01 th,
  .detail table.tb02 td, .detail table.tb02 th {
    font-size: 0.85em;
  }

  img {
    width: 90%;
    margin-left: auto !important;
    margin-right: auto !important;
    height: auto !important;
    display: block !important;
    margin-bottom: 15px !important;
    float: none !important;
  }

  img.u-max-full-width {
    width: auto;
    max-width: 100% !important;
  }

  img.u-max-70p-width {
    max-width: 70% !important;
  }

  img.nores {
    width: auto !important;
  }

  img.img-float-r {
    max-width: 60% !important;
  }

  img.mb0 {
    margin-bottom: 0px !important;
  }

  .mincho30, h3.ttl {
    font-size: 125% !important;
  }

  h3.ttl {
    margin-bottom: 1em;
  }

  .f18, .qa dl {
    font-size: 100% !important;
  }

  .mincho24, .txt {
    font-size: 115% !important;
  }

  .f20, .psychic-box p, .list_line ul.list_st01 {
    font-size: 110% !important;
  }

  .f24, .fb30, .f30, .fb24, .point h3, .fb36 {
    font-size: 120% !important;
  }

  .f45 {
    font-size: 1.5em;
  }

  h4 {
    font-size: 1.2em;
  }

  ul {
    margin: 0 auto;
    padding: 2rem 1rem;
    font-size: 2.0rem;
  }

  .psychic-box .img-float-r {
    width: 100%;
  }

  .hero {
    padding: 0 0 !important;
  }

  ul#ico li, ul#ico2 li {
    padding-left: 1.2rem;
    font-size: 1.8rem;
  }

  .osusume ul, .sanka ul {
    font-size: 1.5rem;
  }

  .osusume ul li, .sanka ul li {
    background-size: 1.4em 1.4em;
  }

  .program1 .section-description {
    font-size: 1.1em;
  }

  .program1 .topmsg2 {
    background: url(../images/top-left.png) no-repeat left top, url(../images/top-right.png) no-repeat right bottom;
    background-size: 20%;
    padding: 20px;
  }

  .program1 .topmsg2 p {
    padding: 20px;
  }

  .guidance .waku {
    max-width: 100%;
    padding: 2rem 1.5rem 1rem;
  }

  .guidance .guide-txt {
    margin-top: 0.5em;
  }

  .guidance dt {
    float: none;
  }

  .guidance img {
    width: 100%;
  }

  .guidance dd {
    margin-left: 0;
    text-align: left;
    margin-bottom: 1em;
  }

  .menu1 {
    /*display: block;
		width: auto;*/
  }

  .content1 {
    display: block;
    /*font-size:120%;*/
  }

  .content1 span {
    display: block;
    text-align: left;
    padding: 0.5em 0.5em 0.5em 0;
  }

  .content1 span img {
    width: auto !important;
    display: inline-block !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .photo-box {
    width: 100%;
    margin: 0 auto 25px auto;
    position: relative;
    /*
	padding:10px 20px;
	border-top:solid 1px #c9a27b;
	border-bottom:solid 1px #c9a27b;
	*/
  }

  .photo-box img {
    width: 100%;
    margin-bottom: 0 !important;
  }

  .w80 {
    width: 100%;
  }

  .message_box {
    padding: 15px;
  }

  .prof .section-description {
    font-size: 1.1em;
  }

  .profBox {
    font-size: 1.0em;
    padding: 1em;
  }

  .profBox img {
    width: 100%;
  }

  .qa dl dd {
    margin-bottom: 0;
  }

  .guidance ul {
    margin-left: 0;
  }

  .voice-box1 {
    font-size: 1.1em;
  }

  .voice-box2 {
    font-size: 1.1em;
  }

  h3.riyu {
    font-size: 18px;
  }

  .ttl {
    font-size: 1.25em;
  }

  table.tb02 th {
    width: 25%;
  }

  table.tb02 td {
    width: 75%;
  }

  .pb50 {
    padding-bottom: 2em;
  }

  .pb30 {
    padding-bottom: 1em;
  }

  .list_line ul {
    padding: 0;
  }
  
.list_line ol.is-style-num_circle {
  font-size: 1.1em;
}

  .sp_fsize {
    font-size: 1em
  }

  .element-wrap .element .flex {
    height: auto;
  }

  p.pb50, p.f24, p.pb-2, p.f20 {
    margin-bottom: 30px;
  }

  .ptb30 {
    padding-bottom: 1em;
  }
  .tokuten_name{
    font-size:1.2em;

  }
	.section.footer{
		padding-bottom: 120px !important;
	}

}

/* Bigger than 550 */
@media (min-width: 550px) {
  .section {
    padding: 3rem 0 2rem;
  }

  .hero {
    /*padding: 0 0 !important;*/
  }

  .hero-heading {
    font-size: 2.4rem;
  }
}

/* Bigger than 1000 */
@media (min-width: 1000px) {
  .section {
    padding: 3rem 0 3rem;
  }

  .hero {
    /*padding: 0 0 !important;*/
    /*height: 980px;*/
    height: auto;
  }

  .hero-heading {
    font-size: 3.0rem;
  }
}

/* Bigger than 769 */
@media (min-width: 769px) {
  .hero {
    /*padding: 0 0 !important;*/
  }

  .hero-heading {
    font-size: 2.6rem;
  }

  .section {
    padding: 4rem 0 3rem;
    width: 100%;
  }

  .section-description {
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
  }

  .container {
    width: 100%;
  }
}