@charset "UTF-8";
/* CSS Document */
html {
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  font-size: 62.5%;
  text-align: center;
  margin: 0;
  padding: 0;
  color: #FFFFFF;
}
body {
  font-size: 1.2em;
  text-decoration: none;
}
header, footer {
  background: #fa6680;
}
ul li {
  list-style: none;
}
h1, h2, h4, ul, li {
  margin: 0;
  padding: 0;
}
img {
  max-width: 100%;
}
/*ハンバーガー基本レイアウトの調整*/
.content {
  text-align: center;
  font-size: 22px;
  height: 2000px;
  padding: 60px;
}
.content2 {
  font-size: 22px;
  padding-top: 100px;
  padding-bottom: 1000px;
  text-align: center;
}
/*ハンバーガーボタン*/
.header {
/*  position: fixed;*/
  top: 0;
  left: 0;
  width: 100%;
}
.el_humburger {
 position: absolute;
  top: 3%;
  right: 2.5%;
  padding-top: 1px;
  box-sizing: border-box;
  z-index: 10000;
  /*transition: all 0.2s ease-in-out;*/
  cursor: pointer;
  pointer-events: auto;
border-radius: 18px;
  height: 40px;
  width: 40px;
}
.el_humburger > span:first-child {
  margin: 2% auto 0;
}
.el_humburger > span {
  display: block;
  height: 1.5px;
  width: 70%;
  margin: 20% auto 0;
  transition: all 0.5s ease-in-out;
  border-radius: 3px;
  background: #ffffff;
}
.el_humburger > span:last-child {
  margin-bottom: 0;
}
.js_humburgerOpen .el_humburger > span {
  background: #ffffff;
}
.js_humburgerOpen .el_humburger > span.top {
  transform: translateY(15px) rotate(-45deg);  width: 40px;
}
.js_humburgerOpen .el_humburger > span.center {
   opacity: 0;
}
.js_humburgerOpen .el_humburger > span.bottom {
  transform: translateY(-4px) rotate(45deg);
  width: 40px;
}
.el_humburgerButton.el_humburgerButton__close {
  top: 5%;
  right: 5%;
}
.el_humburgerButton__close > span {
  display: block;
  width: 40px;
  margin: 0 auto;
  height: 4.8px;
  background: #fff;
}
.el_humburgerButton__close > span.el_humburgerLineTop {
  transform: translateY(5px) rotate(-45deg);
}
.el_humburgerButton__close > span.el_humburgerLineBottom {
  transform: translateY(-22px) rotate(45deg);
}
/*ナビゲーション*/
.uq_spNavi {
  display: none;
}
.uq_spNavi.js_appear {
/*  position: fixed;*/
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
  z-index: 9999;
}
.uq_spNavi_screen {
  position: absolute;font-family: "ヒラギノ丸ゴ ProN W4", "ヒラギノ丸ゴ Pro W4";letter-spacing: 1px;
  right: 0;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background: rgb(250, 102, 128);
  z-index: 100;
  margin-top: -80px;
  padding-top: 80px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  text-align: center;
  height: auto;
  font-size: 16px;
  font-weight: 700;
opacity: .9;
}
header .innnernav {
  padding: 7% 6% 7% 8%;
  display: flex;
  flex-direction: row;
  justify-content: center;
}
header .innnernav .item2{
  flex-basis: 20%;margin: 0 5%;
}
header .innnernav .item3 {
  flex-basis: 17%;margin: 0 5%;
}
.navigation {
padding: 5% 0 5% 0;
}
.navigation_item {
  padding: 0 0 12% 0;
}
.navigation_item > a {
  color: #ffffff;
  text-decoration: none;
}
.js_fixed {
  position: fixed;
  width: 100%;
  height: 100%;
}
/*ハンバーガー2基本レイアウトの調整*/
header .nav {
  padding: 7% 6% 5% 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
}
header .nav .item1 {
  flex-basis: 65%;
  margin-right: 4%;
}
header .nav .item2 {
  flex-basis: 5%;
  margin: 0 3% 0 0;
}
header .nav .item3 {
  flex-basis: 4.5%;
  margin: 0 3% 0 0;
}
header .nav .item4 {
  flex-basis: 10%;
}
#section1,#section2 {
  background: url("../img/bg1.jpg") repeat;
  background-size: contain;
  background-position: 0 0;
}
#section1 .main{
padding: 8%;
}
#section1 .main h1{
margin-bottom: 8%;
}
#section1 .content1 {
  text-align: center;
}
#section1 .content1 .comic {
  margin: 0 8%;
}
#section1 .content1 .comic li {
  margin-bottom: 5%;
}
#section1 .cart, #section2 .cart {
  position: relative;
  background-image: url();
}
#section1 .cart{
  padding-bottom: 65%;overflow: hidden;
}
#section2 .cart{
  padding-bottom: 80%;overflow: hidden;
}
#section1 .bg, #section2 .bg {
  display: block;
}
#section1 .cartTit {
  width: 70%;
left: 15%;
  z-index: 3;  position: absolute;
}
#section1 .cartBt, #section2 .cartBt {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  background-size: contain;
  margin: 5%;
  background: #FFFFFF;
  position: absolute;
  border-radius: 15px;
  box-shadow: 0 0 15px;
padding: 6% 4%;z-index: 2;
}
#section1 .cartBt {top: 37%;  }
#section2 .cartBt {top: 160px;}
#section1 .cart .item2, #section2 .cart .item2 {
  flex-basis: 20%;
  margin: 4% 3.8% 0 0;
}
#section1 .cart .item3, #section2 .cart .item3 {
flex-basis: 15%;
margin: 3% 3% 2% 0;
}
#section1 .cart .item4, #section2 .cart .item4 {
  flex-basis: 28%;
  margin: 4% 3.5% 0 0;
}
#section1 .cart .item5, #section2 .cart .item5 {
  flex-basis: 25%;
