@charset "utf-8";
/* CSS Document */

/*--------------------------------------
　Main Index
---------------------------------------*/

/*===========
inview_base
===========*/

.fadeIn_up {
  transform: translate(0, 100px);
  transition: all .6s ease-in-out;
  opacity: 0;
}
.fadeIn_up.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

.fadeIn_down {
  transform: translate(0, -100px);
  transition: all .6s ease-in-out;
  opacity: 0;
}
.fadeIn_down.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

.fadeIn_up2 {
  transform: translate(0, 100px) scale(.5,.5);
  transition: all .4s ease-in-out;
  opacity: 0;
}
.fadeIn_up2.is-show {
  transform: translate(0, 0) scale(1,1);
  opacity: 1;
}

.sideIn_up {
  transform: translate(200px, 0);
  transition: all .6s ease-in-out;
  opacity: 0;
}
.sideIn_up.is-show {
  transform: translate(0, 0);
  opacity: 1;
}




/*===========
inview_custom
===========*/

.fadeIn_up3 {
  transform: translate(0, 30%) scale(.5,.5);
  transition: all .5s cubic-bezier(.34,1.56,.64,1);
  opacity: 0;
}
.fadeIn_up3.is-show {
  transform: translate(0, 0) scale(1,1);
  opacity: 1;
}

.inview_re.delay1{
  transition-delay: 0.3s; 
}
.inview_re.delay2{
  transition-delay: 0.5s; 
}
.inview_re.delay3{
  transition-delay: 0.7s; 
}



.maskimg{
position: relative;
clip-path: circle(100% at center);
animation:maskimg2 .6s ease-in-out;
transform: translate(0, 0);
}
@keyframes maskimg2 {
0% {
clip-path: circle(0 at center);
transform: translate(0, 10%);
}
100% {
clip-path: circle(100% at center);
}
}
.maskimg.delay1{
animation-delay:1s;
}
.maskimg.delay2{
animation-delay:1.3s;
}
.maskimg.delay3{
animation-delay:1.6s;
}


/* 切り抜き食材 */

.fadeIn_up4{
transform: translate(0, 0);
animation-fill-mode: forwards;
}
.fadeIn_up4.is-show {
animation:fuwa 1.5s ease-out;
}
@keyframes fuwa {
0% {
transform: translate(0, 0);
}
33% {
transform: translate(0, -6%);
}
66% {
transform: translate(0, -3%);
}
100% {
transform: translate(0, 0);
}
}

.fadeIn_up4_rv{
transform: translate(0, 0);
animation-fill-mode: forwards;
}
.fadeIn_up4_rv.is-show {
animation:fuwa_rv 1.5s ease-out;
}
@keyframes fuwa_rv {
0% {
transform: translate(0, 0);
}
33% {
transform: translate(0, 6%);
}
66% {
transform: translate(0, 3%);
}
100% {
transform: translate(0, 0);
}
}







/*------------
　body_PC
------------*/
body {
background: #faf2ea;
min-width:1200px;
}

.forTab{
position: relative;
z-index: 1;
}
.index{
}

img:not([width]) {
/*width:100%;*/
height:auto;
max-width: 100%;
}

.areaInner{
width: 1200px;
}


.fukiYw{
position: absolute;
display: inline-block;
padding: 3rem 3.5rem;
background: #fecc00;
border: 2px solid #fff;
border-radius: 50%;
line-height: 1.6;
font-size:1.8rem;
font-weight: 700;
text-align: center;
}
.trm{
position: absolute;
}


/*--------------------------------------
　header_PC
---------------------------------------*/
#header{
position: relative;
height: 77rem;
padding: 0 0;
/*background: #eb3b08;*/
background:none;
overflow: hidden;
}

#header::before{
width: 0;
height: 0;
background: none;
border: none;
}

#header::after{
width: 0;
height: 0;
background: none;
border: none;
}


#header .inner{
position: relative;
}
#header .inner::before{
width: 0;
height: 0;
background: none;
border: none;
}

#header .inner::after{
width: 0;
height: 0;
background: none;
border: none;
}


#header .topArea{
position: absolute;
right: 20rem;
padding: 1.5rem 0 0 0;
}




#header .mvArea{
position:relative;
}

#header .mvArea h2{
position:absolute;
z-index: 1;
top: 6rem;
left: calc(50% - 70rem);
line-height: 1.7;
font-size:6.0rem;
color: #fff;
text-shadow: #00000059 1px 0 10px;
}
@media screen and (max-width: 1300px) {
#header .mvArea h2{
left: 5rem;
}
}




#header .mvArea h2 .yarigaiWrap{
display: inline-block;
margin: 0 1rem 0 -1rem;
padding: .8rem 2.5rem 1.5rem;
background: #fff;
box-shadow:none;
border-radius:1rem 1rem 3rem 1rem;
font-size:6.7rem;
line-height: 1;
text-shadow: none;
}
#header .mvArea h2 .yarigai{
background-position: 50% 46%;
background-size: 380px auto;
}

#header .mv1{position: absolute;top: 27rem;left: calc(50% - 53rem);}
#header .mv2{position: absolute;top: 10rem;left: calc(50% - 8rem);}

#header .fukiYw{top: 60rem;left: calc(50% - 61rem);transform: rotate(-4.5deg);}


#header .slider1{
position: absolute;
z-index: -1;
width: 100%;/* 重要 */
}
#header .slBox{
width: 100%;
height: 77rem;
}
#header .sl01{
background: url(./img/mv_sl01.png) 50% 0 no-repeat #eb3c08;
}
#header .sl02{
background: url(./img/mv_sl02.png) 50% 0 no-repeat #0055df;
}
#header .sl03{
background: url(./img/mv_sl03.png) 50% 0 no-repeat #f6c500;
}


/*#header .slBox img{
width: 100%;
max-height: 100%;
max-width: 100%;
object-fit: cover;
}
*/


/*------------
sect00_PC
------------*/
#sect00{
position: relative;
background: #fff;
}
#sect00 .areaInner{
padding: 20rem 10rem 27rem;
}
#sect00 .areaInner::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 110rem;
height: 10rem;
background: url(./img/eng_spm2.svg) 0 0 no-repeat;
background-size: auto 10rem;
}
#sect00 .logo{
position: absolute;
top: 18rem;
right: 20rem;
width: 283px;
}
#sect00 .sttl{
margin: 0 0 3rem;
font-size:3.0rem;
}
#sect00 p{
padding: 15px 0;
}
#sect00 .trm1{
top: 16rem;
left: -19rem;
}

/* trm */
#sect00 .trm1{
top: 16rem;
left: -19rem;
}
#sect00 .trm2{
top: 15rem;
right: -32rem;
}
#sect00 .trm3{
top: 46rem;
left: -40rem;
}
#sect00 .trm4{
top: 57rem;
right: 29rem;
}
#sect00 .trm5{
top: 43rem;
right: -18rem;
}



/*------------
contents_PC
------------*/

#contents{
margin: 0 0 0;
padding: 0 0 0;
}

.index{
width: 100%;
padding: 0 0 0;
}

.bgWt{
position: relative;
background: #fff;
}



/*------------
indexSect_PC
------------*/
.indexSect{
position: relative;
}
.indexSect::before{
}
.indexSect .areaInner::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 10rem;
background: url("./img/eng_intv.svg") 0 0 no-repeat;
background-size: auto 10rem;
}

.indexSect .sectTtlArea{
position: relative;
z-index: 1;
padding: 18rem 10rem 6rem;
}

.indexSect .sectTtl{
position: relative;
z-index: 1;
margin: 0 0 2rem;
font-size:5.0rem;
line-height: 1.4;
}


.indexSect .sectTtl a{
}

.indexSect .sectTtlArea p{
position: relative;
}

.indexSect .ulBox,
.indexSect .liBox{
position: relative;
z-index: 1;
}








/*------------
sect01_PC
------------*/
#sect01{
margin: 0 0 2rem;
}
#sect01 .areaInner{
width: 1000px;
z-index: 2;
}



/*------------
sect02_PC
------------*/
#sect02{
margin: 0 0 6rem;
    padding: 16rem 0;
    background: url(./img/sct02_bg.jpg) 50% 0 no-repeat #ffffff;
}
#sect02 h2{
position: absolute;
top:0;
left: 0;
}
#sect02 h2 .fuki{
display: block;
width: 14.4rem;
height: 8.5rem;
margin: 0 0 3rem;
padding: 1.4rem 0 0;
font-size:3.0rem;
background:url(./img/sct02_fuki_sp.svg) 0 0 no-repeat;
background-size: 14.4rem auto;
text-align: center;
color: #fff;
}
#sect02 h2 .ttlCnt{
font-family: "Zen Kaku Gothic New vt";
font-size:5.0rem;
letter-spacing: 0.1em;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}
#sect02 h2 .dotB_vt{
background: url("./img/dot_blue_vt.png") 100% 0 repeat-y;
background-size: .5rem auto;
}
#sect02 h2 .line2{
margin: 11rem 0 0;
}



#sect02 .ulBox{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 0 0 20rem;
padding: 10rem 0 0;
}
#sect02 .liBox{
width: 48rem;
margin: 0 0 4.5rem;
background: #ffffff;
}
#sect02 .liBox h3{
  padding: 11rem 3rem 2.5rem;
  background: url(./img/arrow_ccl_down1.svg) calc(100% - 3rem) calc(100% - 3rem) no-repeat #eb3b08;
  background-size: 5rem auto;
  border: 2px solid #eb3b08;
  border-radius:2rem 2rem 4rem 2rem;
  color: #fff;
  font-size: 2.8rem;
  }
#sect02 .liBox h3 .fontS{
display: block;
margin: 0 0 .5rem;
font-size:1.6rem;
}
#sect02 .liBox h3::before{
content: "";
position: absolute;
top: 3rem;
left: 0;
width: 100%;
height: 4rem;
background: url(./img/eng_sct02_1.svg) 3rem 0 no-repeat;
background-size: auto 4rem;
}
#sect02 .liBox h3::after{content: "";position: absolute;top: 9.0rem;left: 3rem;width: calc(100% - 6rem);height: .6rem;background: url("./img/dot_white.png") 0 0 space;background-size: auto .6rem;}

#sect02 .liBox p{margin: -11rem -1rem 0 1rem;padding: 12rem 3rem 2rem;background: #ffeaef;border-radius:2rem 2rem 4rem 2rem;color: #52453d;}


#sect02 .liBox:nth-child(2n){
top: 5rem;
}

#sect02 .liBox:nth-child(2) h3{
  background: url(./img/arrow_ccl_down1.svg) calc(100% - 3rem) calc(100% - 3rem) no-repeat #00bb11;
  background-size: 5rem auto;
  border: 2px solid #00bb11;}
#sect02 .liBox:nth-child(3) h3{
    background: url(./img/arrow_ccl_down1.svg) calc(100% - 3rem) calc(100% - 3rem) no-repeat #0055e0;
  background-size: 5rem auto;
border: 2px solid #0055e0;
}
#sect02 .liBox:nth-child(4) h3{
  background: url(./img/arrow_ccl_down1.svg) calc(100% - 3rem) calc(100% - 3rem) no-repeat #fecc00;
  background-size: 5rem auto;
border: 2px solid #fecc00;
}

#sect02 .liBox:nth-child(2) h3::before{
background-image: url(./img/eng_sct02_2.svg);
}
#sect02 .liBox:nth-child(3) h3::before{
background-image: url(./img/eng_sct02_3.svg);
}
#sect02 .liBox:nth-child(4) h3::before{
background-image: url(./img/eng_sct02_4.svg);
}

#sect02 .liBox:nth-child(2) h3::after{
background-image: url("./img/dot_white.png");
}
#sect02 .liBox:nth-child(3) h3::after{background-image: url("./img/dot_white.png");}
#sect02 .liBox:nth-child(4) h3::after{
background-image: url("./img/dot_white.png");
}

