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

:root{
--mainColor:#000;
--subColor:#fff;
--axColor:#b90004;
--baseWidth:clamp(100px,100vw,1200px);
--bBorder:2px solid #fad6c6;
--wStrk:0.075em 0 0.5em #fff,-0.075em 0 0.5em #fff,0 -0.075em 0.5em #fff,0 0.075em 0.5em #fff,0.075em 0.075em 0.1em #fff,-0.075em 0.075em 0.1em #fff,0.075em -0.075em 0.1em #fff,-0.075em -0.075em 0.1em #fff;
--paln01:#5b8540;
--paln02:#024191;
--paln03:#c28b02;
}

html{scroll-behavior:smooth;}
body[data-device="pc"] nav[data-nav="menu"]{display:none;}

/*--------------------------------------------------------*/
@media screen and (max-width:800px){}
@media screen and (max-width:1000px){}

/*--------------------------------------------------------*/

#ec-photo{font:400 clamp(20px,4vw,40px) / 1.5 'LINE Seed JP';width:clamp(100px,100%,100svw);padding:0;}
#ec-photo .lpMain{min-height:100svh;background:#fff;}
main #ec-photo  .lpMain .wrap{width:var(--baseWidth);padding:0;box-sizing:border-box;}
[data-device="smp"]  main #ec-photo  .lpMain .wrap{width:100%;}

#ec-photo .lpMain>section{padding:0;}
[data-device="smp"] #ec-photo .lpMain>section{padding:2vw;box-sizing:border-box;}
/*-------------------*/

/*-------------------
#ecp01
-------------------*/
#ecp01{background:url(ecp_01.jpg) no-repeat 50% 50% / 100% auto;}
#ecp01 .hd{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;text-align:center;height:clamp(400px,50vw,800px);}

#ecp01 .hd{flex-flow:column;width:clamp(100px,80svw,800px);margin:0 auto;}
#ecp01 .hd{background:url(ecp_01hd.png) no-repeat 50% 50% / 100% auto;}
#ecp01 .hd>*{display:none;}

[data-device="smp"] #ecp01{background-size:auto 100%}
[data-device="smp"] #ecp01 .hd{height:clamp(100px,80vw,600px);}


/*-------------------
#ecp02
-------------------*/
#ecp02{background:url(ecp_02.jpg) no-repeat 50% 0% / 100% auto;}
#ecp02{}
[data-device="smp"] #ecp02{}

#ecp02 .wrap{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;text-align:center;flex-flow:wrap,column;height:clamp(400px,80vw,800px)}

#ecp02 .hd{transform:translateY(clamp(10px,5vw,50px))}

#ecp02 .hd{text-align:center;color:#171c61;font-weight:800;text-shadow:var(--wStrk);line-height:1.4em;}
#ecp02 .hd h2>span{font-weight:800;font-size:1.5em;}
#ecp02 .hd h2{font-weight:800;font-size:0.75em;}
#ecp02 .hd h2>span:nth-of-type(1){display:block;color:#bb001f;}
#ecp02 .hd h2>span:nth-of-type(2){display:block;color:#ff0c00;}
#ecp02 .hd h2>span:nth-of-type(3){color:#ff5a00;}
#ecp02 .hd h2>span:nth-of-type(4){}


#ecp02 .list{background:url(ecp_02img.png) no-repeat 50% 0% / 100% auto;margin:0 auto;height:clamp(240px,48vw,480px);width:clamp(320px,80vw,1000px);}
#ecp02 .list ul{display:none;}

[data-device="smp"] #ecp02 .wrap .list{background-size:100% auto;height:50%}

#ecp02 .hd{transition:2s;opacity:0;}
#ecp02 .hd[data-inview="1"]{transition-delay:1s;opacity:1;}
#ecp02 .list{transition:2s;opacity:0;}
#ecp02 .list[data-inview="1"]{transition-delay:1s;opacity:1;}

