@charset "UTF-8";
/* ========================================================================

  /csr/css/eco.css

======================================================================== */
#eco main * { word-break:normal; }
.cube::before { content:'\025a0'; color:#32823a; font-family:var(--m-plus-rounded-1c); font-size:24px; font-size:2.4rem; }
p.pict { font-size:0; }
/************************************************************************
  #main-image
************************************************************************/
#main-image { width:100%; height:calc(260/1200*100vw); background:url('../images/eco/main_image.png') no-repeat; background-size:100% auto; font-size:0; }
/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
#main-image { background-image:url('../images/eco/main_image@2x.png'); }
}
/* ============ smart phone ============ */
@media (max-width:750px){
#main-image { height:calc(163/750*100vw); }
}
/************************************************************************
  .contents
************************************************************************/
main .contents { margin:auto; max-width:860px; }
/* ============ smart phone ============ */
@media (max-width:750px){
main .contents { margin:auto calc(25/750*100vw); max-width:initial; }
}
/************************************************************************
  #lead
************************************************************************/
#lead { padding:120px 0; text-align:center; }
#lead h2 { margin-bottom:40px; font-size:0; }
#lead h2 + p.txt { margin-bottom:50px; }
#lead p.txt { line-height:calc(42/22); letter-spacing:0.025em; font-size:24px; font-size:2.4rem; }
#lead h3 { color:#32823a; letter-spacing:0.025em; font-weight:700; font-family:var(--m-plus-rounded-1c); font-size:28px; font-size:2.8rem; }
/* article */
#lead article { margin:auto; }
#lead article p.txt { line-height:calc(78/20); letter-spacing:0.05em; font-size:20px; font-size:2.0rem; }
/* table */
#lead article table { width:100%; border-collapse:separate; border-spacing:3px; border-radius:16px; font-weight:600; font-family:var(--m-plus-rounded-1c); }
#lead article table th { width:28.5%; background-color:#32823a; color:#ffffff; border-radius:16px 0 0 16px; text-align:center; vertical-align:middle; font-size:24px; font-size:2.4rem; }
#lead article table th.package,
#lead article table th.food { border-radius:0; }
#lead article table .package { background-color:rgba(231,244,197,0.7); color:#32823a; }
#lead article table .food { background-color:rgba(250,224,237,0.7); color:#cc6b9c; }
#lead article table td { padding:30px; text-align:left; font-size:20px; font-size:2.0rem; }
table tr:first-child td:last-child { border-radius:0 16px 0 0; }
table tr:last-child td:last-child { border-radius:0 0 16px 0; }
/* ============ smart phone ============ */
@media (max-width:750px){
#lead { padding:calc(130/750*100vw) 0; }
#lead h2 { margin:auto auto calc(40/750*100vw); width:calc(390/750*100vw); }
#lead h2 + p.txt { margin-bottom:calc(80/750*100vw); }
#lead p.txt { line-height:calc(54/30); font-size:calc(30/750*100vw); }
#lead p.txt span { display:block; }
#lead h3 { margin-bottom:0.2em; font-size:calc(34/750*100vw); }
#lead h3 + p.txt { margin-bottom:0.5em;  }
/* article */
#lead article p.txt { line-height:calc(54/30); font-size:calc(28/750*100vw); }
/* table */
#lead article table th { font-size:calc(28/750*100vw); }
#lead article table th span,
#lead article table td span { display:block; }
#lead article table td { padding:calc(20/750*100vw); font-size:calc(24/750*100vw); }
}
/************************************************************************
  .column
************************************************************************/
.column h2 { margin-bottom:50px; text-align:center; font-size:0; }
/* ============ smart phone ============ */
@media (max-width:750px){
.column h2 { margin:auto auto calc(60/750*100vw); width:calc(690/750*100vw); }
}
/************************************************************************
  #column-01
************************************************************************/
#column-01 { padding:120px 0; background:url('../images/eco/bg.png') repeat; position:relative; z-index:0; overflow:hidden; }
#column-01::before { content:''; margin:auto; width:100%; height:calc(1260/1200*100vw); background:url('../images/eco/bg_column_01.png') no-repeat; background-size:100% auto; position:absolute; top:0; right:0; left:0; display:block; pointer-events:none; z-index:-1; }
#column-01 h2 { position:relative; }
#column-01 h2::after { content:''; width:126px; height:106px; background:url('../images/eco/h2_001_after.png') no-repeat; background-size:100% auto; position:absolute; top:-95px; right:35px; }
/* dl */
#column-01 .contents > dl > dt { margin-bottom:0.5em; color:#32823a; font-weight:700; font-family:var(--m-plus-rounded-1c); font-size:28px; font-size:2.8rem; }
#column-01 .contents > dl > dt::before { content:'\025a0'; font-size:24px; font-size:2.4rem; }
#column-01 .contents > dl > dt small { margin-left:0.8em; color:#333333; font-weight:600; font-size:20px; font-size:2.0rem; }
#column-01 .contents > dl > dt sup { margin-left:0.5em; vertical-align:super; font-size:16px; font-size:1.6rem; }
#column-01 .contents > dl > dd { margin:0 auto 60px; padding:35px 50px; background-color:#ffffff; border:dotted 2px #32823a; border-radius:16px; }
#column-01 .contents > dl > dd:last-child { margin-bottom:0; }
#column-01 .contents > dl > dd > p.txt { margin-bottom:0.5em; font-size:18px; font-size:1.8rem; }
#column-01 .contents > dl > dd .flex .text { order:2; }
#column-01 .contents > dl > dd .flex .pict { order:1; width:40%; text-align:center; }
#column-01 .contents > dl > dd .flex .text p.txt { margin-bottom:0.5em; font-size:16px; font-size:1.6rem; }
#column-01 .contents > dl > dd .flex .text p.txt:last-child { margin-bottom:0; }