#sect02 .liBox:nth-child(2) p{background: #d1ffd5;}
#sect02 .liBox:nth-child(3) p{background: #d7e6ff;}
#sect02 .liBox:nth-child(4) p{background: #f6f4d9;color: #52453d;}





/*------------
sect03_PC
------------*/
#sect03{
margin: 0 0 7rem;
padding: 0 0 15rem;
}
#sect03::before{
content: "";
position: absolute;
top: 0;
left: calc(50% - 70rem);
width: calc(50% + 70rem);
height: 100%;
background: #FEF6EB;
background: linear-gradient(135deg, rgba(254, 246, 235, 1) 0%, rgba(255, 230, 240, 1) 100%);
border-radius:6rem 0 0 6rem;
}
#sect03::after{
content: "";
position: absolute;
top: 0;
left: calc(50% - 70rem);
width: calc(50% + 70rem);
height: 100%;
background: url(./img/sct02_bg.png) -1rem 3.5rem no-repeat;
border-radius:6rem 0 0 6rem;
}

#sect03 .sectTtl .line1{
display: block;
}
#sect03 .wtAnc{
margin: 0 0 4rem;
}
#sect03 .wtAnc a{
display: inline-block;
padding: 1.2rem 5.5rem 1.5rem 3rem;
border-radius: 1rem 3rem 3rem 1rem;
background: url("./img/arrow_ccl_red.svg") calc(100% - 1rem) 50% no-repeat #fff;
background-size: 2.8rem auto;
line-height: 1;
font-size:2.4rem;
font-weight: 700;
color: #eb3b08;
}

#sect03 .fukiYw{
bottom: 2rem;
right: 10rem;
padding: 2.5rem 5rem;
transform: rotate(8deg);
}


/* スライドレイアウト_swiper */

#sect03 .slideArea .liBox{
transform: scale(.8);
transform-origin: 50% 50%;
transition: all .2s ease-in-out;
}
#sect03 .slideArea .liBox.swiper-slide-active{
transform: scale(1);
}
/* arrow swiper */
#sect03 .swp-next, 
#sect03 .swp-prev{
top: 0;
width: 6rem;
height: 100%;
position: absolute;
z-index: 1;
cursor: pointer;
opacity: .7;
}
#sect03 .swp-next {
background: url("./img/arrow_ccl_bk.svg") 0% 65% no-repeat;
background-size: 6rem auto;
left: calc(50% + 30vw - 4rem);
}
#sect03 .swp-prev {
background: url("./img/arrow_ccl_bk.svg") 0% 65% no-repeat;
background-size: 6rem auto;
left: calc(50% - 30vw);
transform: scale(-1, 1);
}




/* スライドレイアウト_slick */
#sect03 .slider2{
position: relative;
z-index: 1;/* 重要 */
}

#sect03 .slick-slide {
transform: scale(.8);
/*transition: transform .3s;*/
transition: all .5s ease-in-out;
margin-left: 4vw !important;
margin-right: 4vw !important;
}
#sect03 .slick-center {
transform: scale(1);
}

/* arrow slick */
#sect03 .slider2 .slick-arrow:before{
content:""!important;
}
#sect03 .slider2 .slick-prev, #sect03 .slider2 .slick-next {
z-index:2;
top: calc(50% + 2vw);
width: 6rem;
height: 6rem;
background: url("./img/arrow_ccl_bk.svg") 0 0 no-repeat;
background-size: 6rem auto;
transform: scale(-1, 1);
opacity: .7;
}
#sect03 .slider2 .slick-next {
background: url("./img/arrow_ccl_bk.svg") 0 0 no-repeat;
background-size: 6rem auto;
transform: scale(1, 1);
}
#sect03 .slider2 .slick-prev{
left:calc(50% - 28vw)!important;
}
#sect03 .slider2 .slick-next{
left:calc(50% + 28vw - 6rem)!important;
}




/* スライド内レイアウト */
#sect03 .liBox{
padding: 0 2.5rem 2.5rem 0;
}
#sect03 .liBox .headArea{
position: relative;
margin: 0 0 2.5rem;
padding: 1.5rem 2.5rem 3rem 13rem;
background: #fff;
border-radius:4rem 2rem 2rem 2rem;
}
#sect03 .liBox .headArea h3{
font-size:2.6rem;
}
#sect03 .liBox .headArea .fontS{
display: inline-block;
margin: 0 0 .5rem;
padding: .5rem 1.3rem .8rem;
background: #0055e0;
border-radius:1.2rem;
line-height: 1;
font-size:2.0rem;
color: #fff;
}
#sect03 .sl302 .headArea .fontS{
background: #00bb11;
}
#sect03 .sl303 .headArea .fontS{
background: #eb3b08;
}

#sect03 .liBox .nailImg{
position: absolute;
top: 2rem;
left: 2.5rem;
width: 8.5rem;
}
#sect03 .liBox .nailImg img{
width: 100%;
border-radius:50%;
object-fit: cover;
}

#sect03 .liBox .flame{
}
#sect03 .liBox .flame img{
width: 100%;
height: 28vw;
border-radius:2rem;
box-shadow:2.5rem 2.5rem 0 #0055e0;
object-fit: cover;
}
#sect03 .sl302 .flame img{
box-shadow:2.5rem 2.5rem 0 #00bb11;
}
#sect03 .sl303 .flame img{
box-shadow:2.5rem 2.5rem 0 #eb3b08;
}









/* modal */
/*#header,
#sect00,
#sect01,
#sect02{
display: none;
}
*/
/*infoエリアをはじめは非表示*/
#sect03 .infoBox{
display: none;
position: relative;
}

.md_style01{
-ms-overflow-style: none; /* IE, Edge 対応 */
scrollbar-width: none;/* Firefox 対応 */
}
.md_style01::-webkit-scrollbar{
display: none;
/* Chrome, Safari 対応 */
}



/*モーダルの横幅を変更したい場合*/
.md_style01 .modaal-container{
/*max-width: 72vw;*/
max-width: 116rem;
background: none;
box-shadow: none;
}


.md_style01.modaal-wrapper .modaal-close {
/*position: fixed;*/
position: absolute;
right: 2rem;
top: 2rem;
cursor: pointer;
opacity: 1;
width: 5.6rem;
height: 5.6rem;
background: url(./img/modal_close.svg) 0 0 no-repeat;
background-size: 5.6rem auto;
border-radius: 0;
transition: all .2s ease-in-out;
}
.md_style01 .modaal-close:after, .md_style01 .modaal-close:before {
width: 0;
height: 0;
background: none;
border: none;
}

.md_style01 .modaal-content-container{
padding: 0;
}



.md_style01 .modalInner{
position: relative;
display: flex;
align-items: center;
}
.md_style01 .colBox{
width: 36rem;
padding: 3rem 4rem;
background: url(./img/sct03_modal_bg.svg) -5rem -2rem no-repeat #0055e0;
background-size: 36rem auto;
border-radius:4rem 0 0 2rem;
color: #fff;
}
.md_style01 .modal302 .colBox{
background-color: #00bb11;
}
.md_style01 .modal303 .colBox{
background-color: #eb3b08;
}

.md_style01 .colBox .colHead{
display: flex;
align-items: center;
margin: 0 0 2.5rem;
}
.md_style01 .colBox .nailImg{
width: 12rem;
height: 12rem;
margin: 0 1.5rem 0 0;
}
.md_style01 .colBox .nailImg img{
width: 100%;
border-radius:50%;
object-fit: cover;
}
.md_style01 .colBox .sttl{
margin: 0;
font-size:1.8rem;
font-weight: 500;
}
.md_style01 .colBox dl{
margin: 0 0 1rem;
}
.md_style01 .colBox dt{
display: inline;
padding: .1rem 2rem .3rem;
background: #fff;
border-radius:9999px;
font-weight: 700;
color: #0055e0;
}
.md_style01 .modal302 .colBox dt{
color: #00bb11;
}
.md_style01 .modal303 .colBox dt{
color: #eb3b08;
}

.md_style01 .colBox dd{
display: inline;
padding: 0 0 0 1.5rem;
}


.md_style01 .wtBox{
width: calc(100% - 36rem);
background: #fff;
border-radius:2rem;
}
.md_style01 .wtBox .flame{
}
.md_style01 .wtBox .flame img{
width: 100%;
height: 40rem;
border-radius:2rem 2rem 0 0;
object-fit: cover;
}
.md_style01 .wtBox .txtArea{
padding: 4.5rem 5rem 3rem;
color: #52453d;
background: url("./img/eng_intv_blue.svg") 100% -.1rem no-repeat;
background-size: auto 4.8rem;
}
.md_style01 .modal302 .wtBox .txtArea{
background-image: url("./img/eng_intv_green.svg");
}
.md_style01 .modal303 .wtBox .txtArea{
background-image: url("./img/eng_intv.svg");
}


.md_style01 .wtBox .catch{
margin: 0 0 3rem;
padding: 0 0 2.5rem;
line-height: 1.8;
font-size:2.4rem;
}
.md_style01 .wtBox .catch::before{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: .6rem;
background: url("./img/dot_blue.png") 0 100% space;
background-size: auto .6rem;
}

.md_style01 .modal302 .wtBox .catch::before{
background-image: url("./img/dot_green.png");
}
.md_style01 .modal303 .wtBox .catch::before{
background-image: url("./img/dot_red.png");
}

.md_style01 .btn-internal{
justify-content: flex-end;
}
.md_style01 .btn-internal a{
width: 46rem;
margin: 0;
}




/*------------
sect03b_PC
------------*/
#sect03b{
margin: 0 0 15rem;
padding: 0 0 31rem;
}
#sect03b .areaInner{
padding: 0 10rem;
}
#sect03b .areaInner::before{
content: "";
position: absolute;
top: 0;
left: 5rem;
width: 53rem;
height: 40rem;
background: url(./img/sct03b_cloud.png) 0 0 no-repeat;
background-size: 53rem auto;
}
#sect03b h3{
position: absolute;
top: 5rem;
left: 22rem;
height: 40rem;
line-height: 2.3;
font-size:3.2rem;
font-family: "Zen Kaku Gothic New vt";
letter-spacing: 0.1em;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}

#sect03b h3 .line2{
display: block;
margin: 7rem 0 0;
}
#sect03b h3 .yarigai2{
margin: -1.5rem 0 0;
padding: 1.5rem .2rem 1rem;
background: #fff;
border-radius:1rem 1rem 1rem 3rem;
box-shadow:.4rem .4rem 0 #eb3b08;
}


#sect03b .txtArea{
margin: 0 0 0 50rem;
padding: 16rem 0 0 0;
width: 50rem;
}

#sect03b .trms{
}
#sect03b .trm1{
top: 30rem;
left: -13rem;
}
#sect03b .trm2{
top: 46rem;
left: 8rem;
}
#sect03b .trm3{
top: 54rem;
left: 51rem;
}
#sect03b .trm4{
top: 48rem;
right: 10rem;
}
#sect03b .trm5{
top: 31rem;
right: -25rem;
}







/*------------
sect04_PC
------------*/
#sect04{
margin: 0 0 7rem;
padding: 0 0 8rem;
background: #FEE6C7;
background: linear-gradient(45deg, rgba(254, 230, 199, 1) 0%, rgba(255, 244, 200, 1) 50%, rgba(243, 244, 224, 1) 100%);
border-radius:6rem;
}
#sect04::before{
}
#sect04 .areaInner::before {
background: url("./img/eng_rsc.svg") 50% 0 no-repeat;
background-size: auto 10rem;
}

