@charset "UTF-8";/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */

/* ----------------------------------- */
/* setting */
/* ----------------------------------- */
body, html {height: 100%; width: 100%;}
html { -webkit-text-size-adjust: 100%;}
body, h1, h2, h3, h4, h5, h6 { margin: 0;}
body { font-family: 'San Fransisco',"游ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ',Meiryo,sans-serif; font-weight: 500;}
ol, ul { list-style: none;}

@media screen and (min-width: 630px){
html { font-size: 100%;}
}
img { pointer-events: none; user-select: none; border-style: none; max-width: 100%;}
a img,button img {pointer-events: painted;}
a {
  background-color: transparent;
  -webkit-tap-highlight-color: transparent;
  text-decoration: underline;
}
.link{ transition: opacity .3s;}
@media (hover: hover) {
  .link:hover { opacity: .55 }
}
@media (hover: none) {
  .link:active{ opacity: .55 }
}
/* ----------------------------------- */
/* navi */
/* ----------------------------------- */
#g-nav{
    position:fixed;
    z-index: 999;
    top:0;
    right: -120%;
    width: 270px;
    height: 100vh;
    background-color: #a12121;
    transition: all 0.6s;
    font-size: 0;
}
#g-nav.panelactive{ right: 0;}
/*ナビゲーション*/
#g-nav ul {
  z-index: 999;
  top: 24%;
  left: 11%;
  margin: 0 auto;
  padding: 30% 0 3%;
  display: block;
}
#g-nav li{ list-style: none; text-align: center; position: relative;}
#g-nav li a{
  background: url(../images/txt_menu.png);
  background-color: #a12121;
  height: 80px;
  width: 270px;
  position: relative;
  transition: color .3s ease-in-out, background-color .3s ease-in-out;
  background-repeat: no-repeat;
  display: block;
}
#g-nav li a:hover { background-color:rgb(221, 118, 118);}
#g-nav li:nth-of-type(1) a { background-position: 0 0;}
#g-nav li:nth-of-type(2) a { background-position: 0 -80px;}
#g-nav li:nth-of-type(3) a { background-position: 0 -160px;}
#g-nav li:nth-of-type(4) a { background-position: 0 -240px;}
#g-nav li:nth-of-type(5) a { background-position: 0 -320px;}
.openbtn1{
  position: fixed;
  z-index: 9999;
  top: 10px;
  right: 10px;
  cursor: pointer;
  width: 77px;
  background: url(../images/btn_menu.png) no-repeat;
  background-size: 100% auto;
  height: 13%;
}
.openbtn1 span{
  display: inline-block;
  transition: all .4s;
  position: absolute;
  left: 21px;
  height: 5px;
  border-radius: 6px;
  background-color: #be1c1c;
  width: 46%;
  }
.openbtn1 span:nth-of-type(1) { top:15px;}
.openbtn1 span:nth-of-type(2) { top:27px;}
.openbtn1 span:nth-of-type(3) { top:40px;}
.openbtn1.active span:nth-of-type(1) {
    top: 22px;
    left: 19px;
    transform: translateY(6px) rotate(-45deg);
    width: 50%;
}
.openbtn1.active span:nth-of-type(2) { opacity: 0;}
.openbtn1.active span:nth-of-type(3) { top: 34px; left: 19px; transform: translateY(-6px) rotate(45deg); width: 50%;}
/*share*/
.p-share { font-size: 0; margin: 0 auto; text-align: center;}
.p-share__item { margin: 0 6px; transition: opacity .3s; width: 38px; display: inline-block;}
.p-share__item:hover { opacity: .55}
.p-share__item img { width: 38px; height: auto;}
/* ----------------------------------- */
/* common */
/* ----------------------------------- */
article{  font-family: "Kiwi Maru"; color: #472828;}
#bg_wrapper:before{
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-1;
  width:100%;
  height:100vh;
  background-repeat:no-repeat;
  background-image:url(../images/bg.png);
  background-size:cover;
  background-position: center;
  }

