*,
html,
body,
input,
button,
select,
textarea {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-style: normal;
}
.no_scr {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.no_scr::-webkit-scrollbar {
  display: none;
}
a {
  text-decoration: none;
}

.roboto,
#head_menu span {
  font-family: "Roboto", sans-serif;
}
.gothic {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}
.wrap {
  width: calc(100% - 80px);
  max-width: 1400px;
  margin: 0 auto;
}

.bt_area {
  display: flex;
  justify-content: center;
}

.bt_area a,
.bt_area a::before,
.bt_area button,
.bt_area button::before {
  transition: 0.4s all ease-in-out;
}

.bt_area a,
.bt_area button {
  display: block;
  padding: 25px;
  text-align: center;
  width: calc(100% - 80px);
  max-width: 400px;
  color: #000;
  border: 1px solid #000;
  font-size: 130%;
  font-weight: 700;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.bt_area a::before,
.bt_area button::before {
  position: absolute;
  z-index: -1;
  content: "";
  width: 100%;
  height: 100%;
  background: #000;
  left: 0;
  bottom: -100%;
}

.bt_area a:hover,
.bt_area button:hover {
  color: #fff;
}

.bt_area a:hover::before,
.bt_area button:hover::before {
  bottom: 0;
}

.title_area {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.title_area h2 {
  font-size: 400%;
}
.title_area small {
  font-size: 14px;
}

.title_area::before {
  content: "";
  width: 100%;
  height: 30px;
  background-image: url("../images/title_icon.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

#head_logo,
#head_menu {
  position: fixed;
}

#head_logo {
  top: 20px;
  left: 20px;
  width: 90px;
  aspect-ratio: 1;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  backdrop-filter: blur(5px);
  transition: 0.3s all ease;
  z-index: 5000;
}
#head_logo:hover {
  background: rgba(0, 0, 0, 1);
}

#head_logo img {
  width: 60%;
  filter: invert(1);
}
#head_logo a {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
}

#head_menu {
  top: 30px;
  right: 30px;
  width: 50px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: 0.3s all ease;
  z-index: 8005;
}
#head_menu:hover {
  opacity: 0.6;
}

#head_menu .box {
  width: 100%;
  aspect-ratio: 3/5;
  position: relative;
}
#head_menu p,
#head_menu .box span,
#head_menu .box::before,
#head_menu .box::after {
  transition: 0.4s all ease;
}

#head_menu .box span,
#head_menu .box::before,
#head_menu .box::after {
  content: "";
  position: absolute;
  width: 7px;
  background: #444;
  bottom: 0;
}
#head_menu.ccAct .box span,
#head_menu.ccAct .box::before,
#head_menu.ccAct .box::after {
  background: #eee;
}

#head_menu .box span {
  height: 100%;
  left: calc(50% - 3.5px);
}

#head_menu .box::before,
#head_menu .box::after {
  height: 60%;
}

#head_menu .box::before {
  left: 0;
}

#head_menu .box::after {
  right: 0;
}
#head_menu p {
  display: flex;
  justify-content: space-between;
  width: 100%;
  color: #444;
}
#head_menu.ccAct p {
  color: #eee;
}
#head_menu p span {
  font-size: 100%;
  font-weight: 700;
}

#head_menu.white .box span,
#head_menu.white .box::before,
#head_menu.white .box::after {
  background: #777;
}
#head_menu.white p {
  color: #777;
}

#mv_bg {
  height: 100%;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  overflow: hidden;
}

.sticky_slider {
  position: sticky;
  top: 0;
  left: 0;
}
.sticky_slider .ss_outer {
  height: 100vh;
  position: relative;
}
.sticky_slider .ss_inner {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  transition: 0.4s all ease;
  z-index: 0;
}
.sticky_slider .ss_inner.active {
  opacity: 1;
  z-index: 1;
}
.sticky_slider .ss_inner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sticky_slider .inner {
  position: relative;
}

.sticky_slider .ss_inner_scr {
  height: 40%;
  width: 1px;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 30%;
  right: 5%;
}
.sticky_slider .ss_inner_scr span {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: black;
  position: absolute;
  top: 0;
  left: calc(50% - 10.5px);
}

.biko {
  font-size: 12px;
}
.biko::before {
  content: "※";
  margin-right: 5px;
}
.noimage {
  width: 100%;
  height: 100%;
  background: #aaa;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 120%;
  letter-spacing: 0.1rem;
}