#column-01 ul > li { font-size:16px; font-size:1.6rem; }

#column-01 dl dd .flex { justify-content:space-between; }
#column-01 dl dd dl { width:400px; font-family:var(--m-plus-rounded-1c); }
#column-01 dl dd dl dt { line-height:1; font-size:20px; font-size:2.0rem; }
#column-01 dl dd dl dt strong { margin-right:0.5em; padding:0.2em 0.5em; background-color:#32823a; color:#ffffff; line-height:1; border-radius:1em; font-size:16px; font-size:1.6rem; }
#column-01 dl dd dl dd  { margin-bottom:20px; font-size:24px; font-size:2.4rem;  }
#column-01 dl dd dl dd strong { color:#32823a; font-size:36px; font-size:3.6rem;  }
#column-01 dl dd dl dd strong::before { content:'\027A1'; transform:rotate(90deg) scale(0.8, 1); display:inline-block; vertical-align:top; font-size:52px; font-size:5.2rem; }
#column-01 dl dd dl dd strong span { vertical-align:baseline; font-size:48px; font-size:4.8rem; }

#column-01 dl dd.y202207 dl { width:350px; }
#column-01 dl dd.y202307 dl { width:350px; }
/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
#column-01::before { background-image:url('../images/eco/bg_column_01@2x.png'); }
#column-01 h2::after { background-image:url('../images/eco/h2_001_after@2x.png'); }
}
/* ============ smart phone ============ */
@media (max-width:750px){
#column-01 { padding:calc(130/750*100vw) 0 calc(100/750*100vw); }
#column-01::before { height:calc(1350/750*100vw); background-image:url('../images/eco/bg_column_01_sp.png'); }
#column-01 h2 { position:relative; z-index:-2; }
#column-01 h2::after { display:none; }

#column-01 .contents > dl > dt { font-size:calc(36/750*100vw); }
#column-01 .contents > dl > dt small { margin-left:0; display:block; font-size:calc(28/750*100vw); }
#column-01 .contents > dl > dt sup { font-size:calc(20/750*100vw); }
#column-01 .contents > dl > dd { padding:calc(60/750*100vw) calc(40/750*100vw); }
#column-01 .contents > dl > dd .flex { flex-direction:column; }
#column-01 .contents > dl > dd .flex .text p.txt { text-align:center; font-size:calc(24/750*100vw); }
#column-01 .contents > dl > dd .flex .pict { margin:0 auto calc(50/750*100vw); width:100%; }
#column-01 .contents > dl > dd.y202207 .flex .pict { width:calc(492/750*100vw); }
#column-01 .contents > dl > dd.y202307 .flex .pict { width:calc(139/750*100vw); }
#column-01 .contents > dl > dd.y202507 .flex .pict { width:calc(169/750*100vw); }

#column-01 .contents > dl > dd > p.txt { font-size:calc(24/750*100vw); }

#column-01 ul > li { font-size:calc(22/750*100vw); }
#column-01 dl dd dl dt strong { margin-bottom:0.5em; width:4em; display:block; font-size:calc(22/750*100vw); }

#column-01 dl dd dl { width:auto; }
#column-01 dl dd dl dt { width:10em; text-align:right; font-size:calc(26/750*100vw); }
#column-01 dl dd dl dd { margin-top:calc(-52/750*100vw); padding:0 0 0 11em; font-size:calc(26/750*100vw); }
#column-01 dl dd dl dd strong { font-size:calc(48/750*100vw); }
#column-01 dl dd dl dd strong span { font-size:calc(52/750*100vw); }
#column-01 dl dd dl dd strong::before { font-size:calc(52/750*100vw); }
/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
#column-01::before { background-image:url('../images/eco/bg_column_01_sp@2x.png'); }
}
}
/************************************************************************
  #column-02
************************************************************************/
#column-02 { padding:120px 0; background:url('../images/eco/bg_2.png'); position:relative; z-index:0; overflow:hidden; }
#column-02::before { content:''; margin:auto; width:100%; height:calc(950/1200*100vw); background:url('../images/eco/bg_column_02.png') no-repeat; background-size:100% auto; position:absolute; top:0; right:0; left:0; display:block; pointer-events:none; z-index:-1; }
#column-02 h3 { color:#32823a; font-family:var(--m-plus-rounded-1c); font-size:24px; font-size:2.4rem; }
#column-02 h3::before { margin-right:0.2em; font-size:0.8em; }
#column-02 p.pict { margin-bottom:50px; text-align:center; }
#column-02 p.pict + p.txt { font-size:20px; font-size:2.0rem; }
#column-02 article { margin:60px auto 80px;  }
#column-02 article:last-child { margin-bottom:0; }
#column-02 article h3 { margin-bottom:1em; }