div[id^="contents-"] { 
    width: 100%;
    margin: 0 auto;
    text-align: center;
    position: relative;
}
div[id^="contents-"] section { padding: 20px 10px; outline-offset: 2px; z-index: 0; position: relative; margin-bottom: 2em;}
div[id^="contents-"] h2{ text-align: center; line-height: 0; width: 95%; margin: 0 auto;}
div[id^="contents-"] h2 img{ width: 100%; margin-bottom: 0.5em;}
div[id^="contents-"] h3 img{ margin-bottom: 1em;}
div[id^="contents-"] .ttl_top { width: 92%; position: absolute; top: 0.8%; left: 50%; 
transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
div[id^="contents-"] #contents-present .ttl_top{top: 5%;}
@media screen and (min-width: 630px){
  div[id^="contents-"] section{  max-width: 630px; z-index: 0; margin-bottom: 5em;}
  div[id^="contents-"] h2{width: 100%;}
  div[id^="contents-"] h2 img{ width: 100%; max-width: 602px;}
  div[id^="contents-"] h3 img{ width: 100%; margin-bottom: 2.5em;}}
@media screen and (max-width: 630px){div[id^="contents-"] h2 img{ width: 100%;}}
#contents_wrap { padding: 0 0 0; margin: auto; overflow-x: hidden;}
@media screen and (min-width: 630px){
#contents_wrap {
        width: 100%;
        max-width: 630px;
        border-right: 10px solid #bb4d1f;
        border-left: 10px solid #bb4d1f;
        box-shadow: lch(9.64 18.76 45.98 / 0.3) 0 0 10px 5px;
        background: #bb4d1f;
    }
}
.st_underlay { 
  width: 95%;
  margin: 0 auto;
  background: #fff;
  border: 5px solid #f1b454;
  padding: 1em;
  box-sizing: border-box;
  position: relative;
  border-radius: 20px;
}
@media screen and (min-width: 630px){.st_underlay:first-child { padding-top: 4em;}}