.report_list {
  width: calc(100% - 80px);
  max-width: 1400px;
  margin: 70px auto 0;
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
}
.report_list li {
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
  position: relative;
}

.report_list li .img_box {
  width: 100%;
  aspect-ratio: 6/4;
  overflow: hidden;
}
.report_list li .img_box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.6s all ease;
  transform-origin: center;
}
.report_list li:hover .img_box img {
  transform: scale(1.1);
}
.report_list li .text_box {
  padding: 10px;
}

.report_list li .text_box h3 {
  font-size: 120%;
  font-weight: 700;
  margin-bottom: 10px;
  display: flex;
  align-items: flex-end;
}
.report_list li .text_box h3 small {
  display: block;
  margin-left: 10px;
  font-size: 15px;
}
.report_list li .info {
  display: flex;
  margin: 10px 0;
  font-size: 80%;
}
.report_list li .info p:last-child {
  margin-left: 20px;
}
.report_list li .list_bt {
  display: flex;
  justify-content: space-between;
}
.report_list li .list_bt a,
.report_list li .list_bt button {
  width: calc(50% - 10px);
  padding: 8px 0 10px;
  text-align: center;
  color: #fff;
  font-size: 110%;
}

.report_list li .list_bt a:hover,
.report_list li .list_bt button:hover {
  opacity: 0.8;
}
.report_list li .tag_list {
  display: flex;
  flex-wrap: wrap;
}
.report_list li .tag_list li {
  padding: 2px 7px 4px;
  font-size: 12px;
  color: #fff;
  background: #000;
  margin-right: 5px;
  margin-bottom: 0;
  margin-top: 3px;
  width: auto;
}
.report_list li a.cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
#articles_list_section .report_list li {
  position: relative;
}
#articles_list_section .report_list li a {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#articles_list_section .report_list li:hover {
  background: #eee;
}
#articles_list_section .report_list li:hover h3 {
  text-decoration: underline;
}
#menu_area_wrap {
  display: none;
  z-index: 9999;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden;
}
#menu_close_bg,
#menu_close_bg img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
#menu_close_bg img {
  object-fit: cover;
}
#menu_area .head,
#menu_area a,
#menu_area button {
  color: #fff;
}
#menu_area a,
#menu_area button {
  font-size: 22px;
}
#menu_area {
  position: absolute;
  top: 0;
  right: -400px;
  width: calc(100% - 50px);
  max-width: 400px;
  height: 100%;
  z-index: 10;
  transition: 0.4s all ease;
  overflow: auto;
}
#menu_area,
#menu_area .head,
#menu_area .body {
  background: #2a292f;
}
#menu_area .head,
#menu_area .body {
  padding: 40px 30px;
}
#menu_area .head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: #777 1px solid;
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1;
}
#menu_area .head h2 {
  font-size: 170%;
}
#menu_area .head button {
  width: 34px;
  aspect-ratio: 1;
  display: block;
  position: relative;
}
#menu_area .head button::before,
#menu_area .head button::after {
  content: "";
  width: 100%;
  height: 2px;
  background: #fff;
  position: absolute;
  top: calc(50% - 1px);
  left: 0;
  transform-origin: center;
  transition: 0.2s all ease;
}
#menu_area .head button::before {
  transform: rotate(45deg);
}
#menu_area .head button::after {
  transform: rotate(135deg);
}
#menu_area .head button:hover::before {
  transform: rotate(55deg);
}
#menu_area .head button:hover::after {
  transform: rotate(125deg);
}