#column-02 .flex { margin:auto auto 50px; max-width:860px; justify-content:space-between; }
#column-02 .flex p.pict { margin-bottom:0; width:113px; }
#column-02 ol.marusuji > li { margin-bottom:0.5em; font-size:20px; font-size:2.0rem; }
#column-02 ol.marusuji > li:last-child { margin-bottom:0; }
#column-02 ol.marusuji > li::before { font-size:0.8em; }
/* .box */
#column-02 .box { padding:50px 60px; background-color:#ffffff; border:dotted 2px #32823a; border-radius:16px; display:flex; align-items:center; justify-content:space-between; }
#column-02 .box .text { order:2; width:580px; }
#column-02 .box .pict { order:1; margin:0 40px 0 auto; width:126px; }
#column-02 .box article { margin:0 0 25px; }
#column-02 .box article:last-child { margin-bottom:0; }
#column-02 .box h4 { margin-bottom:0.5em; color:#32823a; font-family:var(--m-plus-rounded-1c); font-size:16px; font-size:1.6rem; }
#column-02 .box h4::before { font-size:16px; font-size:1.6rem; }
#column-02 .box ul.disc { margin-bottom:1em;  }
#column-02 .box p.note { text-align:left; }
#column-02 .box p.note small { font-size:12px; font-size:1.2rem; }
#column-02 .box p.note a { color:#006835; text-decoration:underline; font-weight:bold; }