/*-------------------
#ecp03
-------------------*/
#ecp03{background:url(ecp_03.jpg) no-repeat 50% 0% / 100% auto;}
#ecp03 .hd{background:url(ecp_03hd.png) no-repeat 50% 50% / 100% auto;height:clamp(10px,50vw,600px);width:clamp(100px,80vw,800px);margin: 0 auto;}
#ecp03 .hd h2{display:none;}

#ecp03 .box section{margin:0 auto 4em;width:clamp(200px,90vw,800px);padding:1em;
border-radius:1em;box-shadow:0 0 0.5em #ccc inset;box-sizing:border-box;font-size:0.65em;background:#fff;}

#ecp03 .box section .sub{font-weight:600;font-size:1em;color:#171c61}
#ecp03 .box section .sub p sub{vertical-align:baseline;font-size:0.5em;}
#ecp03 .box section .sub h3{font-size:1.25em;}
#ecp03 .box section .sub h3 span{color:var(--axColor);font-size:1.5em;font-weight:800;}

#ecp03 .box section[data-point]{position:relative;padding-left:9em;transform:translateX(1em)}
#ecp03 .box section[data-point]::before{content:"";display:block;position:absolute;left:-1em;top:-2em;
width:12em;height:15em;background:url(ecp03_s.png) no-repeat 50% 0 / 100% auto;transform:translateX(-2em);}
#ecp03 .box section[data-point]::after{content:"";display:block;position:absolute;left:0;top:0.2em;border-radius:100%;
width:6em;height:6em;background: no-repeat 50% 0 / 100% auto;}

#ecp03 .box section[data-point]:nth-of-type(2n){padding-left:1.5em;padding-right:8em;transform:translateX(-1em)}
#ecp03 .box section[data-point]:nth-of-type(2n)::before{left:unset;right:-1em;transform:translateX(2em);}
#ecp03 .box section[data-point]:nth-of-type(2n)::after{left:unset;right:0;}
#ecp03 .box section[data-point="1"]::after{background-image:url(ecp03_s_01.png);}
#ecp03 .box section[data-point="2"]::after{background-image:url(ecp03_s_02.png);}
#ecp03 .box section[data-point="3"]::after{background-image:url(ecp03_s_03.png);}
#ecp03 .box section[data-point="4"]::after{background-image:url(ecp03_s_04.png);}


#ecp03 .box section[data-point]>p{font-size:clamp(12px,3vw,18px);font-weight:600;}

[data-device="smp"] #ecp03{background:url(ecp_03.jpg) no-repeat 50% 0% / 100% auto;}
[data-device="smp"] #ecp03 .wrap{padding:0;}
[data-device="smp"] #ecp03 .hd{padding:0;height:clamp(10px,40vw,400px);}
[data-device="smp"] #ec-photo .lpMain>section#ecp03{padding:0vw;}
[data-device="smp"] #ecp03 .box{padding:2vw;}
[data-device="smp"] #ecp03 .box section[data-point]{margin-bottom:2.5em;}

#ecp03 .box section::after{transition:2s;opacity:0;}
#ecp03 .box section[data-inview="1"]::after{transition-delay:1s;opacity:1;}


/*-------------------
#ecp04
-------------------*/
#ecp04{background:#fff;}
#ecp04 .hd{background:url(ecp_04.png) no-repeat 50% 50% / 100% auto;height:clamp(10px,60vw,600px);width:clamp(100px,80vw,800px);margin: 0 auto;}
#ecp04 .hd h2{display:none;}

#ecp04 .box picture{display:block;height:clamp(100px,60vw,600px);background:url(ecp_04img.jpg) no-repeat 50% 0 / auto 100%;}
#ecp04 .box ul{display:flex;width:clamp(100px,80vw,1000px);margin:0 auto;flex-wrap:wrap;gap:2%;align-items:start;justify-content:center;
padding-bottom:4em;}
#ecp04 .box ul>li{display:block;width:49%;margin:1% 0;font-size:0.6em;line-height:1.5em;text-align:center;font-weight:600;}