.modal_close_bg {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(5px);
  z-index: 0;
  position: absolute;
}
#menu_area .body .menu_box:first-child {
  margin-top: 0;
}
#menu_area .body .menu_box {
  margin: 30px 0;
}
#menu_area .body ul li {
  padding-right: 20px;

  margin: 15px 0;
}
#menu_area .body ul li a {
  font-size: 20px;
}
#menu_area .body ul li small {
  display: block;
  margin-top: 4px;
  font-size: 14px;
  color: #ddd;
}
#menu_area .body ul {
  margin-left: 20px;
}
#menu_area .body a,
#menu_area .body button {
  display: block;
  position: relative;
  width: 100%;
  text-align: left;
}
#menu_area a,
#menu_area a small,
#menu_area button,
#menu_area .body a::after,
#menu_area .body button::after {
  transition: 0.3s all ease;
}
#menu_area .body a::after,
#menu_area .body button::after {
  content: "";
  width: 14px;
  aspect-ratio: 1;
  position: absolute;
  top: calc(50% - 7px);
  right: 0;
  border-top: 1px solid #ccc;
  border-right: 1px solid #ccc;
}
#menu_area .body a::after {
  transform: rotate(45deg);
}
#menu_area .body button::after {
  transform: rotate(135deg);
  top: calc(50% - 12px);
}
#menu_area .body a:hover::after {
  right: -10px;
}
#menu_area .body button:hover::after {
  top: calc(50% - 7px);
}
#menu_area .body a:hover,
#menu_area .body a:hover small,
#menu_area .body button:hover {
  color: rgb(105, 174, 242);
}
#menu_area .body li a::after,
#menu_area .body li button::after {
  right: -20px;
}
#menu_area .body li.menu_articles a {
  font-size: 16px;
}
#menu_area .body li.menu_articles a small {
  font-size: 12px;
}
#page_title {
  min-height: 50vh;
  padding: 80px 0 40px;
  letter-spacing: 0.2rem;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
#page_title h1 {
  font-weight: bold;
  font-size: 20px;
}

#page_title em {
  margin-top: 30px;
  font-size: 100px;
}
.common_section {
  padding: 180px 0;
}

.load_img {
  width: 80px;
  top: calc(50% - 40px);
  left: calc(50% - 40px);
  z-index: 10;
  aspect-ratio: 1;
  border: 2px solid #fff;
  border-radius: 50%;
  position: absolute;
}
.load_img::before {
  content: "";
  width: 40%;
  height: 2px;
  top: 50%;
  left: 50%;
  position: absolute;
  background: #fff;
  transform-origin: left center;
  animation: loadImgAnim 3s infinite linear;
}
@keyframes loadImgAnim {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

#loading {
  background: #fff;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}
#loading,
#loading .outer {
  width: 100%;
  height: 100%;
}
#loading .outer {
  display: flex;
  justify-content: center;
  align-items: center;
}
#loading .outer .inner {
  position: relative;
  width: calc(100% - 50px);
  max-width: 300px;
  aspect-ratio: 4/3;
  display: flex;
  flex-direction: column;
}

#load_img {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
}
#load_img .cls-1 {
  fill: #fff;
}

#load_img .cls-1,
#load_img .cls-2 {
  stroke-width: 0px;
}

#load_img .cls-2 {
  fill: #2f2520;
}

#load_sun {
  position: absolute;
  z-index: 0;
  width: 40%;
  aspect-ratio: 1;
  top: 0;
  left: 10%;
  animation: loadSunAnim 4s infinite linear;
}
@keyframes loadSunAnim {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
#load_sun .cls-1 {
  fill: none;
  stroke: #2f2520;
  stroke-miterlimit: 10;
}

#loading .outer .inner p {
  position: absolute;
  width: 100%;
  text-align: center;
  bottom: -30px;
}

.modal_close_bt {
  width: 60px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #000;
  position: absolute;
  transition: 0.3s all ease;
}
.modal_close_bt:hover {
  transform: rotate(180deg);
}
.modal_close_bt::before,
.modal_close_bt::after {
  content: "";
  width: 60%;
  height: 2px;
  background: #fff;
  transform-origin: center;
  position: absolute;
  top: calc(50% - 1px);
  left: 20%;
}
.modal_close_bt::before {
  transform: rotate(45deg);
}
.modal_close_bt::after {
  transform: rotate(135deg);
}

#report_list_section .bt_area {
  margin-top: 60px;
}