#sect04 .sectTtl{
margin: 0 0 3rem;
text-align: center;
}
#sect04 .wtAnc{
margin: 0 0 4rem;
text-align: center;
}
#sect04 .wtAnc a{
display: inline-block;
padding: 1.2rem 5.5rem 1.5rem 3rem;
border-radius: 1rem 3rem 3rem 1rem;
background: url("./img/arrow_ccl_green.svg") calc(100% - 1rem) 50% no-repeat #fff;
background-size: 2.8rem auto;
line-height: 1;
font-size:2.4rem;
font-weight: 700;
color: #00bb11;
}
#sect04 .sectTtlArea p{
text-align: center;
}


/* tab */
#sect04 .tab{
display: flex;
justify-content: space-between;
}
#sect04 .tablist{
width: 18.5rem;
padding: 1.2rem 1rem 1.4rem;
background: #fff;
border: 2px solid #0055e0;
border-radius:9999px;
line-height: 1;
font-size:1.8rem;
font-weight: 700;
text-align: center;
cursor: pointer;
}
#sect04 .tablist:hover{
opacity: .7;
}
#sect04 .tablist::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 3.5rem;
height: 100%;
background: url("./img/sct04_tab01.svg") 0 50% no-repeat;
background-size: auto 1.8rem;
}
#sect04 .tablist:nth-child(2)::before{
background-image: url("./img/sct04_tab02.svg");
}
#sect04 .tablist:nth-child(3)::before{
background-image: url("./img/sct04_tab03.svg");
}
#sect04 .tablist:nth-child(4)::before{
background-image: url("./img/sct04_tab04.svg");
}
#sect04 .tablist:nth-child(5)::before{
background-image: url("./img/sct04_tab05.svg");
}
#sect04 .tablist:nth-child(6)::before{
background-image: url("./img/sct04_tab06.svg");
}

#sect04 .tablist.active{
background: #0055e0;
color: #fff;
}
#sect04 .tablist.active::after{
content: "";
position: absolute;
bottom: -1.3rem;
left: 0;
width: 100%;
height: 1.4rem;
background: url("./img/tri1.svg") 50% 0 no-repeat;
background-size: auto 1.4rem;
}
#sect04 .tab-botom .tablist.active::after{
bottom: auto;
top: -1.3rem;
transform: scale(1, -1);
}


/* tabcontents-list */
#sect04 .tabcontents-list{
margin: 2rem 0;
background: #fff;
border-radius:4rem 2rem 2rem 2rem;
}

#sect04 .tabcontents-list h3{
margin: 0 0 4rem;
padding: 2rem 20rem 3.5rem;
background: #eb3b08;
border-radius:4rem 2rem 0 0;
text-align: center;
font-size:3.2rem;
color: #fff;
}
#sect04 .tabcontents-list h3::before{
content: "";
position: absolute;
top: 0;
left: 5rem;
width: 12rem;
height: 100%;
background: url("./img/sct04_01.svg") 0 50% no-repeat;
background-size: auto 6.6rem;
}
#sect04 .tabcontents-list:nth-child(2) h3::before{
background-image: url("./img/sct04_02.svg");
}
#sect04 .tabcontents-list:nth-child(3) h3::before{
background-image: url("./img/sct04_03.svg");
}
#sect04 .tabcontents-list:nth-child(4) h3::before{
background-image: url("./img/sct04_04.svg");
}
#sect04 .tabcontents-list:nth-child(5) h3::before{
background-image: url("./img/sct04_05.svg");
}
#sect04 .tabcontents-list:nth-child(6) h3::before{
background-image: url("./img/sct04_06.svg");
}




#sect04 .tabcontents-list h3 .fuki{
display: inline-block;
margin: 0 0 .5rem;
padding: .6rem 2.5rem .8rem;
background: #fff;
border-radius:9999px;
line-height: 1;
font-size:1.6rem;
color: #eb3b08;
}
#sect04 .tabcontents-list h3 .mainTxt{
display: block;
}
#sect04 .tabcontents-list .intro{
padding: 0 15rem;
}
#sect04 .tabcontents-list .mainArea{
position: relative;
padding: 0 10rem 3rem;
}

#sect04 .tabcontents-list .fukiYw{
z-index: 1;
top: -6rem;
right: 3.5rem;
padding: 3.5rem 2rem;
transform: rotate(8deg);
}
#sect04 .tabcontents-list .fukiYw h4{
line-height: 1.6;
}

#sect04 .tabcontents-list .intv{
margin: 0;
}


#sect04 .tabcontents-list .btn-internal{
justify-content: flex-end;
}
#sect04 .tabcontents-list .btn-internal a{
width: 44rem;
margin: 0;
}





/*------------
sect04b_PC
------------*/
#sect04b{
margin: 0 0 5rem;
padding: 0 0 20rem;
}
#sect04b .areaInner{
padding: 0 10rem;
}
#sect04b .areaInner::before{
content: "";
position: absolute;
top: 0;
left: 5rem;
width: 53rem;
height: 40rem;
background: url(./img/sct04b_cloud.png) 0 0 no-repeat;
background-size: 53rem auto;
}
#sect04b h3{
position: absolute;
top: 5rem;
left: 23rem;
height: 40rem;
line-height: 2.3;
font-size:3.2rem;
font-family: "Zen Kaku Gothic New vt";
letter-spacing: 0.1em;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}
/* Firefox hack */
@-moz-document url-prefix() {
#sect04b h3{
font-family: "Zen Kaku Gothic New";
}
#sect04b h3 .ffh{
position: relative;
top: -2px;
left: 2px;
}
}


#sect04b h3 .line2{
display: block;
margin: 4rem 0 0;
}
#sect04b h3 .line3{
display: block;
margin: 21rem 0 0;
}


#sect04b .txtArea{
position: relative;
margin: 0 0 0 39rem;
padding: 16rem 0 12rem;
}


#sect04b .flame{
position: absolute;
}
#sect04b .fl1{
top: 9rem;
left: -17rem;
width: 34rem;
}
#sect04b .fl2{
top: 38rem;
right: -25rem;
width: 30rem;
}
#sect04b .flame img{
width: 100%;
border-radius:50%;
box-shadow:1.5rem 1.5rem 0 #eb3b08;
object-fit: cover;
}
#sect04b .fl2 img{
box-shadow:-1.5rem 1.5rem 0 #0055df;
}

#sect04b .trms{
}
#sect04b .trm1{
top: -1.5rem;
right: 19rem;
}
#sect04b .trm2{
top: 0;
right: -29rem;
}
#sect04b .trm3{
top: 50rem;
left: -20rem;
}




/*------------
sect05_PC
------------*/
#sect05{
margin: 0 0 0;
padding: 0 0 12rem;
}
#sect05::before{
content: "";
position: absolute;
top: 0;
left: calc(50% - 70rem);
width: calc(50% + 70rem);
height: 100%;
background: #FEF6EB;
background: linear-gradient(-45deg, rgba(254, 246, 235, 1) 0%, rgba(255, 230, 240, 1) 100%);
border-radius:6rem 0 0 6rem;
}
#sect05::after{
content: "";
position: absolute;
top: 0;
left: calc(50% - 70rem);
width: calc(50% + 70rem);
height: 100%;
background: url(./img/sct05_bg.png) -7rem 17rem no-repeat;
border-radius:6rem 0 0 6rem;
}

#sect05 .areaInner::before {
background: url(./img/eng_vis.svg) 0 0 no-repeat;
background-size: auto 10rem;
}

#sect05 .sectTtl {
margin: 0 0 3rem;
}

#sect05 .wtAnc{
margin: 0 0 4rem;
}
#sect05 .wtAnc a{
display: inline-block;
padding: 1.2rem 5.5rem 1.5rem 3rem;
border-radius: 1rem 3rem 3rem 1rem;
background: url("./img/arrow_ccl_blue.svg") calc(100% - 1rem) 50% no-repeat #fff;
background-size: 2.8rem auto;
line-height: 1;
font-size:2.4rem;
font-weight: 700;
color: #0055e0;
}

#sect05 .ulBox{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 0 10rem;
}
#sect05 .liBox{
margin: 0 0 4rem;
width: 47rem;
}
#sect05 .liBox:nth-child(2n) {
top: 5rem;
}
#sect05 .liBox a{
padding: 2rem 2rem 2rem;
border-radius:4rem 2rem 2rem 2rem;
background: url(./img/sct05_more01.png) calc(100% - 2rem) calc(100% - 2.5rem) no-repeat #fff;
background-size: 5rem auto;
box-shadow:1rem 1rem 0 #eb3b08;
}
#sect05 .liBox:nth-child(3n) a{
background-image: url(./img/sct05_more02.png);
box-shadow:1rem 1rem 0 #00bb11;
}
#sect05 .liBox:nth-child(3n-1) a{
background-image: url(./img/sct05_more03.png);
box-shadow:1rem 1rem 0 #0055e0;
}

#sect05 .liBox .flame{
position: relative;
margin: 0 0 2.5rem;
}
#sect05 .liBox .flame::before{
content: "";
position: absolute;
bottom: -.2rem;
left: 0;
width: 100%;
height: 4.3rem;
background: url(./img/sct05_01.svg) calc(100% - 2rem) 0 no-repeat;
background-size: auto 4.3rem;
}
#sect05 .liBox:nth-child(2) .flame::before{
background-image: url(./img/sct05_02.svg);
}
#sect05 .liBox:nth-child(3) .flame::before{
background-image: url(./img/sct05_03.svg);
}
#sect05 .liBox:nth-child(4) .flame::before{
background-image: url(./img/sct05_04.svg);
}


#sect05 .liBox .flame img{
width: 100%;
height: 21rem;
border-radius:3.2rem 1.6rem 1.6rem 1.6rem;
object-fit: cover;
}
#sect05 .liBox h3{
display: inline-block;
min-width: 11rem;
margin: 0 0 1rem;
padding: .6rem 2rem .9rem;
background: #eb3b08;
border-radius: 1rem;
text-align: center;
line-height: 1;
font-size:1.8rem;
color: #fff;
}
#sect05 .liBox:nth-child(3n) h3{
background: #00bb11;
}
#sect05 .liBox:nth-child(3n-1) h3{
background: #0055e0;
}

#sect05 .liBox .catch{
font-size:2.0rem;
}



/* modal */
/*#header,
#sect00,
#sect01,
#sect02,
#sect03,
#sect04{
display: none;
}
*/
/*infoエリアをはじめは非表示*/
#sect05 .infoBox{
display: none;
position: relative;
}

.md_style02{
-ms-overflow-style: none; /* IE, Edge 対応 */
scrollbar-width: none;/* Firefox 対応 */
}
.md_style02::-webkit-scrollbar{
display: none;
/* Chrome, Safari 対応 */
}



/*モーダルの横幅を変更したい場合*/
.md_style02 .modaal-container{
/*max-width: 72vw;*/
max-width: 100rem;
background: none;
box-shadow: none;
}


.md_style02.modaal-wrapper .modaal-close {
/*position: fixed;*/
position: absolute;
right: 2rem;
top: 2rem;
cursor: pointer;
opacity: 1;
width: 5.6rem;
height: 5.6rem;
background: url(./img/modal_close.svg) 0 0 no-repeat;
background-size: 5.6rem auto;
border-radius: 0;
transition: all .2s ease-in-out;
}
.md_style02 .modaal-close:after, .md_style02 .modaal-close:before {
width: 0;
height: 0;
background: none;
border: none;
}

.md_style02 .modaal-content-container{
padding: 0;
}



.md_style02 .modalInner{
position: relative;
}
.md_style02 .wtBox{
padding: 0 0 5rem;
background: #fff;
color: #52453d;
border-radius: 2rem;
}

.md_style02 .wtBox .sttl{
width: 33rem;
margin: 0 0 3rem;
padding: 1.5rem 1rem 1.5rem 9rem;
background: #eb3b08;
border-radius:2rem 0 2rem 0;
color: #fff;
}
.md_style02 .boxGreen .wtBox .sttl{
background: #00bb11;
}
.md_style02 .boxBlue .wtBox .sttl{
background: #0055e0;
}