/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
#column-02::before { background-image:url('../images/eco/bg_column_02@2x.png'); }
}
/* ============ smart phone ============ */
@media (max-width:750px){
#column-02 { padding:calc(120/750*100vw) 0; }
#column-02::before { height:calc(650/750*100vw); background-image:url('../images/eco/bg_column_02_sp.png'); }
#column-02 p.pict { margin:auto auto calc(50/750*100vw); width:calc(599/750*100vw); }
#column-02 p.pict + p.txt { font-size:calc(28/750*100vw); }
#column-02 p.txt { font-size:calc(28/750*100vw); }
/* article */
#column-02 article h3 { font-size:calc(36/750*100vw); }
#column-02 article:nth-of-type(1) p.pict { width:calc(703/750*100vw); }
#column-02 article:nth-of-type(2) p.pict { margin-bottom:calc(35/750*100vw); width:calc(696/750*100vw); }
/* .flex */
#column-02 .flex { margin-bottom:calc(90/750*100vw); flex-direction:column; }
#column-02 .flex ol.marusuji { margin-bottom:calc(45/750*100vw); }
#column-02 .flex p.pict { width:calc(157/750*100vw); }
/* ol.marusuji */
#column-02 ol.marusuji > li { font-size:calc(28/750*100vw); }
#column-02 ol.marusuji > li span { width:calc(100% - 1.7em); display:inline-block; }
/* .box */
#column-02 .box { padding:calc(50/750*100vw); flex-direction:column; }
#column-02 .box .text { width:auto; }
#column-02 .box .text h4 { font-size:calc(28/750*100vw); }
#column-02 .box .text p.txt { font-size:calc(24/750*100vw); }
#column-02 .box .text ul.disc > li { font-size:calc(24/750*100vw); }
#column-02 .box .text p.note small { font-size:calc(20/750*100vw); }
#column-02 .box .text p.note small span { display:block; }
#column-02 article:nth-of-type(2) .box p.pict { margin:auto auto calc(35/750*100vw); width:calc(170/750*100vw); }
/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
#column-02::before { background-image:url('../images/eco/bg_column_02_sp@2x.png'); }
}
}
/************************************************************************
  #column-03
************************************************************************/
#column-03 { padding:120px 0 calc(50px + (160/1200*100vw)); background:url('../images/eco/bg.png'); position:relative; z-index:0; overflow:hidden; }
#column-03::after { content:''; margin:auto; width:100%; height:calc(160/1200*100vw); background:url('../images/eco/bg_column_03.png') no-repeat; background-size:auto 100%; display:block; position:absolute; bottom:0; right:0; left:0; z-index:-1; pointer-events:none; }
#column-03 h2 { margin-bottom:70px; }
#column-03 h3 { color:#32823a; text-align:center; letter-spacing:0.1em; font-family:var(--m-plus-rounded-1c); font-weight:800; font-size:36px; font-size:3.6rem; }
#column-03 h3 span { border-bottom:2px dotted #32823a; display:inline-block; }
#column-03 h3 sup { vertical-align:super; font-size:20px; font-size:2.0rem; }
/* .box */
#column-03 .box { padding-top:40px; text-align:center; position:relative; }
#column-03 .box::before { content:''; margin:auto; width:1079px; height:583px; background:url('../images/eco/bg_column_03_box.png') no-repeat; background-size:100% auto; position:absolute; top:-80px; left:-100px; }
#column-03 .box > p.pict { margin-bottom:120px; }
#column-03 .box p.note { font-size:16px; font-size:1.6rem; }
/* article */
#column-03 article { margin:auto; text-align:left; position:absolute; }
#column-03 article .flex { display:block; }
#column-03 article#y2016 { width:260px; bottom:0; left:-60px; }
#column-03 article#y2024 { width:260px; top:50px; left:-60px; }
#column-03 article#y2024 p.txt strong { width:240px; }
#column-03 article#y2025 { width:300px; top:160px; right:-130px; }
/* article::after */
#column-03 article::after { content:''; margin:auto; background-repeat:no-repeat; background-size:100% auto; display:block; position:absolute; }
#column-03 article#y2016::after { width:144px; height:80px; background-image:url('../images/eco/point_2016.svg'); top:-65px; right:-130px; }
#column-03 article#y2024::after { width:144px; height:115px; background-image:url('../images/eco/point_2024.svg'); top:15px; right:-144px; }
#column-03 article#y2025::after { width:169px; height:75px; background-image:url('../images/eco/point_2025.svg'); top:10px; left:-135px; }
/* h4 */
#column-03 article h4 { margin:auto auto 0.5em; padding:0.2em 2em; background-color:#32823a; color:#ffffff; border-radius:1em; line-height:1; /*font-family:var(--m-plus-rounded-1c); font-weight:600;*/ font-weight:normal; font-size:16px; font-size:1.6rem; display:inline-block; position:relative; }
#column-03 article h4::after { content:''; margin:auto; background-repeat:no-repeat; background-size:100% auto; display:block;  position:absolute; }
/* h4::after */
#column-03 article#y2016 h4::after { width:137px; height:144px; background-image:url('../images/eco/y2016.png'); top:0; bottom:0; right:-115px; }
#column-03 article#y2024 h4::after { width:106px; height:128px; background-image:url('../images/eco/y2024.png'); top:0; bottom:0; right:-120px; }
#column-03 article#y2025 h4::after { width:103px; height:113px; background-image:url('../images/eco/y2025.png'); top:0; bottom:0; right:-120px; }
/* h5 */
#column-03 article h5 { margin-bottom:0.5em; color:#32823a; font-family:var(--m-plus-rounded-1c); font-weight:600; font-size:32px; font-size:3.2rem; font-feature-settings:'palt'; }
#column-03 article h5.js-modal-button { position:relative; cursor:pointer; transition:0.5s; }
#column-03 article h5.js-modal-button:hover { transform:translate(0, 5px); }
#column-03 article h5.js-modal-button::after { content:''; margin-top:-0.2em; margin-left:0.2em; width:30px; height:30px; background:url('../images/eco/plus.svg') no-repeat; background-size:100% auto; display:inline-block; vertical-align:middle; }
#column-03 article h5 small { font-size:20px; font-size:2.0rem; }
#column-03 article p.txt { color:#333333; line-height:calc(26/16); font-size:16px; font-size:1.6rem; word-break:normal; font-feature-settings:'palt'; }
#column-03 article p.txt strong { margin-bottom:0.5em; line-height:calc(32/20); font-weight:normal; font-size:20px; font-size:2.0rem; display:inline-block; word-break:normal; }
#column-03 article p.txt strong:last-child { margin-bottom:0; }
/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
#column-03::after { background-image:url('../images/eco/bg_column_03@2x.png'); }
#column-03 .box::before { background-image:url('../images/eco/bg_column_03_box@2x.png'); }
#column-03 article#y2016 h4::after { background-image:url('../images/eco/y2016@2x.png'); }
#column-03 article#y2024 h4::after { background-image:url('../images/eco/y2024@2x.png'); }
#column-03 article#y2025 h4::after { background-image:url('../images/eco/y2025@2x.png'); }
}
/* ============ tablet ============ */
@media (max-width:1024px){
#column-03 .contents { padding:calc(30/1200*100vw); max-width:calc(1140/1200*100vw); }
#column-03 .box::before { margin:auto; width:calc(1079/1200*100vw); top:calc(-80/1200*100vw); right:0; left:0; }
#column-03 .box > p.pict { margin-right:auto; margin-left:auto; width:calc((830*0.7)/1200*100vw); }
#column-03 article h4 { font-size:calc(20/1200*100vw); }
#column-03 article h5 { font-size:calc(40/1200*100vw); }
#column-03 article h5 small { font-size:calc(24/1200*100vw); }
#column-03 article p.txt { font-size:calc(20/1200*100vw); }
#column-03 article p.txt strong { font-size:calc(24/1200*100vw); }
/* #y2016 */
#column-03 article#y2016 { width:calc(300/1200*100vw); bottom:calc(40/1200*100vw); left:calc(-20/1200*100vw); }
#column-03 article#y2016::after { width:calc(144/1200*100vw); height:calc(80/1200*100vw); top:calc(-65/1200*100vw); right:calc(-140/1200*100vw); }
#column-03 article#y2016 h4::after { width:calc(137/1200*100vw); height:calc(144/1200*100vw); right:calc(-120/1200*100vw); }
/* #y2024 */
#column-03 article#y2024 { width:calc(260/1200*100vw); top:calc(70/1200*100vw); left:calc(-20/1200*100vw); }
#column-03 article#y2024::after { width:calc(144/1200*100vw); height:calc(115/1200*100vw); top:calc(55/1200*100vw); right:calc(-184/1200*100vw); }
#column-03 article#y2024 h4::after { width:calc(106/1200*100vw); height:calc(128/1200*100vw); right:calc(-120/1200*100vw); }
#column-03 article#y2024 p.txt strong { width:calc(280/1200*100vw); }
/* #y2025 */
#column-03 article#y2025 { width:calc(280/1200*100vw); top:calc(110/1200*100vw); right:calc(-40/1200*100vw); }
#column-03 article#y2025::after { width:calc(169/1200*100vw); height:calc(75/1200*100vw); top:calc(20/1200*100vw); left:calc(-185/1200*100vw); }
#column-03 article#y2025 h4::after { width:calc(103/1200*100vw); height:calc(113/1200*100vw); right:calc(-120/1200*100vw);
}
#column-03 article#y2025 .flex p.pict { width:calc(89/1200*100vw); }
#column-03 .box p.note { font-size:calc(20/1200*100vw); }
}
/* ============ smart phone ============ */
@media (max-width:750px){
#column-03 { padding:calc(130/750*100vw) 0 calc((40+169)/750*100vw); background:url('../images/eco/bg.png'); }
#column-03::after { height:calc(169/750*100vw); background-image:url('../images/eco/bg_column_03_sp.png'); }
#column-03 h2 { margin-bottom:calc(50/750*100vw); }
#column-03 h3 { font-size:calc(44/750*100vw); }
#column-03 h3 sup { font-size:calc(24/750*100vw); }
/* .box */
#column-03 .box::before { width:100%; height:calc(780/750*100vw); background-image:url('../images/eco/bg_column_03_box_sp.png'); top:0; right:0; left:0; }
#column-03 .box > p.pict { margin:auto auto calc(60/750*100vw); width:calc(415/750*100vw); }
/* article */
#column-03 article { margin-bottom:calc(65/750*100vw); width:auto; position:static; }
#column-03 article::after { display:none; }
#column-03 article .flex { display:flex; }
#column-03 article#y2016 { width:auto; }
#column-03 article#y2024 { width:auto; }
#column-03 article#y2025 { width:auto; }
#column-03 article h4 { margin-bottom:0.8em; padding:0.5em 0; width:100%; text-align:center; font-size:calc(26/750*100vw); }
#column-03 article h5 { margin-bottom:0.2em; font-size:calc(40/750*100vw); }
#column-03 article h5.js-modal-button::after { width:calc(48/750*100vw); height:calc(48/750*100vw); }
#column-03 article h5 small { font-size:calc(26/750*100vw); }
#column-03 article p.txt { font-size:calc(24/750*100vw); }
#column-03 article p.txt strong { font-size:calc(24/750*100vw); }
#column-03 .box p.note { font-size:calc(24/750*100vw); }
/* #y2016 */
#column-03 article#y2016 h4::after { width:calc(185/750*100vw); height:calc(194/750*100vw); top:auto; bottom:calc(-190/750*100vw); right:calc(10/750*100vw); }
#column-03 article#y2016 p.txt { width:calc(490/750*100vw); }
#column-03 article#y2016 p.txt strong br { display:none; }
/* #y2024 */
#column-03 article#y2024 h4::after { width:calc(140/750*100vw); height:calc(169/750*100vw); top:calc(70/750*100vw); bottom:auto; right:calc(10/750*100vw); }
#column-03 article#y2024 p.txt strong { width:auto; }
/* #y2025 */
#column-03 article#y2025 h4::after { width:calc(124/750*100vw); height:calc(135/750*100vw); top:calc(70/750*100vw); bottom:auto; right:calc(10/750*100vw); }
#column-03 article#y2025 .flex h5 { order:2; }
#column-03 article#y2025 .flex p.pict { order:1; margin-right:calc(35/750*100vw); width:calc(116/750*100vw); }
/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
#column-03::after { background-image:url('../images/eco/bg_column_03_sp@2x.png'); }
#column-03 article#y2016 h4::after { background-image:url('../images/eco/y2016@2x.png'); }
#column-03 article#y2024 h4::after { background-image:url('../images/eco/y2024@2x.png'); }
#column-03 article#y2025 h4::after { background-image:url('../images/eco/y2025@2x.png'); }
}
}
/************************************************************************
  modal
************************************************************************/
.layer { background:rgba(255,255,255,0.8); display:flex; align-items:center; justify-content:center; }
.close-button { width:30px; height:30px; background-color:#ffffff; border:4px solid #32823a; position:absolute; top:0; }
.close-button span { margin:auto; width:15px; height:3px; background-color:#32823a; top:0; bottom:0; right:0; left:0; }
.modal__inner { padding:40px; max-width:720px; background-color:#32823a; color:#ffffff; position:relative; }
.modal__inner p { word-break:normal; }
.modal__inner p.txt { margin-bottom:1.5em; font-size:20px; font-size:2.0rem; }
.modal__inner p.note { text-align:left; line-height:calc(32/20); letter-spacing:0.025em; font-size:18px; font-size:1.8rem; }
.modal__inner p.note a { color:#ffffff; border-bottom:1px dotted #ffffff; display:inline-block; position:relative; }
.modal__inner p.note a::after { content:''; margin:auto; width:14px; height:12px; background:url('../images/eco/icon_external_link.svg') no-repeat; background-size:100% auto; position:absolute; top:0; bottom:0; right:-20px; display:inline-block; }
.modal__content { padding:0; }

/* ============ smart phone ============ */
@media (max-width:750px){
.modal { width:auto; min-width:initial; }
.modal__inner { margin:auto calc(50/750*100vw); padding:calc(50/750*100vw); max-width:initial; }
.modal__inner p.txt { font-size:calc(28/750*100vw); }
.modal__inner p.note { font-size:calc(24/750*100vw); }

.modal__button-wrap { margin:auto; width:calc(60/750*100vw); top:auto; bottom:calc(-30/750*100vw); right:0; left:0; }
.close-button { width:calc(60/750*100vw); height:calc(60/750*100vw); position:relative; }
}