#report_check_modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: none;
}
#report_check_modal .outer {
  position: absolute;
  height: 100%;
  top: 0;
  padding: 60px;
  width: calc(100% - 50px);
  max-width: 650px;
  background: #fff;
  z-index: 1;
  left: -650px;
  transition: 0.4s all ease;
  overflow-y: auto;
}
#report_check_modal .outer.act {
  left: 0;
}
#report_check_modal .outer .inner .img_box img {
  width: 100%;
}
#report_check_modal .outer .inner .title_box {
  margin-top: 40px;
}
#report_check_modal .outer .inner .title_box small {
  display: block;
  font-size: 12px;
}
#report_check_modal .outer .inner h2 {
  font-size: 200%;
  font-weight: 700;
}
#report_check_modal .outer .inner .text_box {
  margin-top: 20px;
}
#report_check_modal .outer .inner .info {
  display: flex;
  flex-wrap: wrap;
}
#report_check_modal .outer .inner dl {
  margin-top: 30px;
  padding-right: 50px;
}
#report_check_modal .outer .inner dt {
  color: dodgerblue;
  font-weight: 600;
}
#report_check_modal .outer .inner dd {
  font-size: 110%;
}
#report_check_modal .outer .inner .bt_area {
  margin-top: 50px;
}
#report_check_modal .modal_close_bt {
  z-index: 10;
  top: 20px;
  left: 620px;
}
#report_check_modal .bt_box {
  width: 100%;
  max-width: 300px;
  margin: 50px auto 0;
}
#report_check_modal .bt_box a {
  display: block;
  width: 100%;
  text-align: center;
  color: #fff;
  padding: 10px 0 12px;
  font-size: 120%;
}
.footer_list {
  padding: 80px 0;
  width: 100%;
}
#footer_list_area .footer_list:last-child {
  padding-bottom: 200px;
}
.footer_list_wrap {
  width: calc(100% - 60px);
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
#footer_report {
  background: #dfd8c9;
}
#footer_articles {
  background: #d1bfad;
}
.footer_list_title {
  width: 200px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.footer_list_title h2 {
  font-weight: 700;
  font-size: 200%;
}
.footer_list_title a {
  display: block;
  color: #fff;
  width: 100%;
  padding: 8px 0 10px;
  text-align: center;
  border-radius: 30px;
  margin-top: 30px;
}
.footer_list_title a:hover {
  opacity: 0.8;
}
.footer_list_wrap ul {
  width: calc(100% - 250px);
  display: flex;
  justify-content: space-around;
}
.footer_list_wrap ul li {
  width: calc(20% - 20px);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  position: relative;
}
.footer_list_wrap .img_box {
  width: 100%;
  aspect-ratio: 4/3;
}
.footer_list_wrap .img_box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#footer_articles .footer_list_wrap .img_box {
  overflow: hidden;
}
#footer_articles .footer_list_wrap .img_box img {
  transform-origin: center;
  transition: 0.4s all ease;
}
#footer_articles .footer_list_wrap li:hover .img_box img {
  transform: scale(1.1);
}

.footer_list_wrap ul li .info {
  padding: 10px 0 6px;
}
.footer_list_wrap ul li .info h3 {
  font-size: 16px;
  font-weight: 700;
}
#footer_articles .footer_list_wrap li:hover .info h3 {
  text-decoration: underline;
}
.footer_list_wrap ul li .info p {
  font-size: 13px;
}
.footer_list_wrap ul li .bt_box {
  display: flex;
  justify-content: space-between;
}
.footer_list_wrap ul li .bt_box a,
.footer_list_wrap ul li .bt_box button {
  width: calc(50% - 5px);
  padding: 6px 0 8px;
  text-align: center;
  color: #fff;
  border-radius: 6px;
}
.footer_list_wrap ul li .bt_box a:hover,
.footer_list_wrap ul li .bt_box button:hover {
  opacity: 0.8;
}
#footer_articles .footer_list_wrap ul li .bt_box a {
  width: 100%;
}
.footer_list_wrap ul li a.cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.stripe_blue {
  color: #fff;
  background-image: linear-gradient(
    -45deg,
    #56a4ab 25%,
    #356a6f 25%,
    #356a6f 50%,
    #56a4ab 50%,
    #56a4ab 75%,
    #356a6f 75%,
    #356a6f
  );
  background-size: 5px 5px;
}
.stripe_green {
  color: #fff;
  background-image: linear-gradient(
    -45deg,
    #818f59 25%,
    #91a165 25%,
    #91a165 50%,
    #818f59 50%,
    #818f59 75%,
    #91a165 75%,
    #91a165
  );
  background-size: 5px 5px;
}
.stripe_red {
  color: #fff;
  background-image: linear-gradient(
    -45deg,
    #e60012 25%,
    #9b0713 25%,
    #9b0713 50%,
    #e60012 50%,
    #e60012 75%,
    #9b0713 75%,
    #9b0713
  );
  background-size: 5px 5px;
}
.stripe_black {
  color: #fff;
  background-image: linear-gradient(
    -45deg,
    #000 25%,
    #333 25%,
    #333 50%,
    #000 50%,
    #000 75%,
    #333 75%,
    #333
  );
  background-size: 5px 5px;
}