margin: 3.5% 0 0 0;
}
#section1 .wrap, #section2 .wrap {
    width:100%;
    margin: 0 auto;position: relative;
  }
#section1 .bg1, #section2 .bg1 {
  mix-blend-mode: screen;
  z-index: 1;
  position: absolute;
  width: 130%;
}
#section1 .bg1{
  top: -25%;
  left: -12%;
}
#section2 .bg1{
top: -14%;
left: -12%;
}
#section1 .bg2, #section2 .bg2 {
  z-index: 0;
  position: absolute;
width: 130%;
}
#section1 .bg2{
top: -4%;
left: -15%;
}
#section2 .bg2 {
top: -4%;
left: -14%;
}
#section2 {
  padding: 15% 5% 5%;color: #686868;line-height: 1.8;
}
#section2 .content2{
  background: #ffffff;padding:6% 8% 8%;text-align: left;margin-bottom: 15%;font-size: 14px;
}
#section2 .content2 h2,#section2 .content2 h2,#section2 .content2 h4,#section2 .content2 h5,#section2 .content2 .day{
	text-align: center;font-family: "ヒラギノ丸ゴ ProN W4", "ヒラギノ丸ゴ Pro W4";letter-spacing: 1px;
}
#section2 .content2 h2{
	font-size: 24px;width: 80%;margin: -15% auto 0;
}
#section2 .content2 .h2{
	font-size: 24px;margin: -23% auto 0;
}
#section2 .content2 h4 img{
	height: 20px;width: auto;margin: 0;
}
#section2 .content2 h5,#section2 .content2 .day{
	font-size: 16px;
}
#section2 .content2 h5{
border: 2px solid #ee50d1;
  color: #ee50d1;
  border-radius: 50px;
  display: table;
  padding: 0 5%;
  margin: 5% auto 2%;}
.day{
	color: #2c64cd;font-weight: bold;
}
#section2 .content2 .list{
	margin-bottom: 8%;
}
#section2 .content2 .list li span{
	color: #ee50d1;
}
#section2 .content2 .list li:first-of-type{
background: url("../img/2408_okaerihatukoi_12.jpg") no-repeat 0 2px;padding-left: 25px;
background-size: 18px;margin-bottom: 2%;
}
#section2 .content2 .list li:last-of-type{
background: url("../img/2408_okaerihatukoi_15.jpg") no-repeat 0 2px;padding-left: 25px;
background-size: 18px;margin-bottom: 2%;
}
#section2 .content2 .day span{
	font-size: 24px;
}
#section2 .content2 .bigWrap .smallWrap2 li{
	list-style: circle;
}
#section2 .content2 .bigWrap .smallWrap2 li::marker{
	    color: #686868;
}
#section2 .content2 .smallWrap2{
	margin-bottom: 10%;
}
#section2 .content2 .smallWrap2 li{
margin: 0 0 -3% 10%;
line-height: 1.4;padding: 0;
    }
#section2 .content2 .bigWrap li{
	list-style:disc;
    }
#section2 .content2 .bigWrap li::marker{
    color: #ee50d1;
    }
#section2 .content2 a{
	color: #ee50d1;
}
footer {
  padding: 5%;
  line-height: 1.5;
}
footer .footBt {
  padding: 7% 6% 7% 8%;
  display: flex;
  flex-direction: row;
  justify-content: center;
}
footer .footBt .item1 {
  flex-basis: 30%;
  margin-right: 15%;
}
footer .footBt .item2 {
  flex-basis: 10%;
  margin: 5% 8% 0 0;
}
footer .footBt .item3 {
  flex-basis: 8.5%;
  margin-top: 6%;
}
footer .logo {
  width: 20%;
  margin: 10% auto 0;
}
@media only screen and (min-width: 560px) {
  header .nav {
    padding: 5% 0 3%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 600px;
    margin: 0 auto;
  }
  header .nav .item2 {
    margin: -1% 3% 0 0;
  }
  header .nav .item3 {
    margin-top: -0.8%;
  }
  #section1, #section2 {
    background-size: auto;
  }
	#section2 {
    padding-bottom: 50px;overflow: hidden;
  }
  #section1 .wrap, #section2 .wrap {
    width: 680px;
    margin: 0 auto;
  }
#section1 .cart,#section2 .cart{
  padding-bottom: 65%;overflow:visible;
}
  #section1 .cartTit {
    margin: -350px auto -10%;
    position: absolute;
    top: 350px;
    left: 110px;
  }
  #section1 .cartBt, #section2 .cartBt {
    border-radius: 25px;
    box-shadow: 0 0 15px;
    padding: 5%;
    top: 160px;
  }
  #section2 .cartBt {
    top: 230px;
  }
 #section1 .bg1 {	
top: -20%;
left: -5%;
object-fit: cover;
height: 100px;
width: 800px;
  }	
#section2 .bg1 {
top: -30%;
left: -12%;
  }
  #section1 .bg2, #section2 .bg2 {
top: -20%;
  }
  #section2 .cartTit1 {
    left: 50px;
  }
  #section2 .cartTit2 {
    left: 140px;
    top: 145px;
  }
  footer {
    padding: 50px 0 5px;
  }
  footer .footBt {
    width: 380px;
    margin: 0 auto;
    padding: 0;
  }
  footer .logo {
    width: 55px;
    margin: 35px auto 0;
  }
}