@charset "UTF-8";

html {  box-sizing: border-box;
  -ms-overflow-style: scrollbar;}

body{background: linear-gradient(to top, #1b245d, #539ff3);
background-attachment: fixed
;min-height: 100vh;max-width:1500px; margin: auto 0;
  overflow-x: hidden;
  color: #242424;
  padding: 0;
  font-size: 17px;
    font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;}


 /* 横がはみ出さないように */
*,
*::after,
*::before {  box-sizing: border-box;}

 /* 全体設定 */
#all_container{max-width:100%;padding: 0;margin:0 auto;background-color:#fff;min-height: 100vh;}
#container{padding:30px 20px 0 20px;
margin: 20px auto 0 auto }
img {  border: none;  max-width: 100%;  height: auto;  margin: 1.5m 0;  padding: 0;}

/* 1カラム本文 */
#container{
;
 }
.container-in{padding:0 15px}
/* 1カラム本文ここまで */



a {}
a:link{color:#006cc7}
a:visited{color:#906ca8}
a:hover{color:#a2c5cb}
ol,ul {  padding: 0;}
ul { list-style: none; } 



p {  line-height: 2em;margin: 0.5em 10px 1em 10px;  padding: 0;}


h2{margin: 0 5px;	padding:0 0 0 130px;
	border-bottom: 2px solid #4166bc;border-top: 2px solid #4166bc;
	font-weight: bold;background:url('https://yurirei-sas.ever.jp/img/h2-img.png') no-repeat left center, linear-gradient(to right, #1b245d, #539ff3);line-height: 2em;font-size:110%;color:#fff}
h3{margin: 50px 3px 10px 3px;	padding: 10px 0 5px 10px;
	border-bottom: 3px solid #4166bc;
	font-weight: bold;line-height: 1em;font-size:100%}

h4{text-align: center;}

.menu {;display:none}
/* ===============================================
ヘッダーのスタイリング
=============================================== */
.header {
  height: 45px;
  background-color: #1b245d;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;margin: 0 auto
}
.header__container {

  display: flex;
  justify-content: space-between;
  align-items: center;
  height: inherit;
  color: #fff;
  padding: 0 25px;
  margin-right: auto;
  margin-left: auto;
}
.header__logo {
 padding-top:5px
}
.header__logo-top {
 padding-top:5px
}
/* ===============================================
ハンバーガーボタンのスタイリング
=============================================== */
input[type="checkbox"] {
  opacity: 0;
  visibility: hidden;
  position: absolute;
}
.hamburger {
  display: block;
  width: 50px;
  height: 80px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.hamburger span,
.hamburger span::before,
.hamburger span::after {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: 2px;
  background-color: #fff;
  transition: all 0.5s;
}
.hamburger span::before {
  top: -10px;
}
.hamburger span::after {
  bottom: -10px;
}
input[type="checkbox"]:checked + .hamburger span {
  background-color: transparent;
}
input[type="checkbox"]:checked + .hamburger span::before {
  top: 0;
  transform: rotate(45deg);
}
input[type="checkbox"]:checked + .hamburger span::after {
  bottom: 0;
  transform: rotate(-45deg);
}

/* ===============================================
メニューのスタイリング
=============================================== */
.nav {
  position: fixed;
  width: 80%;
  height: 100vh;
  top: 45px;
  right: -120%;
  background-color: rgb(27,36,96,0.8);
  color: #fff;
  padding: 50px 0;
  transition: all 0.5s;
}
.nav__lIst a {
  display: block;
  font-size: 20px;
  padding: 20px 0 20px 50px;
  text-transform: uppercase;
  text-decoration: none;
  color: #fff;
}
.nav__lIst a:hover {
  color: #0f5474;
  background-color: #fff;
}
input[type="checkbox"]:checked ~ .nav {
  right: 0;
}

/* ===============================================
ハンバーガーボタンのスタイリングここまで
=============================================== */



/* フッター */
footer {
background:url('https://yurirei-sas.ever.jp/img/footer.png')center/cover;
  padding:5px 0;margin:0}
footer img{text-align: left}
footer p{text-align: right;color:#fff}
/* フッターここまで */


@media (min-width: 768px) {
  .wrap {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
            flex-direction: row;
  }
}


/* 横幅の区切り要検証 */
@media (min-width: 768px) and (max-width: 1029px) {
#all_container{max-width: 100%; }
.header {;display:none}
/* メニュー横スクロールメニューここから */
.menu {
  height: 45px;
  background-color: #1b245d;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;margin: 0 auto;display:inline-block
}
.header__container-top {

  display: flex;
  justify-content: space-between;
  align-items: center;
  height: inherit;
  color: #fff;
  padding: 0 25px;
  margin-right: auto;
  margin-left: auto;
}
.menu ul {background:#1b245d;
display: flex;
	justify-content: center;align-items: center;
	margin:0;height:45px;padding:0}
.menu ul li {list-style: none;}
.menu ul li a {text-decoration: none;
	display: flex;
padding: 0 10px;
	font-size: 15px;
    transition: .3s;color:#fff;
 padding-bottom: 3px; /* テキストと下線の間隔 */
  background-image: linear-gradient(#fff, #fff);
  background-repeat: no-repeat;
  background-position: bottom right; /* 下線の初期位置 */
  background-size: 0 1px; /* 下線のサイズ（横幅、高さ） */
  transition: background-size 0.3s;}

.menu ul li a:hover { background-position: bottom left; /* 下線のホバー時位置 */
  background-size: 100% 1px; /* 下線の横幅を100%にする */}

.menu ul li img{padding:0}

/* 横スクロールメニューここまで */


}
/* PC用 */
@media (min-width: 1030px) {
#all_container{max-width: 1030px;
.header {;display:none}
.menu{width:1030px}

/* メニュー横スクロールメニューここから */
.menu {
  height: 45px;
  background-color: #1b245d;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;margin: 0 auto;display:inline-block
}
.header__container-top {

  display: flex;
  justify-content: space-between;
  align-items: center;
  height: inherit;
  color: #fff;
  padding: 0 25px;
  margin-right: auto;
  margin-left: auto;
}

.menu ul {background:#1b245d;
display: flex;
	justify-content: center;align-items: center;
	margin:0;height:45px;padding:0}
.menu ul li {list-style: none;}
.menu ul li a {text-decoration: none;
	display: flex;
padding: 0 10px;
	font-size: 15px;
    transition: .3s;color:#fff;
 padding-bottom: 3px; /* テキストと下線の間隔 */
  background-image: linear-gradient(#fff, #fff);
  background-repeat: no-repeat;
  background-position: bottom right; /* 下線の初期位置 */
  background-size: 0 1px; /* 下線のサイズ（横幅、高さ） */
  transition: background-size 0.3s;}

.menu ul li a:hover { background-position: bottom left; /* 下線のホバー時位置 */
  background-size: 100% 1px; /* 下線の横幅を100%にする */}

.menu ul li img{padding:0}

/* 横スクロールメニューここまで */
}

 /* 企画 */
.image_song{ text-align:center;}
.kouyasai{ text-align:center;max-width:450px}