footer {
  position: relative;
  text-align: center;
  color: #4d3419;
  background: #c4b7a7;
  padding: 100px 0;
}
#footer_mt_area {
  position: absolute;
  right: 0;
  top: -140px;
  height: 150px;
}
#footer_mt {
  height: 100%;
}

#footer_mt .cls-1 {
  fill: #c3b6a6;
  stroke: #4c3318;
  stroke-miterlimit: 10;
  stroke-width: 3px;
}

#footer_mt .cls-2 {
  fill: #4d3419;
  stroke-width: 0px;
}

#page_navigation {
  position: fixed;
  z-index: 8900;
  bottom: 20px;
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(5px);
  border-radius: 50px;
  box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.2);
}
#page_navigation ul {
  display: flex;
  align-items: center;
  padding: 0 30px;
}
#page_navigation ul li {
  padding: 12px 15px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
#page_navigation ul li svg {
  width: 30px;
}
#page_navigation ul li svg .nav0 {
  fill: #555;
}
#page_navigation ul li:hover svg .nav0 {
  fill: tomato;
}

#err_text {
  width: calc(100% - 40px);
  max-width: 600px;
  text-align: center;
  margin: 60px auto;
  font-size: 110%;
  line-height: 200%;
}

.amazon_link_bt {
  background-image: linear-gradient(
    -45deg,
    #ff9900 25%,
    #ffac30 25%,
    #ffac30 50%,
    #ff9900 50%,
    #ff9900 75%,
    #ffac30 75%,
    #ffac30
  );
  background-size: 5px 5px;
  display: flex;
  color: #000;
  justify-content: center;
  align-items: center;
}
.amazon_link_bt svg {
  margin-left: 10px;
  height: 30px;
  fill: #000;
}

.report_show_area {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}
.report_show_box,
.report_show_box .info_box {
  display: flex;
  justify-content: space-between;
}
.report_show_box {
  width: 100%;
  max-width: 360px;
  padding: 10px;
  background: #fff;
  border: 1px solid #777;
  margin: 10px;
}
.report_show_box .img_box {
  width: 40%;
  aspect-ratio: 4/3;
}
.report_show_box .img_box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.report_show_box .info_box {
  width: calc(60% - 10px);
  flex-direction: column;
  justify-content: space-between;
}
.report_show_box .info_box strong {
  font-size: 130%;
  display: block;
}
.report_show_box.articles .info_box strong {
  font-size: 100%;
}
.report_show_box .info_box p {
  font-size: 80%;
  color: #555;
  line-height: 100%;
  margin: 4px 0;
}
.report_show_box .info_box .list_bt {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
}
.report_show_box .info_box .list_bt a,
.report_show_box .info_box .list_bt button {
  font-size: 100%;
  width: calc(50% - 4px);
  text-align: center;
  padding: 4px 0 6px;
}
.report_show_box.articles .info_box .list_bt a {
  width: 100%;
}

#footer_ads {
  min-height: 360px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

#footer_ads::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(
    0deg,
    rgba(233, 240, 250, 1),
    rgba(168, 202, 240, 1)
  );
  z-index: -2;
}
#diet_calc_bt {
  display: block;
  margin: 15px auto 0;
  font-size: 120%;
  text-align: center;
  width: calc(100% - 40px);
  max-width: 300px;
  border-radius: 5px;
  padding: 8px 0 10px;
  text-align: center;
  font-weight: 700;
  color: #fff;
  background: tomato;
}
#diet_calc_bt:disabled {
  background: #777;
}
#diet_calc_bt::before {
  content: "計算する";
}
#diet_calc_bt:disabled:before {
  content: "入力してください";
}
#diet_calc_result {
  margin-top: 30px;
  padding: 10px;
  background: #fff;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
}
#diet_calc_result strong {
  font-size: 110%;
  text-align: center;
  color: #000 !important;
  width: 100%;
  margin-bottom: 10px;
  display: block;
}
#diet_calc_result input[type="text"] {
  font-size: 120%;
  border: 1px solid #aaa;
  padding: 5px;
  width: 150px;
  margin-right: 5px;
}

.margin_top {
  margin-top: 100px !important;
}

