@charset "utf-8";

/* ========================================================================

  2025_a.css

======================================================================== */

body#c-2025-a main { border-top:1px solid #e5e5e5; }
body#c-2025-a main * { word-break:normal; }

/************************************************************************
  #main-image
************************************************************************/
.campaign #main-image h1 { margin:auto; padding-top:min(100%, 1097px); max-width:1100px; background-image:url('../images/main_image.png'); background-repeat:no-repeat; background-size:100% auto; }
.campaign #main-image p.note small { font-size:0; }

/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
.campaign #main-image h1 { background-image:url('../images/main_image@2x.png'); }
}

/* ============ smart phone ============ */
@media (max-width:750px){
.campaign #main-image h1 { padding-top:0; height:calc(1455/750*100vw); background-image:url('../images/main_image_sp.png'); }

/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
.campaign #main-image h1 { background-image:url('../images/main_image_sp@2x.png'); }
}
}
/************************************************************************
  #period
************************************************************************/
body#c-2025-a #period { margin-bottom:120px; }
body#c-2025-a #period { width:auto; height:150px; background-color:#1f7a21; display:flex; justify-content:center; align-items:center; }
body#c-2025-a #period::before { display:none; }
body#c-2025-a #period span { width:880px; height:89px; background-image:url('../images/period.svg'); background-repeat:no-repeat; background-size:100% auto; display:block; }

/* ============ smart phone ============ */
@media (max-width:750px){
body#c-2025-a #period { margin-bottom:calc(120/750*100vw); }
body#c-2025-a #period span { width:calc(649/750*100vw); height:calc(138/750*100vw); background-image:url('../images/period_sp.svg'); }
}
/************************************************************************
  .column
************************************************************************/
body#c-2025-a .column h2 { background-color:#5a3c27; }
body#c-2025-a .column h2::after { border-top-color:#5a3c27; }
/************************************************************************
  .box
************************************************************************/
body#c-2025-a .box { border:0; }

/************************************************************************
  #prize-details
************************************************************************/
#prize-details * { word-break:normal; }
#prize-details .box { padding-left:380px; height:406px; background-color:#f7f7f7; overflow:hidden; position:relative; z-index:0; display:flex; flex-direction:column; justify-content:center; }
#prize-details ul { margin-bottom:20px; font-family:var(--m-plus-rounded-1c); }
#prize-details ul { color:#5a3c27; font-weight:800; font-size:28px; font-size:2.8rem; }
#prize-details p { margin-left:40px; color:#333333; font-family:var(--m-plus-rounded-1c); font-weight:500; }
#prize-details p.txt { margin-bottom:10px; font-size:20px; font-size:2.0rem; }
#prize-details p.txt small { font-size:16px; font-size:1.6rem; }
#prize-details p.note { text-align:left; }
#prize-details p.note small { font-size:14px; font-size:1.4rem; }

#prize-details .box::before { content:''; margin:auto; width:1000px; height:406px; background:url('../images/photo_prize_details.png') no-repeat center; background-size:100%  auto; display:block; position:absolute; top:0; bottom:0; right:0; left:0; z-index:-1; }

/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
#prize-details .box::before { background-image:url('../images/photo_prize_details@2x.png'); }
}
/* ============ smart phone ============ */
@media (max-width:750px){
#prize-details .box { padding:calc(480/750*100vw) calc(40/750*100vw) calc(50/750*100vw); height:auto; border-radius:calc(14/750*100vw); }
#prize-details .box::before { width:calc(690/750*100vw); height:calc(939/750*100vw); background-image:url('../images/photo_prize_details_sp.png'); top:0; bottom:auto; right:0; left:0; }
#prize-details ul { font-size:calc(36/750*100vw); }
#prize-details p { margin-left:0; }
#prize-details p.txt { font-size:calc(26/750*100vw); }
#prize-details p.txt small { font-size:calc(20/750*100vw); }
#prize-details p.note small { font-size:calc(20/750*100vw); }

/* ============ for high resolution ============ */
@media only screen and (-webkit-min-device-pixel-ratio:2){
#prize-details .box::before { background-image:url('../images/photo_prize_details_sp@2x.png'); }
}
}
/************************************************************************
  #product-list
************************************************************************/
body#c-2024-a #product-list { padding-top:125px; }
body#c-2025-a #product-list h3 { background-color:#5a3c27; }

