@charset "utf-8";
/* CSS Document */
@charset "utf-8";
/* CSS Document */
:root {
--fontColor:#000;
--brownFont:#7B5807;
--primaryColor:#FDCA01;
--secondaryColor:#00A2D4;
--redColor:#DE0000;
--whiteColor:#fff;
--yellowColor:#FFEF0C;
--softyellowColor:#FFF6BE;
--shadowColor:rgba(0, 0, 0, 0.4);
--soonColor:rgba(90, 90, 90, .5);
}
/*========= ▼reset ===============*/
/* ブラウザのUAスタイルシートのすべてのスタイルを削除します、displayは除く */
*:where(:not(iframe, canvas, img, svg, video, a):not(svg *)) {all: unset;display: revert;}
/* box-sizingの優先値 */
*, *::before, *::after {box-sizing: border-box;}
/* リストのスタイル（箇条書き・番号）を削除します */
ol,ul {list-style: none;}
/* 画像がコンテナを超えないようにするため */
img {max-width: 100%;}
/* テーブルのセル間のスペースを削除します */
table {border-collapse: collapse;}
/*========= ▲reset ===============*/
a {
transition: all .5s;
-webkit-transition: all .5s;
-moz-transition: all .5s;
text-decoration: none;
    color: #333;
}
#HEADER .global{display: none;}