.movie_wrap iframe {
  display: block;
  width: 100%;
  max-width: 800px;
  height: auto;
  margin: 30px auto;
  aspect-ratio: 16/9;
  border: 1px solid #aaa;
}
#footer_cloud {
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}
#footer_cloud svg {
  position: absolute;
  opacity: 0.5;
  animation-name: footerAnim;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  aspect-ratio: 1;
}
#footer_cloud path {
  fill: #fff;
}
#footer_cloud0 {
  height: 40%;
  top: 0%;
  animation-duration: 22s;
}
#footer_cloud1 {
  height: 45%;
  top: 18%;
  animation-duration: 30s;
  transform: rotateY(180deg);
}
#footer_cloud2 {
  height: 38%;
  top: 25%;
  animation-duration: 28s;
  transform: scaleX(1.2);
}
#footer_cloud3 {
  height: 46%;
  top: 35%;
  animation-duration: 24s;
  transform: rotateX(180deg) scaleX(1.4);
}
#footer_cloud4 {
  height: 42%;
  aspect-ratio: 5/4;
  top: 40%;
  animation-duration: 26s;
  transform: rotateX(180deg) rotateY(180deg) scaleX(1.1);
}
@keyframes footerAnim {
  0% {
    left: calc(0% - 200px);
  }
  100% {
    left: 100%;
  }
}

.insta_list {
  margin: 80px auto 0;
  width: calc(100% - 80px);
  max-width: 1400px;
}
.insta_list ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.insta_list ul li {
  width: calc(20% - 6px);
  margin: 3px;
  aspect-ratio: 1;
  overflow: hidden;
  position: relative;
}
.insta_list ul li:nth-child(n + 11) {
  display: none;
}
.insta_list ul li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.6s all ease;
  transform-origin: center;
}
.insta_list ul li:hover img {
  transform: scale(1.2);
  filter: blur(4px);
}
.insta_list ul li a,
.insta_list ul li .cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.insta_list ul li a {
  z-index: 2;
}
.insta_list ul li .cover {
  z-index: 1;
  background: rgba(0, 0, 0, 0.6);
  opacity: 0;
  padding: 30px;
  transition: 0.4s all ease;
  color: #fff;
  font-size: 12px;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.insta_list ul li:hover .cover {
  opacity: 1;
}
.insta_list ul li .cover svg {
  fill: #fff;
  width: 30%;
  margin-bottom: 10px;
}
.insta_list ul li .cover small {
  margin-top: 10px;
}

#insta_list_section .title_area p {
  width: calc(100% - 80px);
  margin-top: 15px;
}

.main_yama_ul {
  width: calc(100% - 50px);
  max-width: 1400px;
  margin: 50px auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.main_yama_ul li {
  width: calc(25% - 10px);
  display: flex;
  justify-content: space-between;
  background: #fff;
  margin-bottom: 10px;
  position: relative;
}
.main_yama_ul li:hover {
  background: #ffd;
}
.main_yama_ul li .img_box {
  width: 40%;
  aspect-ratio: 4/3;
  overflow: hidden;
}
.main_yama_ul li .img_box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.3s all ease;
  transform-origin: center;
}
.main_yama_ul li:hover .img_box img {
  transform: scale(1.2);
}
.main_yama_ul li .info {
  width: calc(60% - 10px);
  padding: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 80%;
}
.main_yama_ul li .info h3 {
  font-weight: bold;
}
.main_yama_ul li:hover .info h3 {
  color: #00f;
  text-decoration: underline;
}
.main_yama_ul li .info p {
  display: flex;
  margin-top: 5px;
  font-size: 90%;
  color: #555;
}
.main_yama_ul li .info p span:nth-child(1)::after {
  content: "/";
  margin: 0 5px;
}
.main_yama_ul li .info .tag {
  margin-top: 5px;
}
.main_yama_ul li .info .tag span {
  padding: 2px 4px 3px;
  background: #333;
  color: #fff;
  font-size: 80%;
}
.main_yama_ul li a {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  top: 0;
  left: 0;
}

