@charset "UTF-8";
/* ----------------------------------------------------
	sassを使用しています。css編集の際はご注意ください。
	compass/scss
---------------------------------------------------- */
/* ----------------------------------------------------
base
---------------------------------------------------- */
html, body {
  padding: 0;
  margin: 0;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  color: #373a40;
  background: url(../images/bg_dot.jpg) fixed;
}

img {
  max-width: 100%;
  height: auto;
  border: 0;
}

ul {
  list-style: none;
  box-sizing: border-box;
}
ul li {
  box-sizing: border-box;
}

/* ----------------------------------------------------
selection
---------------------------------------------------- */
::selection {
  background: #c9f3ff;
  color: #666;
}

::-moz-selection {
  background: #c9f3ff;
  color: #666;
}

/* ----------------------------------------------------
link
---------------------------------------------------- */
a {
  color: #373a40;
  text-decoration: none;
  transition: 0.2s ease-in-out;
}
a:visited {
  text-decoration: none;
  color: #373a40;
}
a:hover {
  color: #373a40;
  opacity: 0.6;
}
a:active {
  color: #373a40;
}

/* ----------------------------------------------------
header
---------------------------------------------------- */
header {
  height: 120px;
  background: #1db6e2;
}
@media (max-width: 780px) {
  header {
    height: 15.385vw;
  }
}
header .header-inner {
  padding: 0 30px;
  display: flex;
  align-items: center;
  height: 100%;
}
@media (max-width: 780px) {
  header .header-inner {
    padding: 0 3.846vw;
  }
}
header h1 {
  line-height: 0;
}
header h1 img {
  width: 566px;
  height: auto;
}
@media (max-width: 780px) {
  header h1 img {
    width: 72.564vw;
  }
}

.fixed {
  overflow: hidden;
  width: 100%;
  height: 100%;
}

/* ----------------------------------------------------
main
---------------------------------------------------- */
#container {
  margin: 0 auto;
  width: 780px;
  background: #fff;
}
@media (max-width: 780px) {
  #container {
    width: 100%;
  }
}

.pagetitle {
  margin-bottom: 54px;
  line-height: 0;
}
@media (max-width: 780px) {
  .pagetitle {
    margin-bottom: 6.923vw;
  }
}
.pagetitle img {
  width: 100%;
  max-width: 100%;
  height: auto;
}
.pagetitle.page {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 280px;
  background: url(../images/bg_stripe.svg);
}
@media (max-width: 780px) {
  .pagetitle.page {
    height: 35.897vw;
  }
}
.pagetitle.page h2 {
  font-size: 68px;
  color: #5a94f9;
  font-weight: bold;
}
@media (max-width: 780px) {
  .pagetitle.page h2 {
    font-size: 8.718vw;
  }
}

.search {
  margin: 0 auto;
  width: 672px;
}
@media (max-width: 780px) {
  .search {
    width: 86.154vw;
  }
}
.search select {
  padding: 0 34px;
  margin: 0;
  color: #373a40;
  font-size: 40px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  width: 532px;
  height: 140px;
  border: 0;
  appearance: none;
  border: 2px solid #5a94f9;
  box-sizig: border-box;
  border-radius: 20px 0 0 20px;
}
@media (max-width: 780px) {
  .search select {
    padding: 0 4.359vw;
    width: 68.205vw;
    height: 17.949vw;
    font-size: 5.128vw;
    border-radius: 2.564vw 0 0 2.564vw;
  }
}
.search input[type="submit"] {
  margin: 0;
  width: 140px;
  height: 140px;
  cursor: pointer;
  border: 0;
  background: url(../../2022sanin/images/sitetop/icon_search.svg) center center/74px no-repeat #5a94f9;
  border-radius: 0 20px 20px 0;
}
@media (max-width: 780px) {
  .search input[type="submit"] {
    width: 17.949vw;
    height: 17.949vw;
    background: url(../../2022sanin/images/sitetop/icon_search.svg) center center/9.487vw no-repeat #5a94f9;
    border-radius: 0 2.564vw 2.564vw 0;
  }
}