.md_style02 .wtBox .sttl::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 9rem;
height: 100%;
background: url("./img/sct05_01.svg") 0 50% no-repeat;
background-size: auto 3.2rem;
opacity: .5;
}
.md_style02 .modal502 .wtBox .sttl::before{
background-image: url("./img/sct05_02.svg");
}
.md_style02 .modal503 .wtBox .sttl::before{
background-image: url("./img/sct05_03.svg");
}
.md_style02 .modal504 .wtBox .sttl::before{
background-image: url("./img/sct05_04.svg");
}

.md_style02 .wtBox .catch2{
position: relative;
margin: 0 0 2.5rem;
padding: 0 0 2.5rem;
line-height: 1.7;
font-weight: 700;
font-size:2.8rem;
}
.md_style02 .wtBox .catch2::before{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: .6rem;
background: url("./img/dot_gray.png") 0 100% space;
background-size: auto .6rem;
}


.md_style02 .wtBox .topArea{
position: relative;
min-height: 33rem;
margin: 0 0 5rem;
padding: 0 39rem 0 5rem;
}

.md_style02 .port{
position: absolute;
top: -4rem;
right: 5rem;
width: 29rem;
}
.md_style02 .port img{
width: 100%;
height: 39rem;
border-radius:2rem;
object-fit: cover;
}

.md_style02 .modal502 .port img {
    object-position: 93% 50%;
}
.md_style02 .modal504 .port img {
object-position: 30% 50%;
}

.md_style02 .wtBox .boxArea{
display: flex;
justify-content: space-around;
padding: 0 5rem;
}
.md_style02 .wtBox .childBox{
position: relative;
width: 48%;
padding: 0 0 3rem;
}
.md_style02 .wtBox .childBox::before{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: calc(100% - 1.5rem);
background: #fdfbf2;
border-radius:9999px;
}
.md_style02 .wtBox .childBox h4{
margin: 0 6.5rem 1rem;
padding: .3rem 2rem .5rem;
background: #eb3b08;
border-radius:9999px;
text-align: center;
font-size:1.8rem;
color: #fff;
}
.md_style02 .boxGreen .wtBox .childBox h4{
background: #00bb11;
}
.md_style02 .boxBlue .wtBox .childBox h4{
background: #0055e0;
}


.md_style02 .wtBox .childBox ul{
margin: 0 5rem 0 6.5rem;
}
.md_style02 .wtBox .childBox li{
position: relative;
padding: 3px 0 3px 2rem;
font-size:1.6rem;
}
.md_style02 .wtBox .childBox li::before{
position: absolute;
content: "";
top: 13px;
left: 2px;
width: 12px;
height: 12px;
background: #fecc00;
border-radius: 50%;
}

.md_style02 .wtBox .intv{
margin: 4rem 5rem 3rem;
}
.md_style02 .wtBox .intvBox{
margin: 0 0 5rem;
}
.md_style02 .boxGreen .intvBox {
border: 2px solid #00bb11;
box-shadow: 1.4rem 1.4rem 0 #00bb11;
}
.md_style02 .boxBlue .intvBox {
border: 2px solid #0055e0;
box-shadow: 1.4rem 1.4rem 0 #0055e0;
}

.md_style02 .boxGreen .intv .headArea{
border-right: 2px solid #00bb11;
}
.md_style02 .boxBlue .intv .headArea{
border-right: 2px solid #0055e0;
}


.md_style02 .boxGreen .flame img {
border: 2px solid #00bb11;
}
.md_style02 .boxBlue .flame img {
border: 2px solid #0055e0;
}

.md_style02 .boxGreen .tag{
background: #00bb11;
}
.md_style02 .boxBlue .tag{
background: #0055e0;
}

.md_style02 .boxGreen .dotR {
background-image: url("./img/dot_green2.png");
}
.md_style02 .boxBlue .dotR {
background-image: url("./img/dot_blue2.png");
}



.md_style02 .btn-internal{
margin: 0 5rem;
justify-content: flex-end;
}
.md_style02 .btn-internal a{
width: 46rem;
margin: 0;
}




/*------------
sect05b_PC
------------*/
#sect05b{
position: relative;
z-index: 2;
padding: 12rem 0 17rem;
}
#sect05b .areaInner{
padding: 0 10rem;
}

#sect05b h3{
position: relative;
margin: 0 0 5rem;
padding: 5rem 0 0;
text-align: center;
line-height: 2.1;
font-size:3.0rem;
}
#sect05b h3::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 2.1rem;
background: url(./img/sct05b_ttl.svg) 50% 0 no-repeat;
background-size: auto 2.1rem;
}

#sect05b .txtArea p{
text-align: center;
}


#sect05b .trms{
}
#sect05b .trm1{
top: -20rem;
left: -1.5rem;
}
#sect05b .trm2{
top: -16rem;
right: -25rem;
}
#sect05b .trm3{
top: 15rem;
left: -13rem;
}
#sect05b .trm4{
top: 14rem;
right: 3rem;
}
#sect05b .trm5{
top: 48rem;
left: 0;
}
#sect05b .trm6{
top: 34rem;
right: -22rem;
}





/*------------
sect06_PC
------------*/
#sect06{
/*background: #faf2ea;
border-radius:6rem 6rem 0 0;*/
}
#sect06::before{
content: "";
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100rem;
background: #eb3b08;
border-radius:6rem 6rem 0 0;
}
#sect06::after{
content: "";
position: absolute;
z-index: 1;
top: 17rem;
left: 0;
width: 100%;
height: calc(100% - 17rem);
background: url(./img/sct06_ccl.svg) 0 0 no-repeat;
background-size: 100% auto;
}


#sect06 .inner{
position: relative;
padding: 0 0 5rem;
}
/*#sect06 .inner::before{
content: "";
position: absolute;
z-index: 0;
top: 24rem;
left: 0;
width: 100%;
height: calc(100% - 24rem);
background: url(./img/sct06_ccl2.svg) 0 0 no-repeat;
background-size: 100% auto;
}*/
#sect06 .inner::before{
content: "";
position: absolute;
z-index: 0;
top: 0;
left: 0;
width: 100%;
height: 5rem;
background: #fff;
}
#sect06 .inner::after{
content: "";
position: absolute;
z-index: 0;
bottom: 0;
left: 0;
width: 100%;
height: calc((100% - 24rem - 26rem) / 2);
background: #faf2ea;
}

#sect06 .areaInner{
z-index: 2;
padding: 0 0 0;
}
#sect06 .areaInner::before {
background: url(./img/eng_lum2.svg) 50% 0 no-repeat;
background-size: auto 10rem;
}


#sect06 .fuki{
position: absolute;
z-index: 1;
top: 22rem;
left: calc(50% - 6rem);
display: flex;
align-items: center;
justify-content: center;
width: 12rem;
height: 12rem;
background: #fecc00;
border-radius:50%;
border: 2px solid #fff;
line-height: 1.4;
font-size:2.2rem;
font-weight: 700;
text-align: center;
}

#sect06 .sectTtlArea{
position: relative;
padding: 37rem 0 4rem;
text-align: center;
}

#sect06 .sectTtlArea .sttl{
line-height: 2.0;
font-size:5.0rem;
}
#sect06 .sectTtlArea .sttl .line1{
display: inline-block;
margin: 0 0 1rem;
}
#sect06 .sectTtlArea .yarigaiWrap{
display: inline-block;
margin: 0 1rem 0 0;
padding: .8rem 2.5rem 1.5rem;
background: #fff;
box-shadow:1rem 1rem 0 #eb3b08;
border-radius:1rem 1rem 3rem 1rem;
font-size:5.6rem;
line-height: 1;
}
#sect06 .sectTtlArea .yarigai{
background-position: 50% 46%;
background-size: 315px auto;
}

#sect06 .sectTtlArea .catch2{
font-weight: 700;
font-size:2.4rem;
}


#sect06 .topArea{
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
margin: 0 0 4rem;
}
#sect06 .topArea::before{
content: "";
position: absolute;
z-index: -1;
top: -34rem;
right: 5rem;
width: 44rem;
height: 44rem;
background: url("./img/fukuoka2.png") 0 0 no-repeat;
background-size: 43rem auto;
}
#sect06 .topArea .imgArea{
width: 54rem;
padding: 2rem;
background: #fff;
border-radius: 2rem;
}
#sect06 .topArea .txtArea{
width: 60rem;
}
#sect06 .btns{
margin: 0 0 6rem;
}

#sect06 .wtBox{
background: #fff;
border-radius:2rem;
padding: 0 0 4rem;
}
#sect06 .wtBox .intro{
padding: 6rem 6rem 5rem;
}
#sect06 .wtBox .intro .leftArea{
width: 47rem;
float: left;
}
#sect06 .wtBox .intro .rightArea{
width: 61rem;
float: right;
margin: 6.5rem 0 0;
padding: 0 0 0 3rem;
border-left: 2px solid #dcdad8;
}
#sect06 .wtBox .intro p{ 
margin: 0;
padding: 0;
}
#sect06 .wtBox .intro .tag{
display: inline-block;
margin: 0 0 1rem;
padding: .6rem 2rem .9rem;
background: #eb3b08;
border-radius: 1rem;
text-align: center;
line-height: 1;
font-size: 1.8rem;
color: #fff;
}
#sect06 .wtBox .intro h3{
font-size: 3.6rem;
}

#sect06 .ulBox{
display: flex;
justify-content: space-between;
}
#sect06 .liBox{
width: 49.2%;
padding: 3rem 3.8rem 3rem 22rem;
border-radius:0 2rem 4rem 0;
background: #FEF4CD;
background: linear-gradient(0deg, rgba(254, 244, 205, 1) 0%, rgba(254, 252, 244, 1) 100%);
}
#sect06 .liBox:nth-child(2){
padding: 3rem 22rem 3rem 3.8rem;
border-radius:2rem 0 0 4rem;
background: #FEF6EB;
background: linear-gradient(180deg, rgba(254, 246, 235, 1) 0%, rgba(255, 230, 240, 1) 100%);
}

#sect06 .liBox .flame{
position: absolute;
top: 6rem;
left: 5.5rem;
width: 14rem;
}
#sect06 .liBox:nth-child(2) .flame{
left: auto;
right: 5.5rem;
}
#sect06 .liBox .flame img{
width: 100%;
height: 14rem;
border-radius: 50%;
border: 2px solid #0055e0;
box-shadow: .8rem .8rem 0 #0055e0;
}
#sect06 .liBox:nth-child(2) .flame img{
border: 2px solid #eb3b08;
box-shadow: .8rem .8rem 0 #eb3b08;
}

#sect06 .liBox .fontCol{
margin: 0 0 .3rem;
font-weight: 700;
color: #0055e0;
}
#sect06 .liBox:nth-child(2) .fontCol{
color: #eb3b08;
}
#sect06 .liBox .tag{
display: inline-block;
margin: 0 0 1rem;
padding: .6rem 1rem .9rem;
background: #0055e0;
border-radius: 1rem;
text-align: center;
line-height: 1;
font-size: 1.6rem;
color: #fff;
}
#sect06 .liBox:nth-child(2) .tag{
background: #eb3b08;
}

#sect06 .liBox p{
margin: 0;
}

#sect06 .talks{
margin: 8rem 10rem 5rem;
}

#sect06 .talks h4{
position: relative;
margin: 0 0 5rem;
padding: 3.5rem 0 0;
text-align: center;
line-height: 2.1;
font-size: 3.0rem;
}
#sect06 .talks h4::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 2.1rem;
background: url(./img/sct06_intv.svg) 50% 0 no-repeat;
background-size: auto 2.1rem;
}