.yama_list_section {
  padding: 80px 0;
  background: #eee;
}
.yama_list_section .yama_list_title {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: calc(100% - 50px);
  margin: auto;
}
.yama_list_section .yama_list_title h2 {
  font-size: 300%;
  margin-bottom: 20px;
}
.yama_list_section .report_list {
  padding-bottom: 0;
}
.yama_list_section .img_box {
  position: relative;
}
.yama_list_section .img_box::after {
  content: "© Google map";
  position: absolute;
  z-index: 1;
  background: #000;
  color: #fff;
  padding: 2px 5px 3px;
  bottom: 0;
  right: 0;
  font-size: 10px;
}
.yama_list_section li{
  background: #fff;
}
.yama_list_section li:hover {
  color: darkblue;
}
.yama_list_section li:hover {
  background: #ddd;
}

#weather_outer {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#weather_today {
  width: 50%;
}
#weather_today ul,
.weather_info_head,
.weather_info_body {
  display: flex;
}
#weather_today ul {
  justify-content: space-between;
}
#weather_today ul li {
  width: calc(50% - 30px);
}
#weather_today ul li h4 {
  display: flex;
  align-items: center;
  font-size: 200%;
}
#weather_today ul li h4 small {
  margin-left: 20px;
  font-size: 20px;
}
.weather_info_head {
  margin-top: 10px;
  justify-content: space-between;
  align-items: center;
}
#weather_outer .img_box {
  background: #cbd4e7;
}
.weather_info_head .img_box {
  width: 120px;
}
.weather_info_head .img_box img {
  width: 100%;
}

.weather_info_head .info {
  width: calc(100% - 130px);
}
.weather_info_head .info strong {
  font-size: 140%;
  font-weight: 700;
  width: 100%;
  display: block;
  text-align: center;
}
.weather_info_head .temp {
  width: calc(100% - 120px);
}
.weather_info_head .temp {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-wrap: wrap;
}

.weather_info_head .temp div {
  width: 2px;
  height: 40px;
  background: #aaa;
}
.weather_info_head .temp span {
  font-size: min(2.5vw, 40px);
  display: flex;
  align-items: flex-end;
}
.weather_info_head .temp span::after {
  font-size: 70%;
  content: "℃";
}
.weather_info_head .temp span.max {
  color: tomato;
}
.weather_info_head .temp span.min {
  color: dodgerblue;
}
.weather_info_body {
  margin-top: 5px;
}
.weather_info_body dl {
  font-size: 150%;
  display: flex;
  align-items: center;
}
.weather_info_body dl:nth-child(2) {
  margin-left: 20px;
}
.weather_info_body dt,
.weather_info_body dd::after {
  font-size: 70%;
}
.weather_info_body dt::after {
  content: ":";
  margin-right: 10px;
}
.weather_info_body dd::after {
  margin-left: 5px;
}
.weather_info_body dl:nth-child(1) dd::after {
  content: "m/s";
}
.weather_info_body dl:nth-child(2) dd:after {
  content: "%";
}

#weather_week {
  width: calc(50% - 80px);
}

#weather_week ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#weather_week li {
  display: flex;
  justify-content: space-between;
  width: calc(33% - 10px);
  margin-bottom: 25px;
}
#weather_week li .img_box {
  width: 80px;
}
#weather_week li .img_box img {
  width: 100%;
}
#weather_week li .info {
  width: calc(100% - 90px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#weather_week li .info .day {
  font-size: 90%;
}
#weather_week li .info .temp {
  font-size: 200%;
}
#weather_week li .info .temp::after {
  content: "℃";
  font-size: 12px;
  margin-left: 3px;
}

#report_video {
  background: #ddd;
}

.report_video_list {
  display: flex;
  flex-wrap: wrap;
  margin: 60px auto;
}
.report_video_list li {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: #fff;
}
.report_video_list li .img_box {
  width: 100%;
  aspect-ratio: 5/3;
}
.report_video_list li .img_box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.report_video_list li .info_box,
.report_video_list li .bt_box {
  padding: 10px;
}
.report_video_list li .info_box h3 {
  font-size: 90%;
  margin: 10px 0;
}
.report_video_list li .info_box p {
  font-size: 80%;
}
.report_video_list li .bt_box {
  display: flex;
  justify-content: space-between;
}
.report_video_list li .bt_box a {
  padding: 10px 0;
  text-align: center;
  width: calc(50% - 3px);
}
.report_video_list li .bt_box a {
  color: #fff;
  font-weight: 700;
}
.report_video_list li .bt_box a:hover {
  opacity: 0.8;
}
.report_video_list li .bt_box a.stripe_red::before {
  content: "動画を見る";
}
.report_video_list li .bt_box a.stripe_blue::before {
  content: "チャンネル";
}
#report_video .biko_box.wrap {
  margin-top: 50px;
}