#lp-content{overflow: hidden;font-family:"Noto Sans JP", sans-serif;font-optical-sizing: auto; font-weight:400;font-style: normal;line-break: strict;overflow-wrap: break-word;word-wrap: break-word;word-break: break-word !important;line-height: 1.8;color: var(--fontColor);max-width: 1920px;margin: auto;background-color: #fff6be;background-image: radial-gradient(#ffffff 18%, transparent 19.5%), radial-gradient(#ffffff 18%, transparent 19.5%);background-position: 0 0, 19px 19px;background-size: 38px 38px;}
#lp-content h2 {font-family:"Noto Sans JP", sans-serif;font-optical-sizing: auto; font-weight: 400;font-style: normal; line-break: strict;overflow-wrap: break-word;word-wrap: break-word;word-break: normal !important;letter-spacing:inherit;}
#lp-content p {margin: 0;font-size: 16px;}
#lp-content ul {list-style: none;margin: 0;padding: 0;position: relative;}
.font_small {font-size: 80%;}
.font_ss{font-size: 70%;}
.font_sss{font-size: 62%;}
.font_l{font-size: 126%;}
.font_large {font-size: 140%;}
.font_ll{font-size: 165%;}
.line_center {text-align: center;}
.line_right{text-align: right;}
.line_left{text-align: left;}
.font_bold{font-weight: bold;}
.font_red {color: var(--redColor);}
.font_yellow{color: var(--yellowColor);}
/*========= LoadingのためのCSS ===============*/
.loader-wrap {position: fixed;display: flex;align-items: center;justify-content: center;width: 100%;height: 100vh;background: var(--primaryColor);z-index: 999;}
.loader, .loader:before, .loader:after {border-radius: 50%;width: 2.5em;height: 2.5em;-webkit-animation-fill-mode: both;animation-fill-mode: both;-webkit-animation: load7 1.8s infinite ease-in-out;animation: load7 1.8s infinite ease-in-out;}
.loader {color: #ffffff;font-size: 10px;margin: 80px auto;position: relative;text-indent: -9999em;-webkit-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);-webkit-animation-delay: -0.16s;animation-delay: -0.16s;}
.loader:before, .loader:after {content: '';position: absolute;top: 0;}
.loader:before {left: -3.5em;-webkit-animation-delay: -0.32s;animation-delay: -0.32s;}
.loader:after {left: 3.5em;}
@-webkit-keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
@keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
/*========= ▲LoadingのためのCSS ===============*/
section {position: relative;margin: 5% auto;padding: 0;}
.sec-inner {position: relative;max-width: 1290px; width: 96%; margin: 0 auto;}
.white-box01 {padding: 1.2em;max-width: 660px;width: 90%;background: rgba(255,255,255,0.65);text-align: center;margin: auto;}
#sec01 {position: relative;overflow: hidden;margin: 0 auto;}
#sec01 img {width: 100%;}
.termBox{position: absolute;bottom: 5%;left: 50%;transform: translateX(-50%);webkit-transform:translateX(-50%);color: var(--whiteColor);font-size: clamp(13.5px, 1.6vw, 25px);text-align: center;}
.term00{background: var(--secondaryColor);border: 2px solid var(--primaryColor);border-radius: 60px;padding: 0.1em 1em 0.3em;line-height: 1.2;}
.leadTxt{font-size: clamp(17px, 1.25vw, 20px);text-align: center;}
#sec03{}
.ulMedama{display: flex;flex-wrap: wrap;}
.ulMedama > li {flex-basis: 30.333%;margin: 0 1.5% 3%;position: relative;box-shadow: 0 3px 6px var(--shadowColor);}

.btn, a.btn,button.btn {font-size:clamp(18px, 1.6vw, 26px); ;font-weight: 500;line-height: 1.5;position: relative;display: block;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-transition: all 0.3s;transition: all 0.3s;text-align: center;vertical-align: middle;text-decoration: none;color: var(--whiteColor);}
a.btn-flat {overflow: hidden;padding: 1.2em;color: #fff;border-radius: 0;background: var(--primaryColor);border: none;}
a.btn-flat span {position: relative;z-index: 1;}
a.btn-flat:before {position: absolute;top: 0;left: calc(-100% + 10px);width: 100%;height: 100%;content: '';
  -webkit-transition: all .3s ease-in-out;transition: all .5s ease;-webkit-transform: translateX(0);transform: translateX(0);background: var(--secondaryColor);}
a.btn-flat:after {position: absolute;top: 0;right: calc(-100% + 10px);width: 100%;height: 100%;content: '';
  -webkit-transition: all .3s ease-in-out;transition: all .5s ease;-webkit-transform: translateX(0);transform: translateX(0);background: var(--secondaryColor);}

a .svg-inline--fa{
    margin-right: 5px;
}

#link01, #link02, #link03, #link04, #link05, #link06{
    padding-top: 100px;
    margin-top: -100px;
}

#sec04 .h2Area{margin-bottom: 0;}
.noticeTxt{font-size: clamp(15px, 1.15vw, 18px);;font-weight: 500;color: var(--redColor);margin: 1% auto 5%;padding-left: 1em;line-height: 1.4;}
.h2Area{margin:0 60px 5%;box-shadow: 3px 3px 10px var(--shadowColor);padding: 7px 0;text-align: center;position: relative;background: var(--secondaryColor);height:94px; display: flex;justify-content: center;align-items: center;}
.h2Area::before, .h2Area::after {position: absolute;content: "";top: 0;display: block;border: 47px solid var(--secondaryColor);z-index: 0;}
.h2Area::before{left: -40px;border-left-width: 15px;border-left-color: transparent;}
.h2Area::after{right: -40px;border-right-width: 15px;border-right-color: transparent;}
.h2wrap{position: relative;z-index: 1;}
.badgeImg{position: absolute;top: -36%;right: -1%;width: 14%;z-index: 2;}
#lp-content h2{font-size: clamp(18px, 2.3vw, 38px); font-weight: 500;text-align: center;color: var(--whiteColor);letter-spacing: inherit;line-height: 1.3;margin: 0;display: inline-block;border-bottom: 1px solid var(--softyellowColor);}
#lp-content h3{font-size: clamp(15px, 1.3vw, 20px);font-weight: normal;text-align: center;margin: 0;color: var(--yellowColor);}

#CONTENTS, body:not(.noGlobal) #CONTENTS {margin-left: 0;padding: 0;}
#FOOTER{margin-left: 0;}
#PAGEBODY{padding-bottom: 0;}
.includeSCT .item{box-shadow: 2px 3px 6px var(--shadowColor);}
.includeSCT .item:hover{transform:translateY(-5px);box-shadow: 2px 10px 20px var(--shadowColor);}
.includeSCT .name{text-align:left;line-height: 1.5;}
.includeSCT .tag{align-content: flex-start;}
#lp-content ul.action {display: none;}
#lp-content .includeSCT .item{height: auto !important;}/*カードの高さ調節*/


.flex-proList{display: flex;flex-wrap: wrap;}
.flex-proList > li {flex-basis: 25%;margin: 0 0;position: relative;btransition: all .5s;}
.flex-proList > li a {color: var(--fontColor);}
.abLabel{position: absolute;top: -7%;left: -9%;width: 48%;}
.pad-sp {display: none;}

#sec10 h4 {
    text-align: center;
    font-size: clamp(23px, 2.4vw, 38px);
    margin-bottom: 2em;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
}
#sec10 h4::before,
#sec10 h4::after{
    content: "";
    background: var(--fontColor);
    height: 1px;
    flex-grow: 1;
}
#sec10 h4::before{
    margin-right: 15px;
}
#sec10 h4::after{
    margin-left: 15px;
}
.bnrArea{
    margin: auto;
    text-align: center;
}
.bnrArea a img {
    box-shadow: 3px 6px 6px var(--shadowColor);
    transition: all .5s ease;
}


