@charset "UTF-8";
/*=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
共通
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-*/
.flex {
  display: flex;
}
.inner {
  width: 90%;
  margin: 0 auto;
}
img {
  width: 100%;
}
figure {
  line-height: 1;
}
a,
button {
  display: block;
  transition: .3s;
}
a:hover,
button:hover {
  opacity: .6;
}
.kei {
  align-items: center;
  display: flex;
  margin-top: 20px;
  color: #808080;
  font-size: 17px;
}
.kei::before,
.kei::after {
  background-color: #808080;
  content: "";
  flex-grow: 1; /* 横幅いっぱい */
  height: 2px;
}
.kei::before {
  margin-right: 15px;
}
.kei::after {
  margin-left: 15px;
}
.fade_Box {
  transition: 0.7s;
transform: translateY(30px);
}
.fade_Box.animated {
  opacity: 1;
transform: translateY(0px);
}
.bound_Box {
  transition: 1s;
  opacity: 0;
}
.bound_Box.animated_b {
  opacity: 1;
	animation: 1s bound ease-in-out;
}
@keyframes bound {
  0%   { transform: scale(0.5);}
  50%  { transform: scale(1.3);}
  70%  { transform: scale(0.8);}
  85%  { transform: scale(1.1);}
  100% { transform: scale(1.0);}
}
.bigbound_Box {
  transition: 1s;
  opacity: 0;
   transform: scale(1.5);
}
.bigbound_Box.animated_big_b {
  opacity: 1;
	animation: 1s bound_b ease-in-out;
}
@keyframes bound_b {
  0%   { transform: scale(0.8);}
  50%  { transform: scale(1.8);}
  70%  { transform: scale(1.2);}
  85%  { transform: scale(1.6);}
  100% { transform: scale(1.5);}
}
.sp {
  display: none;
}
/*=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
新入学準備品リスト
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-*/
#mainLayout {
background-color: #fff;
}
#mainLayout .main_wrap {
    position: relative;
}
#mainLayout #admission_lp_Wrap {
    display: grid;
    z-index: 1;
    position: relative;
    grid-template-areas: "left main right";
    grid-template-columns: 1.5fr 460px 0.5fr;
    grid-template-rows: 1fr;
    max-width: 144rem;
    margin: 0 auto;
}
#mainLayout #admission_lp_Wrap::before,
#mainLayout #admission_lp_Wrap::after {
    display: block;
    z-index: -1;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    width: 100%;
    height: 100%;
    max-height: 100vh;
    content: "";
}
#mainLayout #admission_lp_Wrap::before {
    grid-area: right;
    background-image: url(/img/seo/kids/05_new_admission/bg.png);
    background-repeat: repeat;
    background-size: 55px;
    background-position: center 50%;
}
.btn_leftbox {
    grid-area: left;
    position: sticky;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
	flex-wrap: wrap;
width: 100%;
height: 100svh;
text-align: center;
margin: 0 auto;
    background-image: url(/img/seo/kids/05_new_admission/bg.png);
    background-repeat: repeat;
    background-size: 55px;
    background-position: center 50%;
}
.btn_leftbox .flex_box {
width: 300px;
max-width: 100%;
display: flex;
justify-content: space-between;
}
.btn_leftbox .flex_box .event03 {
width: 48%;
}
.btn_leftbox .flex_box .event04 {
width: 47.5%;
}
.btn_leftbox .left_navlist {
width: 100%;
background: url(/img/seo/kids/05_new_admission/left_navlist_bg.png);
background-repeat: repeat-y;
background-size: 100%;
background-position: center;
}
.btn_leftbox article {
width: 100%;
}
.btn_leftbox .leftlist {
width: 50%;
max-width: 280px;
margin: 0 auto;
}
.btn_leftbox article .left_navlist a {
display: block;
width: 90%;
margin: 0 auto;
border-bottom: 2px solid #000;
}
.btn_leftbox article .left_navlist a:last-child {
border-bottom: none;
}
.btn_leftbox .pdf_link {
width: 320px;
max-width: 100%;
margin: 20px auto 10px;
}
.btn_leftbox .list_att {
font-size: 12px;
}
.btn_leftbox .left_btnlink {
width: 60%;
max-width: 600px;
margin: 30px auto 0;
display: flex;
justify-content: space-between;
}
.btn_leftbox .left_btnlink li {
width: 49%;
}
.btn_leftbox .left_btnlink li a {
display: block;
}
#admission_lp_Wrap {
  width: 100%;
  background-color: #fff;
}
#admission_lp_Wrap #sp_Wrap {
  max-width: 768px;
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
}
#admission_lp_Wrap .head_area {
  width: 100%;
  padding: 10px 20px;
  background-color: #fff;
  box-sizing: border-box;
}
#admission_lp_Wrap .head_area h1 {
  display: block;
  max-width: 120px;
  width: 100%;
  margin: 0 auto;
}
#admission_lp_Wrap main {
  display: block;
}
/*メインビジュアル*/
#admission_lp_Wrap #main_Block {
  position: relative;
  width: 100%;
  /*aspect-ratio: 1/1.44;*/
  padding-bottom: 1px;
}
#admission_lp_Wrap #main_Block .mv {
position: relative;
}
#admission_lp_Wrap #main_Block .mv_img {
position: absolute;
left: 0;
top: 0;
}
#admission_lp_Wrap .animate__delay-01s {
 animation-delay: calc(var(--animate-delay) * 0.1);
}
#admission_lp_Wrap .main_att {
margin: 30px auto 50px;
padding-bottom: 1px;
}
#admission_lp_Wrap .itemlist {
width: 100%;
border-bottom: 2px solid #808080;
padding: 30px 0 20px;
display: flex;
justify-content: center;
flex-wrap: wrap;
}
#admission_lp_Wrap .itemlist li {
width: 90%;
font-size: min(4.3vw,20px);
color: #000;
}
#admission_lp_Wrap .itemlist li.flex2-1 {
width: 46%;
}
#admission_lp_Wrap .itemlist p {
position: relative;
padding-left: 0.7em;
margin-bottom: 10px;
}
#admission_lp_Wrap .itemlist p small {
font-size: 10px;
}
#admission_lp_Wrap .itemlist li p:before {
content: "";
position: absolute;
left: 0;
top: .5em;
font-size: 20px;
width: 5px;
height: 5px;
border-radius: 10px;
background: #000;
}
#admission_lp_Wrap .serif {
position: relative;
margin: 30px auto 70px;
}
#admission_lp_Wrap .serif.right::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 70%;
  border-style: solid;
  border-width: 25px 0 0 25px;
  border-color: transparent transparent transparent;
  translate: -50% 100%;
}
#admission_lp_Wrap .serif.right::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 70%;
  border-style: solid;
  border-width: 20.2px 0 0 20.2px;
  translate: calc(-50% + 0.4px) 100%;
}
#admission_lp_Wrap .serif.left::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 30%;
  border-style: solid;
  border-width: 25px 25px 0 0;
  border-color: transparent transparent transparent;
  translate: -50% 100%;
}
#admission_lp_Wrap .serif.left::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 30%;
  border-style: solid;
  border-width: 20.2px 20.2px 0 0;
  translate: calc(-50% - 0.4px) 100%;
}
#admission_lp_Wrap .serif .voice {
border-radius: 20px;
width: 80%;
margin: 0 auto;
}
#admission_lp_Wrap .serif .voice p {
font-size: 16px;
line-height: 1.8;
width: 85%;
padding: 20px 0;
margin: 0 auto;
}
#admission_lp_Wrap .serif figure {
position: absolute;
right: 0;
bottom: -40px;
width: 100%;
display: flex;
align-items: flex-end;
}
#admission_lp_Wrap .serif.right figure {
justify-content: flex-end;
}
#admission_lp_Wrap .serif.left figure {
justify-content: flex-start;
}
#admission_lp_Wrap .serif figure img {
width: 70px;
}
#admission_lp_Wrap .serif figcaption {
font-size: 13px;
}
#admission_lp_Wrap .serif.blue .voice {
background: #cdeeea;
}
#admission_lp_Wrap .serif.blue::after {
  border-color: #cdeeea transparent transparent;
}
#admission_lp_Wrap .serif.peach .voice {
background: #eec3df;
}
#admission_lp_Wrap .serif.peach::after {
  border-color: #eec3df transparent transparent;
}
#admission_lp_Wrap .serif.pink .voice {
background: #f9d2d0;
}
#admission_lp_Wrap .serif.pink::after {
  border-color: #f9d2d0 transparent transparent;
}
#admission_lp_Wrap .serif.green .voice {
background: #cde6d0;
}
#admission_lp_Wrap .serif.green::after {
  border-color: #cde6d0 transparent transparent;
}
#admission_lp_Wrap .serif.yellow .voice {
background: #fceea8;
}
#admission_lp_Wrap .serif.yellow::after {
  border-color: #fceea8 transparent transparent;
}
#admission_lp_Wrap .serif.purple .voice {
background: #ded1e7;
}
#admission_lp_Wrap .serif.purple::after {
  border-color: #ded1e7 transparent transparent;
}
#admission_lp_Wrap .serif.brown .voice {
background: #f6f0ed;
}
#admission_lp_Wrap .serif.brown::after {
  border-color: #f6f0ed transparent transparent;
}
/*01_入学式で使うもの*/
#admission_lp_Wrap .block01 {
width: 100%;
background: #f6f0ed;
padding:80px 0 50px;
margin-top: 1px;
}
/*02_学校生活で使うもの*/
#admission_lp_Wrap .block02 {
width: 100%;
background: #f6f0ed;
padding:30px 0 50px;
margin-top: -1px;
}
/*03_授業で使うもの*/
#admission_lp_Wrap .block03 {
width: 100%;
background: #f6f0ed;
padding:30px 0 50px;
margin-top: -1px;
}
/*04_通学で使うもの*/
#admission_lp_Wrap .block04 {
width: 100%;
background: #f6f0ed;
padding:0px 0 50px;
margin-top: -1px;
}
/*05_家で使うもの*/
#admission_lp_Wrap .block05 {
width: 100%;
background: #f6f0ed;
padding:0px 0 50px;
margin-top: -1px;
}
/*06_お役立ちアイテム*/
#admission_lp_Wrap .block06 {
width: 100%;
background: url(/img/seo/kids/05_new_admission/yellow_bg.jpg) repeat-y;
background-position: center;
background-size: 100%;
padding: 50px 0 1px;
}
#admission_lp_Wrap .block06 .item_box {
margin-bottom: 40px;
}
#admission_lp_Wrap .block06 .item_wrap {
width: 100%;
background: url(/img/seo/kids/05_new_admission/item_bg.png) repeat-y;
background-position: center;
background-size: 100%;
padding-top: 20px;
padding-bottom: 1px;
}
#admission_lp_Wrap .block06 .pink_itemlist {
width: 80%;
margin: 0px auto;
padding: 20px 0 10px;
background: #fadad8;
border-radius: 20px;
display: flex;
justify-content: center;
flex-wrap: wrap;
}
#admission_lp_Wrap .block06 .pink_itemlist li {
width: 90%;
font-size: min(4.3vw,20px);
color: #000;
}
#admission_lp_Wrap .block06 .pink_itemlist li p {
position: relative;
padding-left: 0.7em;
font-size: min(4.3vw,20px);
margin-bottom: 10px;
}
#admission_lp_Wrap .block06 .pink_itemlist li.flex2-1 {
width: 40%;
}
#admission_lp_Wrap .block06 .pink_itemlist li.flex2-1-1 {
width: 80%;
margin: 0 auto;
}
#admission_lp_Wrap .block06 .pink_itemlist li p:before {
content: "";
position: absolute;
left: 0;
top: .5em;
font-size: min(4.3vw,20px);
width: 5px;
height: 5px;
border-radius: 10px;
background: #000;
}
#admission_lp_Wrap .block06 .serif .voice {
width: 75%;
}
#admission_lp_Wrap .block06 .serif:last-child {
margin-bottom: 40px;
}
/*07_新入学準備品リスト*/
#admission_lp_Wrap .block07 {
width: 100%;
background: #fad8d6;
padding:50px 0 50px;
margin-top: -1px;
}
/*08_リンクボタンエリア*/
#admission_lp_Wrap .block08 {
width: 100%;
background: #fff;
padding:50px 0 30px;
margin-top: -1px;
}
.rela {
position: relative;
}
#admission_lp_Wrap .foot_area {
  width: 100%;
  padding: 10px 20px;
  background-color: #fff;
  box-sizing: border-box;
}
#admission_lp_Wrap .foot_area h2 {
  display: block;
  max-width: 120px;
  width: 100%;
  margin: 0 auto;
}
@media only screen and (max-width: 768px) {
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
  .pagetop_sp {
  display: block !important;
  }
  #mainLayout #admission_lp_Wrap {
  display: block;
  height: 100%;
  grid-template-columns: 1fr 100% 1fr;
  }
  #mainLayout #admission_lp_Wrap::before,
  #mainLayout #admission_lp_Wrap::after {
  display: none;
  }
  /*フッターイオンロゴ*/
  #admission_lp_Wrap .foot_area {
  padding-bottom: 70px;
  }
  /*スマホ用追従ボタン*/
  .foot_spBtn {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  width: 90%;
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  }
    .foot_spBtn a {
	display: block;
	width: 48%;
	}
}