.pa_api_area strong.title{
  text-align:center;
  font-weight: 700;
}

.pa_api_box .img_box{
  width: 100%;
  aspect-ratio: 4/3;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  padding: 10px;
}
.pa_api_area .img_box img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.pa_api_box .info_box {
  text-align: center;
}
.pa_api_box .info_box strong {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 700;
}
.pa_api_box .info_box .price small{
  color: darkred;
  font-size: 80%;
  margin-left: 10px;
}
#aside_kokoku .pa_api_area strong.title{
  font-size: 17px;
  text-align:center;
  display: block;
}
#aside_kokoku .pa_api_area{
  background: #ddd;
  padding: 20px;
}
#aside_kokoku .pa_api_area .pa_api_box{
  padding: 10px 20px 0;
}
#aside_kokoku .pa_api_box .img_box{
  max-width: 230px;
  padding: 10px;
}
#aside_kokoku .pa_api_box .info_box{
  margin-top: 10px;
}
#aside_kokoku .pa_api_box .info_box strong{
  font-size: 12px;
}
#aside_kokoku .pa_api_box .info_box .price{
  font-size: 15px;
  font-weight: 900;
  display: flex;
  justify-content: center;
  align-items: center;
}
#aside_kokoku .pa_api_box .info_box .price span{
  display: flex;
  align-items: center;
}
#aside_kokoku .pa_api_box .info_box .price span::after{
  content: "(税込)";
  font-size: 80%;
  margin-left: 5px;
}
.pa_api_box .bt_box{
  margin-top: 10px;
}
.pa_api_box .bt_box .amazon_link_bt{
  display: flex;
  font-size: 15px;
  padding: 12px 0 13px;
  border-radius: 40px;
}
.pa_api_box .bt_box .amazon_link_bt a{
  max-width: 240px;
}
.pa_api_box .bt_box .amazon_link_bt svg{
  height: 20px;
}

.articles_kokoku .pa_api_box{
  background: #ddd;
  padding: 20px 15px;
  margin: 0 5px;
}

.articles_kokoku .pa_api_box .img_box{
  max-width: 300px;
}
.articles_kokoku .pa_api_box .info_box{
  margin-top: 10px;
}
.articles_kokoku .pa_api_box .info_box strong{
  font-size: 16px;
}
.articles_kokoku .pa_api_box .info_box .price{
  font-size: 18px;
  margin-top: 5px;
  font-weight: bold;
}

.articles_kokoku .pa_api_area strong.title{
  display: block;
  font-size: 140%;
  text-align: center;
  margin-bottom: 10px;
}

.report_kokoku{
  padding: 80px 0;
}
.report_kokoku .pa_api_area .title{
  font-size: 130%;
  display: block;
  text-align:center;
}
.report_kokoku .pa_api_wrap{
  margin-top: 20px;
}
.report_kokoku .pa_api_box{
  background: #ddd;
  padding: 20px 20px 30px;
  margin: 0 5px;
}
.report_kokoku .pa_api_box .info_box{
  margin-top: 15px;
}
.report_kokoku .pa_api_box .info_box strong{
  font-size: 13px;
}
.report_kokoku .pa_api_box .info_box .price{
  font-size: 18px;
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.report_kokoku .pa_api_box .info_box .price span::after{
  content: "(税込)";
  font-size: 80%;
  margin-left: 5px;
}


.amazon_banner{
  width: calc(100% - 40px);
  max-width: 1200px;
  margin: 20px auto;
  aspect-ratio: 5/1;
  position: relative
}
.amazon_banner a{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 20;
  background: rgba(255,255,255,0);
}
.amazon_banner a:hover{
  background: rgba(255,255,255,.3);
}
.amazon_banner span,.amazon_banner strong{
  font-size: 250%;
  position: absolute;
  top: 5%;
  left: 5%;
  width: 90%;
  height: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.amazon_banner span{
  z-index: 11;
  color: #fff;
}
.amazon_banner strong{
  z-index: 10;
  color: #000;
  -webkit-text-stroke: 8px #000;
}
.az_img{
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.az_logo{
  padding: 5px 10px;
  position: absolute;
  bottom: 5px;
  right: 5px;
  width: 120px;
  z-index: 1;
  background: rgba(255, 255, 255, 0.7);
}