/* ul.line-up */
body#c-2025-a #product-list ul.line-up li { margin-right:0; width:160px; }
body#c-2025-a #product-list #honjikomi ul { width:520px; }
body#c-2025-a #product-list #neo ul { width:700px; justify-content:space-between; }
body#c-2025-a #product-list #neo ul li { width:170px; }
body#c-2025-a #product-list #fuwashiro { padding-bottom:10px; }
body#c-2025-a #product-list #fuwashiro ul { width:340px; justify-content:space-between; }
/* a.btn ================== */
body#c-2025-a #product-list a.btn { width:435px; background-color:#ffea60; color:#301103; border-radius:12px; box-shadow:3px 5px #5a3c27; }
body#c-2025-a #product-list a.btn:hover { background-color:#5a3c27; color:#ffea60; box-shadow:3px 5px #ffea60; }
body#c-2025-a #product-list a.btn::before { display:none; }
body#c-2024-a a.btn { width:100%; max-width:initial; background-color:#ea5413; color:#ffffff; border:0; box-shadow:3px 5px #5e2106; font-weight:bold; font-size:18px; font-size:1.8rem; position:relative; }
body#c-2025-a a.link-sns::before { border-left-color:#333333; }
body#c-2025-a a.icon-instagram.link-sns::after { background-image:url('../../images/icon_instagram_dark_gray.svg'); }
/* #recipe */
#recipe { padding:70px 0 0; text-align:center; }
/* ============ smart phone ============ */
@media (max-width:750px){
body#c-2025-a #product-list ul.line-up { margin:0 0 calc(70/750*100vw); width:auto !important; justify-content:flex-start; }
body#c-2025-a #product-list ul.line-up li { width:50% !important; }
body#c-2025-a #product-list ul.line-up li img { width:80%; }
/* a.btn ================== */
body#c-2025-a #product-list a.btn { width:auto; font-size:calc(26/750*100vw); }
/* #recipe */
#recipe { padding:calc(80/750*100vw) calc(30/750*100vw) 0; text-align:center; }
}
/************************************************************************
  #application
************************************************************************/
body#c-2025-a #application dt { background-color:#5a3c27; border-radius:20px; position:relative; }
body#c-2025-a #application dt::before { content:''; margin:auto; width:0.8em; height:0.8em; background-color:#ffffff; border-radius:50%; display:inline-block; vertical-align:middle; position:absolute; top:0; bottom:0; left:0.4em; }
body#c-2025-a #application dd.period strong { color:#583e08; }

body#c-2025-a dd.flex div { order:2; margin-left:30px; width:calc(100% - (141px + 30px)); }
body#c-2025-a dd p.sample { order:1; margin-left:0; width:141px; }
body#c-2025-a #application dd strong { font-weight:normal; }
/* ============ smart phone ============ */
@media (max-width:750px){
}
/************************************************************************
  #application
************************************************************************/
body#c-2024-s #application dt { background-color:#008e3f; position:relative; }
body#c-2024-s #application dt::before { content:''; margin:auto; width:0.8em; height:0.8em; background-color:#ffffff; border-radius:1em; line-height:1; display:inline-block; position:absolute; top:0; bottom:0; left:0.5em; }
body#c-2024-s #application dt.privacy-policy span { transform:scale(0.92, 1); display:inline-block; }

body#c-2024-s #application dd.period strong { color:#008e3f; }
body#c-2024-s #application dd.destination a.btn { box-shadow:none }
body#c-2024-s #application dd.destination a.btn::before { background-image:url('../../images/icon_dl_deep_green.svg');
}
body#c-2024-s #application dd.destination a.btn:hover::before { background-image:url('../../images/icon_dl_pale_yellow.svg');
}
body#c-2024-s dd ol { background-color:#f7f7f7; border:1px solid #efefef; }