/*------------
sect06b_PC
------------*/
#sect06b{
background: #faf2ea;
margin: 0 0 0;
padding: 0 0 15rem;
}
#sect06b .areaInner{
padding: 8rem 10rem 0;
}
#sect06b .areaInner::before{
content: "";
position: absolute;
top: 0;
left: -5rem;
width: 53rem;
height: 40rem;
background: url(./img/sct06b_cloud.png) 0 0 no-repeat;
background-size: 53rem auto;
}
#sect06b h3{
margin: 0 0 3rem;
line-height: 2.3;
font-size:3.0rem;
}

#sect06b .txtArea{
position: relative;
margin: 0 0 3rem;
}


#sect06b .flame{
position: absolute;
}
#sect06b .fl1{
top: 5.5rem;
right: 9rem;
width: 36rem;
}
#sect06b .fl2{
top: 37rem;
left: -15rem;
width: 24rem;
}
#sect06b .flame img{
width: 100%;
border-radius:50%;
box-shadow:1.5rem 1.5rem 0 #eb3b08;
object-fit: cover;
}
#sect06b .fl2 img{
box-shadow:-1.5rem 1.5rem 0 #fecc00;
}



#sect06b .trms{
}
#sect06b .trm1{
top: 1.5rem;
left: -18rem;
}
#sect06b .trm2{
top: 0;
right: -25rem;
}
#sect06b .trm3{
top: 35rem;
right: -10rem;
}
#sect06b .trm4{
top: 52rem;
right: -25rem;
}




/*------------
about_PC
------------*/
.about .inner{
border: none;
}


/* End_PC */





@media screen and (max-width: 480px) {



/*------------
　body_PC
------------*/
body {
background: #faf2ea;
min-width: 320px;
/*min-width: 480px;*/
}

img:not([width]) {
width:100%;
height:auto;
max-width: 100%;
}

.areaInner{
width: auto;
/*min-width: 320px;*/
}


.fukiYw{position: absolute;display: inline-block;padding: 2.2rem 2.2rem;background: #fecc00;border: 2px solid #fff;border-radius: 50%;line-height: 1.6;font-size:1.1rem;font-weight: 700;text-align: center;}
.trm{
position: absolute;
}





/*--------------------------------------
　header_SP
---------------------------------------*/
#header{
position: relative;
height: 56rem;
padding: 0 0;
background:none;
overflow: hidden;
}

#header .topArea{
position: absolute;
right: auto;
padding: 1.0rem 30% 1rem 3%;
}


#header .mvArea{
position:relative;
}

#header .mvArea h2{
position:absolute;
z-index: 1;
top: 6rem;
left: 3%;
line-height: 1.7;
font-size:3.0rem;
color: #fff;
}
#header .mvArea h2 .yarigaiWrap{
display: inline-block;
margin: 0 0 0;
padding: .6rem 1.0rem .7rem;
background: #fff;
box-shadow: none;
border-radius: .7rem .7rem 2.2rem .7rem;
font-size: 3.0rem;
line-height: 1;
}
#header .mvArea h2 .yarigai{
background-position: 50% 46%;
background-size: 17rem auto;
}

#header .mv1{position: absolute;top: 32.5rem;left: calc(50% - 18.5rem);width: 22.7rem;}
#header .mv2{position: absolute;top: 17.5rem;left: calc(50% - 11.5rem);width: 30rem;}

#header .fukiYw{top: 41rem;left: calc(50% - 1.5rem);transform: rotate(4.5deg);}


#header .slider1{
position: absolute;
z-index: -1;
width: 100%;/* 重要 */
}
#header .slBox{
width: 100%;
height: 56rem;
}
#header .sl01{
background: url(./img/mv_sl01_sp.png) 50% 0 no-repeat #eb3c08;
background-size: cover;
}
#header .sl02{
background: url(./img/mv_sl02_sp.png) 50% 0 no-repeat #0055df;
background-size: cover;
}
#header .sl03{
background: url(./img/mv_sl03_sp.png) 50% 0 no-repeat #f6c500;
background-size: cover;
}


#header .sps2{
position: absolute;
right: 3%;
bottom: 1.5rem;
text-align: right;
line-height: 1.6;
font-size:1.0rem;
color: #fff;
}



/*------------
sect00_SP
------------*/
#sect00{
position: relative;
background: #fff;
}
#sect00 .areaInner{
padding: 16rem 5% 18rem;
}
#sect00 .areaInner::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 3.4rem;
background: url(./img/eng_spm2.svg) 50% 0 no-repeat;
background-size: auto 3.4rem;
}
#sect00 .logo{
position: absolute;
        top: 4rem;
        right: 5%;
        width: 15.3rem;
}
#sect00 .sttl{
margin: 0 0 2rem;
line-height: 1.8;
font-size:2.0rem;
}
#sect00 p{
padding: 1.3rem 0;
}


/* trm */
#sect00 .trm{
top:auto;
bottom: auto;
left: auto;
right: auto;
}
#sect00 .trm1{
top: 7.5rem;
left: 11rem;
width: 4.3rem;
}
#sect00 .trm2{
        bottom: 7.5rem;
        left: -1.5rem;
        width: 10rem;
}
#sect00 .trm3{
top: 3rem;
left: -10rem;
width: 19rem;
}
#sect00 .trm4{
bottom: 4rem;
left: 12rem;
width: 13rem;
}
#sect00 .trm5{
bottom: 5.5rem;
        right: -5.5rem;
        width: 15rem;
}



/*------------
contents_SP
------------*/

#contents{
}

.index{
width: 100%;
padding: 0 0 0;
}









/*------------
indexSect_SP
------------*/

.indexSect{
position: relative;
}
.indexSect::before{
}

.indexSect .areaInner::before{
content: "";
position: absolute;
top: 0;
left: 5%;
width: 95%;
height: 3.4rem;
background: url("./img/eng_intv.svg") 0 0 no-repeat;
background-size: auto 3.4rem;
}

.indexSect .sectTtlArea{
position: relative;
z-index: 1;
padding: 6rem 5% 5rem;
}

.indexSect .sectTtl{
position: relative;
z-index: 1;
margin: 0 0 3rem;
font-size:2.7rem;
line-height: 1.4;
}


.indexSect .sectTtl a{
}


.indexSect .sectTtlArea p{
position: relative;
}





/*------------
sect01_SP
------------*/
#sect01{
margin: 0 0 3rem;
}
#sect01 .areaInner{
width: auto;
z-index: 2;
}





/*------------
sect02_SP
------------*/
#sect02{
margin: 0 0 7rem;
	background: url(./img/sct02_bg_sp.jpg) top right no-repeat #ffffff;
        background-size: 100%;
        padding: 0 5%;
    }

#sect02 h2{
position: static;
top:0;
right: 0;
line-height: 1.7;
}
#sect02 h2 .fuki{
display: block;
width: 7.6rem;
height: 4.4rem;
margin: 0 0 1rem;
padding: .7rem 0 0;
font-size:1.5rem;
background: url(./img/sct02_fuki_sp.svg) 0 0 no-repeat;
background-size: 7.6rem auto;
text-align: center;
color: #fff;
}
#sect02 h2 .ttlCnt{
font-family: "Zen Kaku Gothic New";
font-size:2.7rem;
letter-spacing: 0;
-ms-writing-mode: tb-lr;
writing-mode: horizontal-tb;
}
#sect02 h2 .dotB_vt{
margin: 0 0 .2rem;
padding: 0 0 .5rem;
background: url("./img/dot_blue.png") 0 100% repeat-x;
background-size: auto .5rem;
}
#sect02 h2 .line2{
margin: 0 0 0;
}



#sect02 .ulBox{
display: block;
margin: 0 0 0;
padding: 2rem 0 0;
}
#sect02 .liBox{
width: auto;
margin: 0 0 2rem;
}

#sect02 .liBox h3{
padding: 7.5rem 5% 2rem;
background: url("./img/arrow_ccl_down1.svg") calc(100% - 5%) calc(100% - 3rem) no-repeat #eb3b08;
background-size: 3rem auto;
border: 2px solid #eb3b08;
border-radius:1.5rem 1.5rem 3rem 1.5rem;
font-size:2.2rem;
}
#sect02 .liBox h3 .fontS{
display: block;
margin: 0 0 .2rem;
font-size:1.3rem;
}
#sect02 .liBox h3::before{
content: "";
position: absolute;
top: 2.2rem;
left: 5%;
width: 95%;
height: 2.7rem;
background: url(./img/eng_sct02_1.svg) 0 0 no-repeat;
background-size: auto 2.7rem;
}
#sect02 .liBox h3::after{
content: "";
position: absolute;
top: 6.0rem;
left: 5%;
width: calc(100% - 10%);
height: .5rem;
background: url("./img/dot_white.png") 0 0 space;
background-size: auto .5rem;
}

#sect02 .liBox p{
margin: -11rem -1rem 0 1rem;
padding: 12rem 5% 2rem;
background: #ffeaef;
border-radius:1.5rem 1.5rem 3rem 1.5rem;
font-size:1.4rem;
color: #52453d;
}


#sect02 .liBox:nth-child(2n){
top: 0;
}

#sect02 .liBox:nth-child(2) h3{
border: 2px solid #00bb11;
	background: url(./img/arrow_ccl_down1.svg) calc(100% - 3rem) calc(100% - 3rem) no-repeat #00bb11;
        background-size: 3rem auto;
}
#sect02 .liBox:nth-child(3) h3{
border: 2px solid #0055e0;
	background: url(./img/arrow_ccl_down1.svg) calc(100% - 3rem) calc(100% - 3rem) no-repeat #0055e0;
        background-size: 3rem auto;
}
#sect02 .liBox:nth-child(4) h3{
border: 2px solid #fecc00;
	background: url(./img/arrow_ccl_down1.svg) calc(100% - 3rem) calc(100% - 3rem) no-repeat #fecc00;
        background-size: 3rem auto;
}

#sect02 .liBox:nth-child(2) h3::before{
background-image: url(./img/eng_sct02_2.svg);
}
#sect02 .liBox:nth-child(3) h3::before{
background-image: url(./img/eng_sct02_3.svg);
}
#sect02 .liBox:nth-child(4) h3::before{
background-image: url(./img/eng_sct02_4.svg);
}


#sect02 .liBox:nth-child(2) p{
background: #d1ffd5;
}
#sect02 .liBox:nth-child(3) p{
background: #d7e6ff;
}
#sect02 .liBox:nth-child(4) p{
background: #f6f4d9;
}




/*------------
sect03_SP
------------*/
#sect03{
margin: 0 0 3.5rem;
padding: 0 0 5rem;
}
#sect03::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #FEF6EB;
background: linear-gradient(135deg, rgba(254, 246, 235, 1) 0%, rgba(255, 230, 240, 1) 100%);
border-radius:3rem 0 0 3rem;
}
#sect03::after{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(./img/sct02_bg_sp.png) 0 4rem no-repeat;
background-size: 100% auto;
border-radius:3rem 0 0 3rem;
}

#sect03 .sectTtlArea {
padding: 6rem 5% 7rem;
}
#sect03 .sectTtl .line1{
display: block;
font-size:2.2rem;
}
#sect03 .wtAnc{
margin: 0 0 3rem;
}
#sect03 .wtAnc a{
display: inline-block;
padding: 1rem 12% 1.2rem 6%;
border-radius: 1rem 3rem 3rem 1rem;
background: url("./img/arrow_ccl_red.svg") calc(100% - 1rem) 50% no-repeat #fff;
background-size: 2rem auto;
line-height: 1.4;
font-size:1.6rem;
font-weight: 700;
color: #eb3b08;
}

#sect03 .fukiYw{
bottom: 1rem;
right: 2%;
padding: 1.5rem 2.6rem;
transform: rotate(8deg);
}




/* スライドレイアウト_swiper */

