html{scroll-behavior: smooth;}
body{font-family: "Noto Serif JP", serif; color: #343434; font-feature-settings: "palt"; line-height:0; background-image:url("../images/background.jpg"); background-attachment: fixed;  background-size: cover;}
a {display: block; color: inherit; text-decoration: none; font: inherit;}
.img_01,header .img_02{text-align:center;}
.img_01{width:100%; margin:0 auto;}
.img_02{width:95%; margin:0 auto;}
.img_03{width:90%; margin:0 auto;}
.img_04{width:50%; margin:0 auto;}
.img_05{width:80%; margin:0 auto;}

img{width:100%;}

.p-01{padding:1rem 0;}
.p-02{padding:2rem 0;}
.p-03{padding:3rem 0;}
.p-04{padding:4rem 0;}
.p-05{padding:5rem 0;}
.cover-01{z-index:1;}

header,main{width:700px; margin:0 auto; background-color:#FFFEF9;}
.entry{background-image:url("../images/contents-background.png"); background-size: cover;}
.entry a{padding:4rem 0; text-align:center; animation:entry 2s infinite;}
.entry2 a{padding:1rem 0 4rem 0; text-align:center; animation:entry 2s infinite;}
@keyframes entry{
  0% {
        transform: translate(0px, 3px);
    }
    5% {
        transform: translate(0px, -3px);
    }
    10% {
        transform: translate(0px, 3px);
    }
    15% {
        transform: translate(0px, -3px);
    }
    20% {
        transform: translate(0px, 3px);
    }
    25% {
        transform: translate(0px, -3px);
    }
    30% {
        transform: translate(0px, 0px);
    }
}

/*contents-01(PC)*/

/*contents-02(PC)*/
.contents-02 .contents-02-detail{background-image:url("../images/contents-background.png"); background-size: cover;}
.contents-02 .contents-02-detail ul{padding:4rem 0;}
.contents-02 .contents-02-detail li{margin-bottom:4rem;}
.contents-02 .contents-02-detail li:last-child{margin-bottom:0;}

/*contents-04(PC)*/
.contents-04 .contents-04-detail{background-image:url("../images/contents-background.png"); background-size: cover;}
.contents-04 .contents-04-detail ul{padding:3rem 0;}
.contents-04 .contents-04-detail li{margin-bottom:2rem;}
.contents-04 .contents-04-detail li:last-child{margin-bottom:0;}


.contents-07-02{background-image:url("../images/contents-background.png"); background-size: cover;}
.contents-07-02 a{padding:4rem 0; text-align:center;}


/*contents-09(PC)*/
.contents-09 .contents-09-detail{background-image:url("../images/contents-background.png"); background-size: cover;}
.contents-09 .contents-09-detail ul{padding:3rem 0;}
.contents-09 .contents-09-detail li{margin-bottom:2rem;}
.contents-09 .contents-09-detail li:last-child{margin-bottom:0;}

/*contents-12(PC)*/
.contents-11{padding:0 0 3rem 0;}


/*contents-12(PC)*/
.contents-12{padding-top:3rem;}
.contents-12 .contents-12-detail{background-image:url("../images/contents-background.png"); background-size: cover;}
.contents-12 .contents-12-detail ul{padding:3rem 0;}
.contents-12 .contents-12-detail li{margin-bottom:2rem;}
.contents-12 .contents-12-detail li:last-child{margin-bottom:0;}

/*contents-011(PC)*/

.qa-wrap{ font-size: 18px; padding-bottom:3rem;}
.qa-10 {width: 95%; margin:0 auto 1rem auto; border-radius: 5px; box-shadow: 0 4px 4px rgb(0 0 0 / 2%), 0 2px 3px -2px rgba(0 0 0 / 5%); background-color: #fff;}

.qa-10 summary { display: flex; justify-content: space-between; align-items: center; position: relative; padding:2rem 2rem 2rem 4rem; color: #333333; font-weight: 600; line-height: 150%;}
.qa-10 summary::before,
.qa-10 p::before {position: absolute; left: 1em; font-weight: 600; font-size: 1.3em; top: 2rem;}
.qa-10 summary::before {color: #DBBA8F; content: "Q.";}
.qa-10 summary::after { transform: translateY(-25%) rotate(45deg); width: 10px; height: 10px; margin-left: 10px; border-bottom: 3px solid #333333b3; border-right: 3px solid #333333b3; content: ''; transition: transform .5s;}
.qa-10[open] summary::after { transform: rotate(225deg);}
.qa-10 p { position: relative; transform: translateY(-10px); opacity: 0;  margin: 0;  padding:0.5rem 2rem 2rem 4rem; color: #333;  transition: transform .5s, opacity .5s; line-height:180%;}
.qa-10[open] p { transform: none; opacity: 1;}
.qa-10 p::before { color: #333333; line-height: 1.2; content: "A."; top: 5%;}
.animation a:hover{transform: translate3d(0, 3px, 0); transition: .3s;}

footer{background-color:#333333; color:#ffffff; padding:1rem 0; text-align:center;}

@media screen and (min-width: 700px) {
body{display:flex;}
header,main{width:650px; margin-right:15%;}
menu{position: fixed; bottom:2rem;}
menu ul{display:flex; flex-direction: column; color:#ffffff;}
menu li{margin-bottom:3rem;}
menu li:first-child{margin-bottom:5rem;}
}

@media screen and (max-width: 950px) {
menu{display:none;}
}

@media screen and (max-width: 700px) {
body,header,main{width:100%;}
img{width:100%; text-align:center;}
.entry{padding:3rem 0 2rem 0; text-align:center;}

/*contents-01(SP)*/
.contents-01 .img_03{width:100%;}
.contents-01 .img_03 ul{padding-top:6rem; padding-bottom: 2rem; background-size:cover;}
.contents-01 li{width: 95%; margin: 0 auto;}
/*contents-02(SP)*/
.contents-02 .contents-wrap01>div:last-child{margin-top:-5rem;}
.contents-02 .contents-wrap01>div:last-child img{width:25%;}
.contents-02 .contents-wrap02>div:first-child{margin-bottom:-4rem;}
.contents-02 .contents-wrap02>div:first-child img{width:25%;}

/*contents-03(SP)*/
.contents-03{width:100%;}
.contents-03 .img_03{background-size: contain; padding-top: 23rem;}
.contents-03 li{width: 95%; margin: 0 auto;}

/*contents-05(SP)*/
.contents-05 dl{background-size: contain;}
.contents-05 dt{ padding: 4rem 0 1rem 0;}
.contents-05 li{width: 95%; margin: 0 auto 1rem auto;}

/*contents-06(SP)*/
.qa-wrap{margin-top: -3rem;}
.qa-11 {width: 90%; }
}


/*アニメーション制御*/
.fadeUp{animation-name:fadeUpAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes fadeUpAnime{from {opacity: 0; transform: translateY(20px);}
  to {opacity: 1; transform: translateY(0);}
}
/* ぼかしから出現 */
.blur{
	animation-name:blurAnime;
	animation-duration:1s;
	animation-fill-mode:forwards;
}

@keyframes blurAnime{
  from {
	filter: blur(10px);
	transform: scale(1.02);
  }

  to {
	filter: blur(0);
	transform: scale(1);
  }
}

.fadeUpTrigger,.bgappearTrigger,.bgUDextendTrigger,.bgDUextendTrigger,.bgRLextendTrigger,.bgLRextendTrigger{ opacity: 0;}