b.application-ticket { margin:0 0.3em; padding:0.2em; background-color:#e1efe2; color:#008e3f; line-height:1; display:inline-block; }
/* ============ smart phone ============ */
@media (max-width:750px){
body#c-2024-a dd.flex { flex-direction:column; }
body#c-2024-a dd.flex div { margin-bottom:calc(40/750*100vw); width:auto; }
body#c-2024-a dd.flex div { margin-bottom:calc(40/750*100vw); width:auto; }
body#c-2024-a dd p.sample { margin:auto; width:calc((196*1.2)/750*100vw); }

}
/************************************************************************
  ul.accordion
************************************************************************/
ul.accordion li { word-break:normal; }
ul.accordion > li { margin-bottom:5px; background-color:rgba(204,204,204,0.16); border:1px solid #efefef; border-radius:6px; }

/* h3 */
ul.accordion li h3 { padding:25px 60px 25px 25px; color:#583e08; line-height:1; word-break:normal; font-size:18px; font-size:1.8rem; position:relative; }
ul.accordion li h3::after { content:''; margin:auto; width:7px; height:7px; border-top:solid 2px #583e08; border-right:solid 2px #583e08; display:block; position:absolute; top:0; bottom:0; right:25px; transform:rotate(135deg); transition:0.5s; }
ul.accordion li.active h3::after { transform:rotate(-45deg); }
ul.accordion li h3 span { line-height:1.2; word-break:normal; }

ul.accordion li a { text-decoration:underline; }
ul.accordion li .box { padding:0 40px 25px; display:none; }
ul.accordion li .box article { padding:35px 0 0; }
ul.accordion li .box article h4 { margin-bottom:0.5em; font-weight:normal; font-size:14px; font-size:1.4rem; }
ul.accordion li .box article button { width:80px; height:30px; border:0; border-radius:6px; font-size:14px; font-size:1.4rem; cursor:pointer; transition:0.5s; }
ul.accordion li .box article button.yes { background-color:#5a3c27; color:#ffffff; }
ul.accordion li .box article button.no { background-color:#ffffff; color:#333333; border:1px solid rgba(94,94,94,0.2); }
ul.accordion li .box article button.yes:hover { background-color:rgba(0,142,63,0.6); }

ul.accordion li .box ol { margin-top:10px; padding:25px 60px; background-color:#ffffff; border:1px solid #d8d8d8; border-radius:6px; font-size:12px; font-size:1.2rem; }
/* .icon-dl */
body#c-2025-a a.btn.icon-dl { width:100%; max-width:initial; background-color:#ea5404; color:#ffffff; box-shadow: 3px 5px #9e3801; border-radius:10px; font-size:18px; font-size:1.8rem; }
body#c-2025-a a.btn.icon-dl:hover { background-color:#9e3801; box-shadow: 3px 5px #ea5404; }
body#c-2025-a a.btn.icon-dl:hover::before { background-image:url('../../images/icon_dl_brown.svg'); }

ul.accordion li .box b.application-ticket { background-color:transparent; text-decoration:underline; }
.adobe-reader { padding:10px 0; }

ul.accordion li .flex .text { width:calc(100% - 170px); }
ul.accordion li .flex .img.sample { width:170px; text-align:right; }

/* ============ smart phone ============ */
@media (max-width:750px){
ul.accordion li h3 { padding:calc(30/750*100vw) calc(80/750*100vw) calc(30/750*100vw) calc(30/750*100vw); font-size:calc(28/750*100vw); }
/* .box */
ul.accordion li .box { padding:0 calc(30/750*100vw) calc(30/750*100vw) calc(50/750*100vw); display:none; }
/* .flex */
ul.accordion li .flex .text { margin-bottom:calc(20/750*100vw); width:calc(100% - ((127 + 30)/750*100vw)); word-break:normal; }
ul.accordion li .flex .img.sample { margin:auto; width:calc(127/750*100vw); text-align:right; }
/* .contact */
ul.accordion li .contact .contents h4 { white-space:nowrap; }
ul.accordion li .contact .contents h4::before { margin-right:0.2em; }

/* .icon-dl */
body#c-2025-a a.btn.icon-dl { font-size:calc(28/750*100vw); }
}
/************************************************************************
  #contact
************************************************************************/
body#c-2025-a #contact .contents { background-color:#ffffff; border-color:#1f7a21; }
body#c-2025-a #contact .contents h2 { margin-bottom:20px; padding-left:40px; height:35px; color:#1f7a21; display:flex; align-items:center; position:relative; }
body#c-2025-a #contact .contents h2::before { width:11px; height:19px; background-image:url('../../images/question_mark.svg'); position:absolute; left:12px; z-index:1; }
body#c-2025-a #contact .contents h2::after { content:''; width:35px; height:35px; background-color:#1f7a21; border-radius:50%; display:flex; position:absolute; top:0; left:0; }
body#c-2024-a #contact .contents dl dd { margin-top:-5px; }

/* ============ smart phone ============ */
@media (max-width:750px){
body#c-2024-a #contact .contents h2 { margin-bottom:calc((20*1.5)/750*100vw); padding-left:calc((40*1.5)/750*100vw); height:calc((35*1.5)/750*100vw); }
body#c-2024-a #contact .contents h2::before { width:calc((11*1.5)/750*100vw); height:calc((19*1.5)/750*100vw); left:calc((12*1.5)/750*100vw); }
body#c-2024-a #contact .contents h2::after { width:calc((35*1.5)/750*100vw); height:calc((35*1.5)/750*100vw); }
}
/************************************************************************
  #end-notice
************************************************************************/
#end-notice .box { background-color:#ffec70; }
#end-notice .bg { background-position:center -40px }
#end-notice p.period { color:#ea5514; font-size:18px; font-size:1.8rem; }
/* #contact */
.campaign #contact .contents { border-color:#1f7a21; }
.campaign #contact .contents h2 { color:#1f7a21; }
.campaign #contact .contents h2::after { background-color:#1f7a21; }
/* ============ smart phone ============ */
@media (max-width:750px){
#end-notice p.period { font-size:calc(28/750*100vw); }

.campaign #contact { margin-right:0; margin-left:0; }
.campaign #contact .contents h2 { margin-bottom:calc((20*1.2)/750*100vw); padding-left:calc((40*1.2)/750* 100vw); height:calc((35*1.2)/750*100vw); font-szie:calc(28/750*100vw); }
.campaign #contact .contents h2::before { margin:auto; width:calc((11*1.2)/750*100vw); height:calc((19*1.2)/750* 100vw); top:0; bottom:0; left:calc((12*1.2)/750*100vw); }
.campaign #contact .contents h2::after { margin:auto; width:calc((35*1.2)/750*100vw); height:calc((35*1.2)/750*100vw); top:0; bottom:0; }
}