.theme {
  margin: 120px auto 0 auto;
  width: 672px;
}
@media (max-width: 780px) {
  .theme {
    margin-top: 15.385vw;
    width: 86.154vw;
  }
}
.theme .thumb {
  line-height: 0;
}
.theme .thumb img {
  width: 100%;
  max-width: 100%;
  height: auto;
}
.theme .morebtn {
  margin: 80px auto 0 auto;
  width: 400px;
  height: 100px;
}
@media (max-width: 780px) {
  .theme .morebtn {
    margin-top: 10.256vw;
    width: 51.282vw;
    height: 12.821vw;
  }
}
.theme .morebtn a {
  color: #5a94f9;
  font-size: 36px;
  font-weight: bold;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  background: url(../images/icon_arrow_blue.svg) right 36px center/16px no-repeat;
  border: 1px solid #5a94f9;
}
@media (max-width: 780px) {
  .theme .morebtn a {
    font-size: 4.615vw;
    background: url(../images/icon_arrow_blue.svg) right 4.615vw center/2.051vw no-repeat;
  }
}
.theme .pagelink {
  margin: 80px auto 0 auto;
  width: 400px;
  height: 100px;
}
@media (max-width: 780px) {
  .theme .pagelink {
    margin-top: 10.256vw;
    width: 51.282vw;
    height: 12.821vw;
  }
}
.theme .pagelink a {
  color: #fff;
  font-size: 36px;
  font-weight: bold;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  background: url(../images/icon_arrow_white.svg) right 36px center/16px no-repeat #5a94f9;
}
@media (max-width: 780px) {
  .theme .pagelink a {
    font-size: 4.615vw;
    background: url(../images/icon_arrow_white.svg) right 4.615vw center/2.051vw no-repeat #5a94f9;
  }
}
.theme_item + .theme_item {
  margin-top: 116px;
}
@media (max-width: 780px) {
  .theme_item + .theme_item {
    margin-top: 14.872vw;
  }
}
.theme_text {
  margin-top: 110px;
}
@media (max-width: 780px) {
  .theme_text {
    margin-top: 14.103vw;
  }
}
.theme_text p {
  font-size: 36px;
  font-weight: 400;
  line-height: 2.0;
}
@media (max-width: 780px) {
  .theme_text p {
    font-size: 4.615vw;
  }
}
.theme_text .smtxt {
  font-size: 70%;
}

/* ----------------------------------------------------
share
---------------------------------------------------- */
.share {
  margin-top: 112px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
@media (max-width: 780px) {
  .share {
    margin-top: 14.359vw;
  }
}
.share_item {
  margin: 0 10px;
  line-height: 0;
}
@media (max-width: 780px) {
  .share_item {
    margin: 0 1.282vw;
  }
}
.share img {
  width: 88px;
  height: auto;
}
@media (max-width: 780px) {
  .share img {
    width: 11.282vw;
  }
}
.share p {
  margin-bottom: 26px;
  width: 100%;
  font-size: 32px;
  font-weight: bold;
  text-align: center;
}
@media (max-width: 780px) {
  .share p {
    margin-bottom: 3.333vw;
    font-size: 4.103vw;
  }
}
.share + .search {
  margin-top: 120px;
}
@media (max-width: 780px) {
  .share + .search {
    margin-top: 15.385vw;
  }
}

/* ----------------------------------------------------
pageback
---------------------------------------------------- */
.toppage {
  margin: 100px 0;
  text-align: center;
}
.toppage p {
  font-size: 28px;
  font-weight: bold;
}
@media (max-width: 780px) {
  .toppage p {
    font-size: 3.59vw;
  }
}
.toppage p a {
  color: #5a94f9;
}
.toppage p a:after {
  content: "";
  display: inline-block;
  background: url(../images/icon_pageback_blue.svg) center center/100% no-repeat;
  width: 32px;
  height: 38px;
  position: relative;
  top: 12px;
  margin-left: 30px;
}
@media (max-width: 780px) {
  .toppage p a:after {
    width: 4.103vw;
    height: 4.872vw;
    top: 1.538vw;
    margin-left: 3.846vw;
  }
}
@media (max-width: 780px) {
  .toppage {
    margin: 12.821vw 0;
  }
}

.pageback {
  margin: 120px auto 60px auto;
  width: 400px;
  height: 102px;
}
@media (max-width: 780px) {
  .pageback {
    margin: 15.385vw auto 7.692vw auto;
    width: 51.282vw;
    height: 13.077vw;
  }
}
.pageback a {
  color: #5a94f9;
  font-size: 36px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  border-radius: 100px;
  border: 2px solid #5a94f9;
}
@media (max-width: 780px) {
  .pageback a {
    font-size: 4.615vw;
  }
}
.pageback a:after {
  content: "";
  display: inline-block;
  background: url(../images/icon_pageback_blue.svg) center center/100% no-repeat;
  width: 32px;
  height: 38px;
  position: relative;
  top: 3px;
  margin-left: 20px;
}
@media (max-width: 780px) {
  .pageback a:after {
    width: 4.103vw;
    height: 4.872vw;
    margin-left: 2.564vw;
  }
}

/* ----------------------------------------------------
footer
---------------------------------------------------- */
footer {
  padding: 80px 0 226px 0;
  background: #fff;
  border-bottom: 40px solid #1db6e2;
}
@media (max-width: 780px) {
  footer {
    padding: 10.256vw 0 28.974vw 0;
    border-bottom: 20px solid #1db6e2;
  }
}
footer.gb_aw {
  padding: 80px 0;
}
@media (max-width: 780px) {
  footer.gb_aw {
    padding: 10.256vw 0;
  }
}
footer .linkbtn {
  margin: 0 auto;
  width: 640px;
  height: 160px;
}
@media (max-width: 780px) {
  footer .linkbtn {
    width: 82.051vw;
    height: 20.513vw;
  }
}
footer .linkbtn a {
  font-size: 40px;
  font-weight: bold;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  background: url(../images/common/icon_arrow_white.svg) right 66px center/20px no-repeat #5a94f9;
  border-radius: 100px;
}
@media (max-width: 780px) {
  footer .linkbtn a {
    font-size: 5.128vw;
    background: url(../images/common/icon_arrow_white.svg) right 8.462vw center/2.564vw no-repeat #5a94f9;
  }
}