#ecp04 .box ul>li{padding:1em 2em;box-sizing:border-box;border-radius:4em;background:#181d63 linear-gradient(0,transparent 0%,#2830a6 50%,transparent 100%) ;
color:#fff;box-shadow:0.1em 0.1em 0.15em #b5b6d4 inset,-0.1em -0.1em 0.1em  #181d63 inset,0 0.2em 0.2em #ccc;}
[data-device="smp"] #ecp04 .hd{background-size:auto 100%;}

[data-device="smp"] #ecp04 .box ul{padding-bottom:0.5em;width:unset;}
[data-device="smp"] #ecp04 .box ul>li{width:100%;font-size:0.75em;font-weight:400;}


#ecp04 .hd{transition:1s;opacity:0;}
#ecp04 .hd.on{transition-delay:1s;opacity:1;}


/*-------------------
#ecp05
-------------------*/
#ecp05{background:#fff;}
#ecp05 .hd{background:url(ecp_05.png) no-repeat 50% 50% / 100% auto;height:clamp(10px,25vw,250px);width:clamp(100px,80vw,1000px);margin: 0 auto;}
#ecp05 .hd h2{display:none;}

[data-device="smp"] #ecp05 .hd{width:100%;}


.plans>section{display:flex;flex-wrap:wrap;justify-content:left;align-items:stretch;width:100%;}
/*.plans>section::before{content:"";display:block;width:10%;order:1;}*/
.plans>section>div.data{display:block;width:clamp(100px,50%,500px);margin-left:auto;box-sizing:border-box;padding:0.25em;font-size:1.25em;}
.plans>section>div.data p.text{color:#000;font:600 0.4em / 1 'LINE Seed JP';}
.plans>section>div.data p.price{font:800 1.2em / 1 'noto serif jp';}
.plans>section>div.data p.price sub{vertical-align:baseline;font-size:0.5em;font-weight:800;}
.plans>section>div.data dl.cut{display:inline-flex;flex-wrap:wrap;font-size:0.5em;justify-content:center;align-items:baseline;box-sizing:border-box;
margin:1em 0;font-weight:600;box-shadow:0 0 0 2px;line-height:1;}
.plans>section>div.data dl.cut>*{display:block;padding:0.25em 0.5em;box-sizing:border-box;}
.plans>section>div.data dl.cut dt{color:#fff;}
.plans>section>div.data dl.cut dd{color:#000;text-align:center;font-size:0.8em;}
.plans>section>div.data dl.cut dd span{font-size:1.25em;display:inline-block;padding:0 0.2em}
.plans>section>div.data ul{padding:0.2em 0;}
.plans>section>div.data ul>li{font-weight:600;color:#000;font-size:0.4em;padding-left:1.2em;display:block;position:relative;}
.plans>section>div.data ul>li::before{content:"";line-height:1;display:block;position:absolute;left:0;top:0.25em;width:1em;height:1em;border-radius:100%;box-shadow:0 0 0 0.1em inset;}
.plans>section>div.data ul>li::after{content:"L";line-height:1;display:block;position:absolute;left:0;top:0.25em;transform: translate(0.2em,-0.2em) scale(-1.2,1.2) rotate(-45deg);font-weight:600;}

.plans>section>picture{display:block;width:clamp(100px,50vw,2000px);}
.plans>section#plan01>picture{background:url(plan_01.jpg) no-repeat 0 50% / auto 100%;}
.plans>section#plan02>picture{background:url(plan_02.jpg) no-repeat 100% 50% / auto 100%;}
.plans>section#plan03>picture{background:url(plan_03.jpg) no-repeat 0 50% / auto 100%;}

.plans>section#plan01>div.data ul>li::before,
.plans>section#plan01>div.data ul>li::after,
.plans>section#plan01>div.data dl.cut dd span,
.plans>section#plan01{color:var(--paln01);}

.plans>section#plan02>div.data ul>li::before,
.plans>section#plan02>div.data ul>li::after,
.plans>section#plan02>div.data dl.cut dd span,
.plans>section#plan02{color:var(--paln02);}

.plans>section#plan03>div.data ul>li::before,
.plans>section#plan03>div.data ul>li::after,
.plans>section#plan03>div.data dl.cut dd span,
.plans>section#plan03{color:var(--paln03);}

.plans>section#plan01>div.data dl.cut dt{background-color:var(--paln01);}
.plans>section#plan02>div.data dl.cut dt{background-color:var(--paln02);}
.plans>section#plan03>div.data dl.cut dt{background-color:var(--paln03);}

.plans>section#plan02{justify-content:right;flex-direction:row-reverse;}
.plans>section#plan02>div.data{margin-left:unset;margin-right:auto;}

[data-device="smp"] .plans>section{flex-direction:column !important;}
[data-device="smp"] .plans>section>div.data{display:block;width:100%;margin:0 auto;font-size:2em;}
[data-device="smp"] .plans>section>picture{display:block;width:100%;height:clamp(100px,60svw,500px);background-position:50% 50% !important;background-size:100% auto !important;}


@media screen and (min-width: 1200px) {
.plans>section#plan01>picture{background-size:100% auto;}
.plans>section#plan02>picture{background-size:100% auto;}
.plans>section#plan03>picture{background-size:100% auto;}
}

#ecp05 .wrap{padding-top:1em !important;}
#ecp05 .box{padding:2em 0 1em;}
#ecp05 .box ul{display:flex;flex-wrap:wrap;justify-content:center;align-items:start;padding:1em 0 0;gap:2%;}
#ecp05 .box ul li{display:block;border-radius:100%;padding:0;margin:2% 0 0;}
#ecp05 .box ul li>*:not(picture){display:none;}
#ecp05 .box ul li>picture{display:block;width:100%;line-height:0;padding:0;}
#ecp05 .box ul li>picture img{display:block;width:100%;}

#optionMenu h3{display:none;}
#shooting h3{display:none;}
#ecp05 .box::before{content:"";display:block;width:clamp(100px,80%,700px);height:2.4em;margin:0 auto;}
#ecp05 .box#optionMenu::before{background:url(ecp_opt.png) no-repeat 50% 50% / auto 100%;}
#ecp05 .box#optionMenu ul{width:clamp(100px,100%,900px);margin:0 auto;}
#ecp05 .box#optionMenu ul>li{width:23.5%;}
#ecp05 .box#optionMenu ul>li:nth-of-type(1){background:url(ecp_opt_01.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#optionMenu ul>li:nth-of-type(2){background:url(ecp_opt_02.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#optionMenu ul>li:nth-of-type(3){background:url(ecp_opt_03.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#optionMenu ul>li:nth-of-type(4){background:url(ecp_opt_04.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#optionMenu ul>li:nth-of-type(5){background:url(ecp_opt_05.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#optionMenu ul>li:nth-of-type(6){background:url(ecp_opt_06.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#optionMenu ul>li:nth-of-type(7){background:url(ecp_opt_07.png) no-repeat 50% 50% / 100% auto;}


#ecp05 .box#shooting::before{background:url(ecp_opt2.png) no-repeat 50% 50% / auto 100%;}
#ecp05 .box#shooting ul{width:clamp(100px,100%,900px);margin:0 auto;}
#ecp05 .box#shooting ul>li{width:32%;}
#ecp05 .box#shooting ul>li:nth-of-type(1){background:url(ecp_opt2_01.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#shooting ul>li:nth-of-type(2){background:url(ecp_opt2_02.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#shooting ul>li:nth-of-type(3){background:url(ecp_opt2_03.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#shooting ul>li:nth-of-type(4){background:url(ecp_opt2_04.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#shooting ul>li:nth-of-type(5){background:url(ecp_opt2_05.png) no-repeat 50% 50% / 100% auto;}
#ecp05 .box#shooting ul>li:nth-of-type(6){background:url(ecp_opt2_06.png) no-repeat 50% 50% / 100% auto;}



#ecp05 .box#optionMenu ul>li,
#ecp05 .box#shooting ul>li{width:clamp(100px,21vw,210px);}

#ecp05 .box#optionMenu ul,
#ecp05 .box#shooting ul{gap:2%;padding:1em 0 0;}

[data-device="pc"] #ecp05 .box#shooting ul{padding:1em 10% 0;box-sizing:border-box;}
[data-device="smp"] #ecp05 .box::before{width:100%;}





.plans>section{overflow:hidden;transition:0;}
.plans>section#plan01>picture{transform:translateX(200%);transition:2s;opacity:0;}
.plans>section#plan02>picture{transform:translateX(-200%);transition:2s;opacity:0;}
.plans>section#plan03>picture{transform:translateX(200%);transition:2s;opacity:0;}

.plans>section#plan01.on>picture{transform:translateX(0%);transition-delay:1s;opacity:1;}
.plans>section#plan02.on>picture{transform:translateX(0%);transition-delay:1s;opacity:1;}
.plans>section#plan03.on>picture{transform:translateX(0%);transition-delay:1s;opacity:1;}

.plans>section>div.data{transform:translateY(100%);transition:2s;opacity:0;}
.plans>section.on>div.data{transform:translateY(0%);transition-delay:1s;opacity:1;}

/*-------------------
#ecp06
-------------------*/
#ecp06{background:#fff;}
#ecp06 .hd{background:url(ecp_06.png) no-repeat 50% 50% / 100% auto;height:clamp(10px,25vw,250px);width:clamp(100px,80vw,1000px);margin: 0 auto;}
#ecp06 .hd h2{display:none;}

[data-device="smp"] #ecp06 .hd{width:100%;}


#ecp06 .step dl{width:clamp(100px,25em,960px);margin:0 auto 2em;font-size:clamp(12px,4vw,40px);font-family:'Noto serif jp',serif;box-sizing:border-box;}
#ecp06 .step dl{background:url(ecp_06step.png) no-repeat 0 0 / 100% auto;text-align:center;}
#ecp06 .step dl::before{content:attr(data-step);display:flex;height:2.1em;padding:0em;font-size:2em;
box-sizing:border-box;margin:0 auto;width:2.1em;justify-content:center;align-items:center;color:#fff;}

#ecp06 .step dl>dt{font-weight:600;line-height:1;padding:1em 0 0.5em;}
#ecp06 .step dl>dd{font-size:0.75em;line-height:2;}

[data-device="smp"] #ecp06 .step dl{font-size:4.1vw;width:100%;}
[data-device="smp"] #ecp06 .step dl>dt{font-size:2em;line-height:1;padding:0.5em 0;}
[data-device="smp"] #ecp06 .step dl>dd{font-size:1em;line-height:1;}

#ecp06 .box{border-radius:1em;background:#fffcf3;color:#bc8e31;margin:1em auto;padding:1em;box-shadow: 0 0 0 0.1em inset;width:clamp(100px,100%,960px);box-sizing:border-box;}
#ecp06 .box h3{font-weight:600;padding:0 0 0.5em;text-align:center;}
#ecp06 .box ul{font-size:0.7em;padding:0;margin:0;}
#ecp06 .box li{color:#000;display:flex;flex-wrap:wrap;padding:0 0 0.5em 1.2em;align-items:start;justify-content:left;position:relative;}
#ecp06 .box li::before{content:"";background:#bc8e31;width:1em;height:1em;border-radius:100%;display:block;position:absolute;left:0;top:0.2em;transform:scale(0.8);}



#ecp06 .step dl>dd{transition:1s;opacity:0;}
#ecp06 .step dl.on>dd{transition-delay:1s;opacity:1;}

/*-------------------
#ecp07
-------------------*/
#ecp07{background:url(ecp_07.jpg) no-repeat 50% 50% / cover;}
#ecp07 .wrap{height:clamp(200px,60svh,400px);display:flex;justify-content:center;align-items:center;flex-wrap:wrap;}
#ecp07 .btn a{display:block;text-align:center;color:#024191;background:#fff;border-radius:4em;}
#ecp07 .btn a{padding:1em 2em;font-family:'noto serif jp',serif;font-weight:600;box-shadow:0 0 0 0.1em inset,0 0 0 0.2em #fff inset,0 0 0 0.35em inset}
#ecp07 .btn a>p+p{font-size:0.75em;}