#sect03 .slideArea .liBox{
transform: scale(.9);
transform-origin: 50% 50%;
transition: all .2s ease-in-out;
}
#sect03 .slideArea .liBox.swiper-slide-active{
transform: scale(1);
}
/* arrow swiper */
#sect03 .swp-next, 
#sect03 .swp-prev{
top: 0;
width: 3rem;
height: 100%;
position: absolute;
z-index: 1;
cursor: pointer;
opacity: .7;
}
#sect03 .swp-next {
background: url("./img/arrow_ccl_bk.svg") 0% 65% no-repeat;
background-size: 3rem auto;
left: auto;
right: 5%;
}
#sect03 .swp-prev {
background: url("./img/arrow_ccl_bk.svg") 0% 65% no-repeat;
background-size: 3rem auto;
left: 5%;
transform: scale(-1, 1);
}


/* スライドレイアウト_slick */
#sect03 .slider2{
position: relative;
z-index: 1;/* 重要 */
}
#sect03 .slick-slide {
transform: scale(.98);
transition: all .5s ease-in-out;
margin-left: 0.5rem!important;
margin-right: 0.5rem!important;
}
#sect03 .slick-center {
transform: scale(1);
}
/* arrow slick */
#sect03 .slider2 .slick-arrow:before{
content:""!important;
}
#sect03 .slider2 .slick-prev, #sect03 .slider2 .slick-next {
z-index:2;
top: calc(50% + 2vw);
width: 3rem;
height: 3rem;
background: url("./img/arrow_ccl_bk.svg") 0 0 no-repeat;
background-size: 3rem auto;
transform: scale(-1, 1);
opacity: .7;
}
#sect03 .slider2 .slick-next {
background: url("./img/arrow_ccl_bk.svg") 0 0 no-repeat;
background-size: 3rem auto;
transform: scale(1, 1);
}
#sect03 .slider2 .slick-prev{
left:5%!important;
}
#sect03 .slider2 .slick-next{
left:auto!important;
right: 5%!important;
}


/* スライド内レイアウト */
#sect03 .liBox{
padding: 0 2.5rem 2.5rem 0;
}
#sect03 .liBox .headArea{
position: relative;
margin: 0 0 1.5rem;
padding: 1rem 2rem 1.0rem 7rem;
background: #fff;
border-radius:3rem 1.5rem 1.5rem 1.5rem;
}
#sect03 .liBox .headArea h3{
font-size:1.5rem;
}
#sect03 .liBox .headArea .fontS{
display: inline-block;
margin: 0 0 .3rem;
padding: .4rem 1rem .6rem;
background: #0055e0;
border-radius:1.2rem;
line-height: 1;
font-size:1.2rem;
color: #fff;
}
#sect03 .sl302 .headArea .fontS{
background: #00bb11;
}
#sect03 .sl303 .headArea .fontS{
background: #eb3b08;
}

#sect03 .liBox .nailImg{
position: absolute;
top: 1rem;
left: 1.5rem;
width: 4.6rem;
}
#sect03 .liBox .nailImg img{
width: 100%;
border-radius:50%;
object-fit: cover;
}

#sect03 .liBox .flame{
}
#sect03 .liBox .flame img{
width: auto;
height: 18rem;
border-radius:1.5rem;
box-shadow:1rem 1rem 0 #0055e0;
object-fit: cover;
}
#sect03 .sl302 .flame img{
box-shadow:1rem 1rem 0 #00bb11;
}
#sect03 .sl303 .flame img{
box-shadow:1rem 1rem 0 #eb3b08;
}










/* modal */

/*#header,
#sect00,
#sect01,
#sect02{
display: none;
}
*/
/*infoエリアをはじめは非表示*/
#sect03 .infoBox{
display: none;
position: relative;
}

.md_style01{
-ms-overflow-style: none; /* IE, Edge 対応 */
scrollbar-width: none;/* Firefox 対応 */
}
.md_style01::-webkit-scrollbar{
display: none;
/* Chrome, Safari 対応 */
}



/*モーダルの横幅を変更したい場合*/
.md_style01 .modaal-container{
/*max-width: 72vw;*/
max-width: 90vw;
background: none;
box-shadow: none;
}


.md_style01.modaal-wrapper .modaal-close {
/*position: fixed;*/
position: fixed ;
right: 1rem;
top: 1rem;
cursor: pointer;
opacity: 1;
width: 4rem;
height: 4rem;
background: url(./img/modal_close.svg) 0 0 no-repeat;
background-size: 4rem auto;
border-radius: 0;
transition: all .2s ease-in-out;
}
.md_style01 .modaal-close:after, .md_style01 .modaal-close:before {
width: 0;
height: 0;
background: none;
border: none;
}

.md_style01 .modaal-content-container{
padding: 0;
}



.md_style01 .modalInner{
position: relative;
display: block;
align-items: center;
}
.md_style01 .colBox{
width: 90%;
margin: 0 auto;
padding: 1.5rem 5%;
background: url(./img/sct03_modal_bg.svg) -3rem -1rem no-repeat #0055e0;
background-size: 28rem auto;
border-radius:3rem 2rem 0 0;
color: #fff;
}
.md_style01 .modal302 .colBox{
background-color: #00bb11;
}
.md_style01 .modal303 .colBox{
background-color: #eb3b08;
}

.md_style01 .colBox .colHead{
display: flex;
align-items: center;
margin: 0 0 1rem;
}
.md_style01 .colBox .nailImg{
width: 8.5rem;
height: 8.5rem;
margin: 0 1.5rem 0 0;
}
.md_style01 .colBox .nailImg img{
width: 100%;
border-radius:50%;
object-fit: cover;
}
.md_style01 .colBox .sttl{
margin: 0;
font-size:1.8rem;
font-weight: 500;
}
.md_style01 .colBox dl{
margin: 0 0 1rem;
}
.md_style01 .colBox dt{
display: inline;
padding: .1rem 1.5rem .3rem;
background: #fff;
border-radius:9999px;
font-weight: 700;
font-size:1.4rem;
color: #0055e0;
}
.md_style01 .modal302 .colBox dt{
color: #00bb11;
}
.md_style01 .modal303 .colBox dt{
color: #eb3b08;
}

.md_style01 .colBox dd{
display: inline;
padding: 0 0 0 .8rem;
font-size:1.4rem;
}


.md_style01 .wtBox{
width: auto;
background: #fff;
border-radius:1.5rem;
}
.md_style01 .wtBox .flame{
}
.md_style01 .wtBox .flame img{
width: 100%;
height: 17rem;
border-radius:1.5rem 1.5rem 0 0;
object-fit: cover;
}
.md_style01 .wtBox .txtArea{
padding: 4.5rem 5% 3rem;
background: url("./img/eng_intv_blue.svg") 100% -.1rem no-repeat;
background-size: auto 2.4rem;
}
.md_style01 .modal302 .wtBox .txtArea{
background-image: url("./img/eng_intv_green.svg");
}
.md_style01 .modal303 .wtBox .txtArea{
background-image: url("./img/eng_intv.svg");
}


.md_style01 .wtBox .catch{
margin: 0 0 2rem;
padding: 0 0 2.5rem;
line-height: 1.8;
font-size:1.8rem;
}
.md_style01 .wtBox .catch::before{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: .5rem;
background: url("./img/dot_blue.png") 0 100% space;
background-size: auto .5rem;
}

.md_style01 .modal302 .wtBox .catch::before{
background-image: url("./img/dot_green.png");
}
.md_style01 .modal303 .wtBox .catch::before{
background-image: url("./img/dot_red.png");
}

.md_style01 .btn-internal{
width: 100%;
justify-content:center;
}
.md_style01 .btn-internal a{
width: 95%;
margin: 0;
}




/*------------
sect03b_SP
------------*/
#sect03b{
margin: 0 0 0;
padding: 0 0 0;
}
#sect03b .areaInner{
padding: 3rem 5% 18rem;
}
#sect03b .areaInner::before{
content: "";
position: absolute;
top: 0;
left: -2rem;
width: 37rem;
height: 30rem;
background: url(./img/sct03b_cloud.png) 0 0 no-repeat;
background-size: 37rem auto;
}
#sect03b h3{
position: relative;
top: 0;
left: 0;
height: auto;
margin: 0 auto 0;
line-height: 2.3;
font-size:2.2rem;
font-family: "Zen Kaku Gothic New vt";
letter-spacing: 0.1em;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}

#sect03b h3 .line2{
display: block;
margin: 7rem 0 0;
}
#sect03b h3 .yarigai2{
margin: -1.5rem 0 0;
padding: 1.5rem .1rem 1rem;
background: #fff;
border-radius:.75rem .75rem .75rem 1.5 rem;
box-shadow:.4rem .4rem 0 #eb3b08;
}


#sect03b .txtArea{
margin: 0 0 0;
padding: 0 0 0;
width: auto;
}


#sect03b .trm{
top:auto;
bottom: auto;
left: auto;
right: auto;
}

#sect03b .trms{
}
#sect03b .trm1{
top: 23rem;
right: 2.5rem;
width: 6.5rem;
}
#sect03b .trm2{
bottom: 8.5rem;
left: -2rem;
width: 11rem;
}
#sect03b .trm3{
bottom: 6.5rem;
left: 10.5rem;
width: 9rem;
}
#sect03b .trm4{
bottom: 7.0rem;
right: 6rem;
width: 9rem;
}
#sect03b .trm5{
bottom: 13rem;
right: -5rem;
width: 13rem;
}







/*------------
sect04_SP
------------*/
#sect04{
margin: 0 0 3rem;
padding: 0 0 3rem;
background: #FEE6C7;
background: linear-gradient(45deg, rgba(254, 230, 199, 1) 0%, rgba(255, 244, 200, 1) 50%, rgba(243, 244, 224, 1) 100%);
border-radius:3rem;
}
#sect04::before{
}
#sect04 .areaInner::before {
background: url("./img/eng_rsc.svg") 50% 0 no-repeat;
background-size: auto 3.4rem;
}

#sect04 .sectTtlArea {
padding: 6rem 5% 2.5rem;
}

#sect04 .sectTtl{
margin: 0 0 3rem;
text-align: center;
}
#sect04 .wtAnc{
margin: 0 0 3rem;
text-align: center;
}
#sect04 .wtAnc a{
display: block;
padding: 1rem 12% 1.2rem 6%;
border-radius: 1rem 3rem 3rem 1rem;
background: url("./img/arrow_ccl_green.svg") calc(100% - 1rem) 50% no-repeat #fff;
background-size: 2rem auto;
line-height: 1.4;
font-size:1.6rem;
font-weight: 700;
color: #00bb11;
}
#sect04 .sectTtlArea p{
text-align: justify;
}


/* tab */
#sect04 .tab{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 0 5%;
}
#sect04 .tablist{
width: 31%;
margin: 0 0 1.5rem;
padding: 1.2rem 1rem 1.3rem;
background: #fff;
border: 2px solid #0055e0;
border-radius:9999px;
line-height: 1;
font-size:1.2rem;
font-weight: 700;
text-align: center;
cursor: pointer;
}
#sect04 .tablist:hover{
opacity: .7;
}
#sect04 .tablist::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 2rem;
height: 100%;
background: url("./img/sct04_tab01.svg") 0 50% no-repeat;
background-size: auto 1.2rem;
}
#sect04 .tablist:nth-child(2)::before{
background-image: url("./img/sct04_tab02.svg");
}
#sect04 .tablist:nth-child(3)::before{
background-image: url("./img/sct04_tab03.svg");
}
#sect04 .tablist:nth-child(4)::before{
background-image: url("./img/sct04_tab04.svg");
}
#sect04 .tablist:nth-child(5)::before{
background-image: url("./img/sct04_tab05.svg");
}
#sect04 .tablist:nth-child(6)::before{
background-image: url("./img/sct04_tab06.svg");
}