@media (any-hover: hover) {
/*:hover はここに書く*/
a.btn-flat:hover{color:var(--whiteColor) !important;} 
a.btn-flat:hover:before {-webkit-transform: translateX(50%);transform: translateX(50%);}
a.btn-flat:hover:after {-webkit-transform: translateX(-50%);transform: translateX(-50%);}
.flex-proList > li:hover a img, .ulMedama > li .imgBox:hover a img {transform: scale(1.05);opacity: 1;}
.flex-proList li:hover .triangle{border-bottom: 20px solid var(--secondaryColor);}
    .bnrArea a:hover img {
        transform: translateY(-5px);
    box-shadow: 8px 12px 12px var(--shadowColor);
    }
}


#PAGEBOTTOM .targetTop{
    z-index: 9;
}

/************************************************************/@media screen and (max-width: 1279px) {
      #HEADER .global{display: block;}
    }
/************************************************************/@media screen and (max-width: 1000px) {
}
/************************************************************/@media screen and (max-width: 820px) {
  .termBox{width: 60%;}
  .h2Area, .h2Area2, .h2Area3{height: 80px;}
  .h2Area::before, .h2Area::after{border: 40px solid var(--secondaryColor);}
  .h2Area::before {left: -40px;border-left-width: 15px;border-left-color: transparent;}
  .h2Area::after {right: -40px;border-right-width: 15px;border-right-color: transparent;}
  .badgeImg{top: -40%;right: -6%;width: 22%;}
  .h2Area2::before, .h2Area2::after{border: 40px solid var(--panel2Color);}
  .h2Area2::before {left: -40px;border-left-width: 15px;border-left-color: transparent;}
  .h2Area2::after {right: -40px;border-right-width: 15px;border-right-color: transparent;}
  .h2Area3::before, .h2Area3::after{border: 40px solid var(--panel3Color);}
  .h2Area3::before {left: -40px;border-left-width: 15px;border-left-color: transparent;}
  .h2Area3::after {right: -40px;border-right-width: 15px;border-right-color: transparent;}
    .flex-proList > li{flex-basis: 33.333%;}
.pad-cam {display: block !important;}
.pad-pc {display: block !important;}
.pc-cam {display: none !important;}
.sp-cam {display: none !important;}
}
/************************************************************/@media screen and (max-width: 700px) {
  .termBox{width: 95%;bottom: 0;}
  .leadTxt{text-align: left;margin: 1.3em;}
  .tab_area label{flex-basis: calc((100% - 20px)/2);margin: 0 5px 20px;}
  .aboutTime{margin-bottom: 7%;}
  .h2Area{margin: 0 34px 7%;}
  .badgeImg{top: -55%;right: -17%;width: 28%;}
  .flex-proList > li{flex-basis: 50%;}
  .ulMedama{flex-direction: column;}
  .ulMedama > li{width: 90%;margin: 0 auto 5%;}
.pad-sp {display: block !important;}
.pc-cam {display: none !important;}
.pad-cam {display: none !important;}
.pad-pc {display: none !important;}
}