/* ----------------------------------- */
/* contents-main */
/* ----------------------------------- */
.site_main {
    width: 100%;
    height: auto;
    background: url(../images/pattern.jpg) repeat;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
/* ----------------------------------- */
/* contents-top */
/* ----------------------------------- */
#contents-top{ 
  width: 100%; 
  font-size: 0; 
  margin: 0 auto;
  background: url(../images/head_bg.png) no-repeat;
  z-index: 2;
  position: relative;
}
#contents-top h2 {
    width: 98%;
    display: block;
    margin: 0 auto;
}
#contents-top h2 img{
max-width: 616px;
width: 100%;
} 
@media screen and (min-width: 630px){
#contents-top{ 
    width: 630px;
}
#contents-top h2 {
    width: 100%;
    margin: 0 auto;
    text-align: center;
}
}
/* ----------------------------------- */
/* contents-pre-qa-wrap */
/* ----------------------------------- */
#contents-pre-qa-wrap { 
    width: 100%; 
    height: auto; 
    z-index: 1;
}
/* ----------------------------------- */
/* contents-entry */
/* ----------------------------------- */
#contents-entry a { display: block; margin: 0 auto; max-width: 476px; }
#contents-entry a img { filter: drop-shadow lch(19 0 0 / 0.3) 0 0 4px 3px;}
/* ----------------------------------- */
/* contents-qa-gl-wrap */
/* ----------------------------------- */
#contents-qa-gl-wrap {
    width: 100%;
    height: auto;
    padding-bottom:2rem;
    z-index: 0;
    background-position: top;
    background-attachment: fixed;
    background-size: cover;
}
@media screen and (min-width: 630px){
#contents-qa-gl-wrap {
    background-size: auto;
}
}
/* ----------------------------------- */
/* contents-qa */
/* ----------------------------------- */
#contents-qa .title { background: url(../images/icon_question.png) left 0em / 62px 62px no-repeat;  margin-bottom: 0.5em; margin-top: 1em; text-align: left; min-height: 62px;}
#contents-qa .content p { background: url(../images/icon_answer.png) left 0em / 62px 62px no-repeat; text-align: left;}
.accordion { margin: 0em auto; max-width: 82vw;}
.toggle { display: none;}
.option { position: relative; border-top: 1px solid #c7a05b;}
.option:nth-child(1) { border-top: none;}
.title,
.content { -webkit-backface-visibility: hidden; backface-visibility: hidden; transform: translateZ(0); transition: all 0.3s;}
.title { padding: 0.65em 2em 0em 4.5em; display: block; font-weight: bold; font-size: 1.2em; font-feature-settings: "palt";}
.title::after,
.title::before { content: ""; position: absolute; right: 1.25em; top: 1.25em; width: 2px; height: 0.75em; background-color: #d7502b; transition: all 0.3s;}
.title::after { transform: rotate(90deg);}
.content { max-height: 0; overflow: hidden;}
.content p { margin: 0; margin: 0; padding: 0.5em 0.5em 2em 5.6em; font-size: 1em; line-height: 1.5; font-size: 1em; line-height: 1.5;}
.toggle:checked + .title + .content { max-height: 99999px; transition: all 1.5s;}
.toggle:checked + .title::before { transform: rotate(90deg) !important;}
/* ----------------------------------- */
/* contents-guideline */
/* ----------------------------------- */
#contents-guideline section{ font-size: 90%; padding: 1em; text-align: left; box-sizing: border-box;}
#contents-guideline h3.s-title { font-weight: bold; text-align: center; margin-bottom: 1em;}
#contents-guideline .content-txt p{ margin-top: 0;}
#contents-guideline .content-txt ul { margin: 0 0 1em 0; padding: 0;}
#contents-guideline .content-txt ul li { padding-left: 1em; text-indent: -1em;}
#contents-guideline .content-txt ul li.space { letter-spacing: -0.039em;}
#contents-guideline .content-txt ul li.le_space { margin-left: 1em;}
/* ----------------------------------- */
/* contents-footer*/
/* ----------------------------------- */
#contents-footer {
    box-sizing: border-box;
    background: #000;
    text-align: center;
    padding: 5%;
    color: #fff;
}
#contents-footer .title { padding: 1em 1em 1em 0em;}
#contents-footer .content p { padding: 0.5em 2.6em 1em;}
#contents-footer .p-share__item { margin: 0 6px;}
#contents-footer .footer-logo{ margin: 20px auto 0; padding: 20px; position: relative;}
#contents-footer .footer-logo:before {
  background: linear-gradient(90deg,rgba(80,106,137,0) 0,#506a89 30%,#506a89 80%,rgba(80,106,137,0) 100%);
  top: 0;
  content: '';
  height: 0.06rem;
  left: calc(50% - 10.7rem);
  position: absolute;
  width: 20.4rem;
  border-style: solid;
  border-width: 0;
  box-sizing: border-box;
}
#contents-footer .footer-logo img { width: 100%; max-width: 300px; position: relative; left: 35px;}
@media screen and (max-width: 630px){
#contents-footer .footer-logo img { left: 0px;}
}
#contents-footer .accordion{ border: solid 1px #fff; max-width: 760px; color: #111; background: rgb(255 255 255);}
#contents-footer .close {
  padding: 0.21em 1em;
  display: block;
  margin: 0 auto 1em;
  background: #e3e1e1;
  border-radius: 100px;
  color: #000;
  font-weight: bold;
  width: 48px;
}
#contents-footer .content { text-align: left; word-break: break-all;}
#contents-footer  .content .ss-title { margin: 0; padding: 0 2.6em; font-size: 0.9em; line-height: 1.5;}
#contents-footer .footer__copyright { display: block;}
#contents-footer .ft_txt {
    line-height: 1.5;
    color: #fff;
    text-align: center;
}
#contents-footer .ft_txt ul {
    margin: 0 auto;
    text-align: center;
    display: inline;
    padding: 0;
}
#contents-footer .ft_txt a {
    text-decoration: underline;
    color: #fff;
}
#contents-footer .ft_txt li+li {
    margin: 0.2rem 0 0;
}
/* ----------------------------------- */
/* animation*/
/* ----------------------------------- */
.load-fade {
  opacity: 0; 
  visibility: hidden;
  transform: translateY(50px);
  transition: all 1s;
}
.load-fade.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}
.scroll-up {
  opacity: 0; 
  visibility: hidden;
  transform: translateY(50px);
  transition: all 1s;
}
.scroll-up.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}
.cloud { animation: floating-x 1.8s ease-in-out infinite alternate-reverse; position: absolute; z-index: -1; top: 0%;}
.cloud:nth-child(3) { animation: floating-x 1.8s ease-in-out infinite alternate-reverse;}
.cloud img { width: 100%; height: auto;}
@media screen and (max-width: 630px){
.cloud { top: 10%;}
.cloud:nth-child(3) { top: -5%;}
}
@keyframes floating-x {
  0% {
    transform: translateX(0.5%);
  }
  100% {
    transform: translateX(-0.5%);
  }
}