#sect04 .tablist.active{
background: #0055e0;
color: #fff;
}
#sect04 .tablist.active::after{
content: "";
position: absolute;
bottom: -1.0rem;
left: 0;
width: 100%;
height: 1.1rem;
background: url("./img/tri1.svg") 50% 0 no-repeat;
background-size: auto 1.1rem;
}
#sect04 .tab-botom .tablist.active::after{
bottom: auto;
top: -1.0rem;
transform: scale(1, -1);
}


/* tabcontents-list */
#sect04 .tabcontents-list{
margin: 1rem 5% 3rem;
background: #fff;
border-radius:3rem 2rem 2rem 2rem;
}

#sect04 .tabcontents-list h3{
margin: 0 0 2rem;
padding: 1.6rem 5% 2.5rem;
background: #eb3b08;
border-radius:3rem 2rem 0 0;
text-align: center;
font-size:2.2rem;
color: #fff;
}
#sect04 .tabcontents-list h3::before{
content: "";
position: absolute;
top: 0;
left: 5%;
width: 7.5rem;
height: 100%;
background: url("./img/sct04_01.svg") 0 10% no-repeat;
background-size: auto 3.3rem;
}
#sect04 .tabcontents-list:nth-child(2) h3::before{
background-image: url("./img/sct04_02.svg");
}
#sect04 .tabcontents-list:nth-child(3) h3::before{
background-image: url("./img/sct04_03.svg");
}
#sect04 .tabcontents-list:nth-child(4) h3::before{
background-image: url("./img/sct04_04.svg");
}
#sect04 .tabcontents-list:nth-child(5) h3::before{
background-image: url("./img/sct04_05.svg");
}
#sect04 .tabcontents-list:nth-child(6) h3::before{
background-image: url("./img/sct04_06.svg");
}




#sect04 .tabcontents-list h3 .fuki{
display: inline-block;
margin: 0 0 1rem;
padding: .6rem 2rem .7rem;
background: #fff;
border-radius:9999px;
line-height: 1;
font-size:1.5rem;
color: #eb3b08;
}
#sect04 .tabcontents-list h3 .mainTxt{
display: block;
}
#sect04 .tabcontents-list .intro{
position: relative;
z-index: 2;
padding: 0 5% 5rem;
}
#sect04 .tabcontents-list .mainArea{
position: relative;
padding: 0 5% 2rem;
}

#sect04 .tabcontents-list .fukiYw{
z-index: 1;
top: -6rem;
right: 1.0rem;
padding: 2.2rem 1.5rem;
transform: rotate(8deg);
}
#sect04 .tabcontents-list .fukiYw h4{
line-height: 1.6;
}

#sect04 .tabcontents-list .intv{
margin: 0;
}
#sect04 .intv .intvBox{
margin: 2rem 0;
box-shadow: none;
}

#sect04 .tabcontents-list .btn-internal{
justify-content: center;
width: 95%;
}
#sect04 .tabcontents-list .btn-internal a{
width: 100%;
margin: 0;
}





/*------------
sect04b_SP
------------*/
#sect04b{
margin: 0 0 0;
padding: 0 0 0;
}
#sect04b .areaInner{
padding: 4rem 5% 5rem;
}
#sect04b .areaInner::before{
content: "";
position: absolute;
top: 3rem;
left: -2rem;
width: 37rem;
height: 30rem;
background: url(./img/sct04b_cloud_sp.png) 0 0 no-repeat;
background-size: 37rem auto;
}
#sect04b h3{
position: relative;
z-index: 1;
top: 0;
left: 0;
height: auto;
margin: 0 auto 3.3rem;
line-height: 2.3;
font-size:2.2rem;
font-family: "Zen Kaku Gothic New vt";
letter-spacing: 0.1em;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}

#sect04b h3 .line2{
display: block;
margin: 2.5rem 0 0;
}
#sect04b h3 .line3{
display: block;
margin: 15rem 0 0;
}


#sect04b .txtArea{
position: relative;
z-index: 1;
margin: 0 0 0;
padding: 0 0 0;
}


#sect04b .flame{
position: absolute;
}
#sect04b .fl1{
top: 2rem;
left: -3rem;
width: 14rem;
}

#sect04b .flame img{
width: 100%;
border-radius:50%;
box-shadow:.7rem .7rem 0 #eb3b08;
object-fit: cover;
}


#sect04b .trm{
top:auto;
bottom: auto;
left: auto;
right: auto;
}

#sect04b .trms{
}
#sect04b .trm1{
top: 0;
right: 0;
width: 8.5rem;
}
#sect04b .trm2{
top: 23rem;
right: -6rem;
width: 16rem;
}
#sect04b .trm3{
top: 22rem;
left: -6rem;
width: 14rem;
}

#sect04b .btns div{
width: 95%;
}




/*------------
sect05_SP
------------*/
#sect05{
margin: 0 0 0;
padding: 0 0 4rem;
}
#sect05::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #FEF6EB;
background: linear-gradient(-45deg, rgba(254, 246, 235, 1) 0%, rgba(255, 230, 240, 1) 100%);
border-radius:3rem 0 0 3rem;
}
#sect05::after{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(./img/sct05_bg_sp.png) 0 4rem no-repeat;
background-size: 100% auto;
border-radius:3rem 0 0 3rem;
}

#sect05 .areaInner::before {
background: url(./img/eng_vis.svg) 0 0 no-repeat;
background-size: auto 3.4rem;
}


#sect05 .sectTtlArea {
padding: 6rem 5% 2rem;
}
#sect05 .sectTtl {
margin: 0 0 3rem;
}

#sect05 .wtAnc{
margin: 0 0 3rem;
}
#sect05 .wtAnc a{
display: block;
padding: 1rem 12% 1.2rem 6%;
border-radius: 1rem 3rem 3rem 1rem;
background: url("./img/arrow_ccl_blue.svg") calc(100% - 1rem) 50% no-repeat #fff;
background-size: 2rem auto;
line-height: 1.4;
font-size:1.6rem;
font-weight: 700;
color: #0055e0;
}

#sect05 .ulBox{
display: block;
padding: 0 5%;
}
#sect05 .liBox{
margin: 0 0 3rem;
width: 95%;
}
#sect05 .liBox:nth-child(2n) {
top: 0;
left: 5%;
}
#sect05 .liBox a{
padding: 1.6rem 5% 1.6rem;
border-radius:3rem 1.5rem 1.5rem 1.5rem;
background: url(./img/sct05_more01.png) calc(100% - 5%) calc(100% - 2.5rem) no-repeat #fff;
background-size: 4.5rem auto;
box-shadow:.7rem .7rem 0 #eb3b08;
}
#sect05 .liBox:nth-child(3n) a{
background-image: url(./img/sct05_more02.png);
box-shadow:.7rem .7rem 0 #00bb11;
}
#sect05 .liBox:nth-child(3n-1) a{
background-image: url(./img/sct05_more03.png);
box-shadow:.7rem .7rem 0 #0055e0;
}

#sect05 .liBox .flame{
position: relative;
margin: 0 0 1.6rem;
}
#sect05 .liBox .flame::before{
content: "";
position: absolute;
bottom: -.2rem;
left: 0;
width: 100%;
height: 2.7rem;
background: url(./img/sct05_01.svg) calc(100% - 1rem) 0 no-repeat;
background-size: auto 2.7rem;
}
#sect05 .liBox:nth-child(2) .flame::before{
background-image: url(./img/sct05_02.svg);
}
#sect05 .liBox:nth-child(3) .flame::before{
background-image: url(./img/sct05_03.svg);
}
#sect05 .liBox:nth-child(4) .flame::before{
background-image: url(./img/sct05_04.svg);
}


#sect05 .liBox .flame img{
width: 100%;
height: 14rem;
border-radius:1.6rem .8rem .8rem .8rem;
object-fit: cover;
}
#sect05 .liBox h3{
display: inline-block;
min-width: 8rem;
margin: 0 0 .8rem;
padding: .4rem 1.7rem .6rem;
background: #eb3b08;
border-radius: .7rem;
text-align: center;
line-height: 1;
font-size:1.3rem;
color: #fff;
}
#sect05 .liBox:nth-child(3n) h3{
background: #00bb11;
}
#sect05 .liBox:nth-child(3n-1) h3{
background: #0055e0;
}

#sect05 .liBox .catch{
font-size:1.8rem;
}



/* modal */
/*#header,
#sect00,
#sect01,
#sect02,
#sect03,
#sect03b,
#sect04,
#sect04b{
display: none;
}
*/
/*infoエリアをはじめは非表示*/
#sect05 .infoBox{
display: none;
position: relative;
}

.md_style02{
-ms-overflow-style: none; /* IE, Edge 対応 */
scrollbar-width: none;/* Firefox 対応 */
}
.md_style02::-webkit-scrollbar{
display: none;
/* Chrome, Safari 対応 */
}



/*モーダルの横幅を変更したい場合*/
.md_style02 .modaal-container{
/*max-width: 72vw;*/
max-width: 90vw;
background: none;
box-shadow: none;
}


.md_style02.modaal-wrapper .modaal-close {
position: fixed;
/*position: absolute;*/
right: 1rem;
top: 1rem;
cursor: pointer;
opacity: 1;
width: 4rem;
height: 4rem;
background: url(./img/modal_close.svg) 0 0 no-repeat;
background-size: 4rem auto;
border-radius: 0;
transition: all .2s ease-in-out;
}
.md_style02 .modaal-close:after, .md_style02 .modaal-close:before {
width: 0;
height: 0;
background: none;
border: none;
}

.md_style02 .modaal-content-container{
padding: 0;
}



.md_style02 .modalInner{
position: relative;
}
.md_style02 .wtBox{
padding: 0 0 4rem;
background: #fff;
border-radius: 1.5rem;
}

.md_style02 .wtBox .sttl{
width: 20rem;
margin: 0 0 2rem;
padding: .6rem 1rem .8rem 5rem;
background: #eb3b08;
border-radius:1.5rem 0 1.5rem 0;
font-size:1.5rem;
color: #fff;
}
.md_style02 .boxGreen .wtBox .sttl{
background: #00bb11;
}
.md_style02 .boxBlue .wtBox .sttl{
background: #0055e0;
}

.md_style02 .wtBox .sttl::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 5rem;
height: 100%;
background: url("./img/sct05_01.svg") 0 50% no-repeat;
background-size: auto 1.9rem;
opacity: .5;
}
.md_style02 .modal502 .wtBox .sttl::before{
background-image: url("./img/sct05_02.svg");
}
.md_style02 .modal503 .wtBox .sttl::before{
background-image: url("./img/sct05_03.svg");
}
.md_style02 .modal504 .wtBox .sttl::before{
background-image: url("./img/sct05_04.svg");
}

.md_style02 .wtBox .catch2{
position: relative;
margin: 0 0 2.0rem;
padding: 0 0;
line-height: 1.7;
font-weight: 700;
font-size:1.8rem;
}
.md_style02 .wtBox .catch2::before{
width: 0;
height: 0;
background: none;
border: none;
}

.md_style02 .wtBox .topArea{
position: relative;
min-height: 0;
margin: 0 0 3rem;
padding: 0 5%;
}

.md_style02 .port{
position: static;
width: auto;
margin: 0 0 1.8rem;
}
.md_style02 .port img{
width: 100%;
height: 15rem;
border-radius:.8rem;
object-fit: cover;
}
	
.md_style02 .modal502 .port img,.md_style02 .modal504 .port img {
object-position: 50% 50%;
}


.md_style02 .wtBox .boxArea{
display: block;
padding: 0 5%;
}
.md_style02 .wtBox .childBox{
position: relative;
width: auto;
margin: 0 0 2rem;
padding: 0 0 2rem;
}
.md_style02 .wtBox .childBox::before{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: calc(100% - 1.5rem);
background: #fdfbf2;
border-radius:1rem;
}
.md_style02 .wtBox .childBox h4{
margin: 0 1.5rem 1rem;
padding: .3rem 5% .5rem;
background: #eb3b08;
border-radius:9999px;
text-align: center;
font-size:1.8rem;
color: #fff;
}
.md_style02 .boxGreen .wtBox .childBox h4{
background: #00bb11;
}
.md_style02 .boxBlue .wtBox .childBox h4{
background: #0055e0;
}


.md_style02 .wtBox .childBox ul{
margin: 0 5% 0;
}
.md_style02 .wtBox .childBox li{
position: relative;
padding: 3px 0 3px 2rem;
font-size:1.5rem;
}
.md_style02 .wtBox .childBox li::before{
position: absolute;
content: "";
top: 13px;
left: 2px;
width: 12px;
height: 12px;
background: #fecc00;
border-radius: 50%;
}


.md_style02 .wtBox .intv{
margin: 4rem 5% 3rem;
}
.md_style02 .wtBox .intvBox{
margin: 0 0 2rem;
box-shadow: none;
}
.md_style02 .boxGreen .intvBox {
border: 2px solid #00bb11;
box-shadow: none;
}
.md_style02 .boxBlue .intvBox {
border: 2px solid #0055e0;
box-shadow: none;
}

.md_style02 .boxGreen .intv .headArea{
border-right: none;
border-bottom: 2px solid #00bb11;
}
.md_style02 .boxBlue .intv .headArea{
border-right: none;
border-bottom: 2px solid #0055e0;
}
.md_style02 .boxGreen .intv .headArea::before {
border: 2px solid #00bb11;
}
.md_style02 .boxBlue .intv .headArea::before {
border: 2px solid #0055e0;
}

.md_style02 .boxGreen .flame img {
border: 2px solid #00bb11;
}
.md_style02 .boxBlue .flame img {
border: 2px solid #0055e0;
}

.md_style02 .boxGreen .tag{
background: #00bb11;
}
.md_style02 .boxBlue .tag{
background: #0055e0;
}

.md_style02 .intvBox .catch{
font-size:1.9rem;
}

.md_style02 .boxGreen .dotR {
background-image: url("./img/dot_green2.png");
}
.md_style02 .boxBlue .dotR {
background-image: url("./img/dot_blue2.png");
}



.md_style02 .btn-internal{
margin: 0 auto;
width: 85%;
justify-content: center;
}
.md_style02 .btn-internal a{
width: 100%;
margin: 0;
}




/*------------
sect05b_SP
------------*/
#sect05b{
position: relative;
z-index: 2;
padding: 0;
}
#sect05b .areaInner{
padding: 6.5rem 5% 10rem;
}

#sect05b h3{
position: relative;
margin: 0 0 4rem;
padding: 3.5rem 0 0;
text-align: center;
line-height: 2.1;
font-size:2.1rem;
}
#sect05b h3::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 1.5rem;
background: url(./img/sct05b_ttl.svg) 50% 0 no-repeat;
background-size: auto 1.5rem;
}

#sect05b .txtArea p{
text-align: justify;
}

#sect05b .trm{
top:auto;
bottom: auto;
left: auto;
right: auto;
}
#sect05b .trms{
}
#sect05b .trm1{
top: -3.5rem;
left: -1.5rem;
width: 6.8rem;
}
#sect05b .trm2{
top: -.8rem;
right: -6rem;
width: 14rem;
}
#sect05b .trm3{
bottom: -5.5rem;
left: -2.0rem;
width: 10rem;
}
#sect05b .trm4{
bottom: 1.5rem;
right: 10rem;
width: 7.5rem;
}
#sect05b .trm5{
display: none;
}
#sect05b .trm6{
bottom: -2.5rem;
right: -5rem;
width: 18rem;
}





/*------------
sect06_SP
------------*/
#sect06{
/*background: #faf2ea;
border-radius:6rem 6rem 0 0;*/
}
#sect06::before{
content: "";
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 50rem;
background: #eb3b08;
border-radius:3rem 3rem 0 0;
}
#sect06::after{
content: "";
position: absolute;
z-index: 1;
top: 7.5rem;
left: 0;
width: 100%;
height: calc(100% - 7.5rem);
background: url(./img/sct06_ccl_sp.svg) 0 0 no-repeat;
background-size: 100% auto;
}


#sect06 .inner{
position: relative;
padding: 0 0 3rem;
}

#sect06 .inner::before{
content: "";
position: absolute;
z-index: 0;
top: 0;
left: 0;
width: 100%;
height: 5rem;
background: #fff;
}
#sect06 .inner::after{
content: "";
position: absolute;
z-index: 0;
bottom: 0;
left: 0;
width: 100%;
height: calc(100% / 2);
background: #faf2ea;
}

#sect06 .areaInner{
z-index: 2;
padding: 0 0 0;
}
#sect06 .areaInner::before {
background: url(./img/eng_lum2.svg) 50% 0 no-repeat;
background-size: auto 3.4rem;
}


#sect06 .fuki{
position: absolute;
z-index: 1;
top: 4.5rem;
left: calc(50% - 4rem);
display: flex;
align-items: center;
justify-content: center;
width: 8rem;
height: 8rem;
background: #fecc00;
border-radius:50%;
border: 2px solid #fff;
line-height: 1.4;
font-size:1.5rem;
font-weight: 700;
text-align: center;
}

#sect06 .sectTtlArea{
position: relative;
padding: 13rem 5% 2rem;
text-align: center;
}

#sect06 .sectTtlArea .sttl{
line-height: 1.8;
font-size:2.7rem;
}
#sect06 .sectTtlArea .yarigaiWrap{
display: inline-block;
margin: 0 0 0;
padding: .6rem 1.0rem .7rem;
background: #fff;
box-shadow:.4rem .4rem 0 #eb3b08;
border-radius:.7rem .7rem 2.2rem .7rem;
font-size:3.0rem;
line-height: 1;
}
#sect06 .sectTtlArea .yarigai{
background-position: 50% 46%;
background-size: 17rem auto;
}


#sect06 .sectTtlArea .catch2{
font-weight: 700;
font-size:1.8rem;
line-height: 1.7;
}


#sect06 .topArea{
position: relative;
display: block;
margin: 0 5% 3rem;
}
#sect06 .topArea::before{
content: "";
position: absolute;
z-index: -1;
top: -17rem;
right: -2rem;
width: 18rem;
height: 18rem;
background: url("./img/fukuoka2.png") 0 0 no-repeat;
background-size: 18rem auto;
}
#sect06 .topArea .imgArea{
width: 90%;
margin: 0 auto 1.5rem;
padding: 1rem 1rem .9rem;
background: #fff;
border-radius: 1.5rem;
}
#sect06 .topArea .txtArea{
width: auto;
}
#sect06 .btns{
margin: 0 0 4rem;
}


#sect06 .wtBox{
background: #fff;
border-radius:1.5rem;
margin: 0 5%;
padding: 0 0 3rem;
}
#sect06 .wtBox .intro{
padding: 1.5rem 5% 3rem;
}
#sect06 .wtBox .intro .leftArea{
width: auto;
float: none;
}
#sect06 .wtBox .intro .rightArea{
width: auto;
float: none;
margin: 2.5rem 0 0;
padding: 0 0 0;
border-left: none;
}
#sect06 .wtBox .intro p{ 
margin: 0;
padding: 0;
}
#sect06 .wtBox .intro .tag{
display: block;
margin: 0 0 1.2rem;
padding: .5rem 5% .7rem;
background: #eb3b08;
border-radius: .7rem;
text-align: center;
line-height: 1;
font-size: 1.5rem;
color: #fff;
}
#sect06 .wtBox .intro h3{
font-size: 2.2rem;
}

#sect06 .ulBox{
display: block;
}
#sect06 .liBox{
width: auto;
margin: 0 5% 2.7rem 0;
padding: 3rem 5% 3rem;
border-radius:0 1.5rem 3rem 0;
background: #FEF4CD;
background: linear-gradient(0deg, rgba(254, 244, 205, 1) 0%, rgba(254, 252, 244, 1) 100%);
}
#sect06 .liBox:nth-child(2){
margin: 0 0 2.7rem 5%;
padding: 3rem 5% 3rem;
border-radius:1.5rem 0 0 3rem;
background: #FEF6EB;
background: linear-gradient(180deg, rgba(254, 246, 235, 1) 0%, rgba(255, 230, 240, 1) 100%);
}

#sect06 .liBox .flame{
position: static;
width: 7rem;
float: left;
margin: 0 1.8rem 0 0;
}
#sect06 .liBox:nth-child(2) .flame{
}
#sect06 .liBox .flame img{
width: 100%;
height: 7rem;
border-radius: 50%;
border: 2px solid #0055e0;
box-shadow: .4rem .4rem 0 #0055e0;
}
#sect06 .liBox:nth-child(2) .flame img{
border: 2px solid #eb3b08;
box-shadow: .4rem .4rem 0 #eb3b08;
}

#sect06 .liBox .fontCol{
margin: 0 0 .3rem;
font-weight: 700;
font-size:1.3rem;
line-height: 1.4;
color: #0055e0;
}
#sect06 .liBox:nth-child(2) .fontCol{
color: #eb3b08;
}
#sect06 .liBox .tag{
display: inline-block;
margin: 0 0 2.5rem;
padding: .4rem 4% .7rem;
background: #0055e0;
border-radius: .7rem;
text-align: center;
line-height: 1;
font-size: 1.5rem;
color: #fff;
}
#sect06 .liBox:nth-child(2) .tag{
background: #eb3b08;
}

#sect06 .liBox p{
margin: 0;
}

#sect06 .talks{
margin: 4rem 5% 2.5rem;
}

#sect06 .talks h4{
position: relative;
margin: 0 0 2rem;
padding: 3.5rem 0 0;
text-align: center;
line-height: 1.9;
font-size: 2.1rem;
}
#sect06 .talks h4::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 1.5rem;
background: url(./img/sct06_intv.svg) 50% 0 no-repeat;
background-size: auto 1.5rem;
}

#sect06 .btn-internal{

}




/*------------
sect06b_SP
------------*/
#sect06b{
background: #faf2ea;
margin: 0 0 2rem;
padding: 0 0 0;
}
#sect06b .areaInner{
padding: 5rem 5% 12rem;
}
#sect06b .areaInner::before{
content: "";
position: absolute;
top: 0;
left: -5.5rem;
width: 37rem;
height: 30rem;
background: url(./img/sct06b_cloud.png) 0 0 no-repeat;
background-size: 37rem auto;
}
#sect06b h3{
z-index: 1;
margin: 0 0 3rem;
line-height: 1.8;
font-size:2.1rem;
}

#sect06b .txtArea{
position: relative;
z-index: 1;
margin: 0 0 3rem;
}


#sect06b .flame{
position: absolute;
}
#sect06b .fl2{
top: 1.9rem;
left: auto;
right: .5rem;
width: 12rem;
}
#sect06b .flame img{
width: 100%;
border-radius:50%;
box-shadow:.8rem .8rem 0 #eb3b08;
object-fit: cover;
}
#sect06b .fl2 img{
box-shadow:-.8rem .8rem 0 #fecc00;
}


#sect06b .trm{
top:auto;
bottom: auto;
left: auto;
right: auto;
}

#sect06b .trms{
}
#sect06b .trm1{
z-index: 2;
top: -7rem;
left: -2.2rem;
width: 11rem;
}
#sect06b .trm2{
bottom: 0;
right: -5rem;
width: 12rem;
}
#sect06b .trm3{
bottom: 34rem;
right: 1.3rem;
width: 3.8rem;
}
#sect06b .trm4{
bottom: 4rem;
left: -6rem;
width: 14rem;
}

#sect06b .btns div {
width: 95%;
}


/*------------
about_SP
------------*/
.about .inner{
border: none;
}


/* End_SP */








/*  End_SP */

}