@charset "utf-8";
/* ========================================
   BAGUS Framework 2.0
======================================== */

.manual-guide{margin:0}
.manual-group{margin:0 0 80px}
.manual-group:last-child{margin-bottom:0}

/* Grid */
.manual-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}

/* Card */
.manual-card{min-height:230px;display:flex;position:relative;flex-direction:column;padding:30px 30px 55px;color:#555;background:#fff;border:1px solid #e6e0d8;border-radius:10px;text-decoration:none;box-shadow:0 5px 15px #0000000a;transition:transform .4s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .3s}
.manual-card:hover{color:#555;border-color:#8b6d46;transform:translateY(-5px);box-shadow:0 10px 25px #00000014}

/* Number */
.manual-number{display:block;font-family:Arial,sans-serif;font-size:.7rem;margin:0 0 12px;letter-spacing:.15em;color:#999}

/* Card Title */
.manual-card-title{font-size:1.15rem;font-weight:500;margin:0 0 18px;padding:0 0 14px;color:#8b6d46;border-bottom:1px solid #e6e0d8}
.manual-title-row{display:flex;align-items:center;gap:20px;margin:0 0 18px;padding:0 0 14px;border-bottom:1px solid #e6e0d8}
.manual-title-row .manual-card-title{margin:0;padding:0;border:0;flex:1}

/* Safety */
.manual-label{display:inline-block;font-size:.75rem;line-height:1.5;padding:5px 10px;color:#fff;background:#d45b5b;border-radius:4px;flex-shrink:0;transform:translateY(6px)}

/* Description */
.manual-description{margin:0;line-height:1.9}

/* Arrow */
.manual-arrow{font-size:1.2rem;position:absolute;right:25px;bottom:20px;color:#8b6d46;transition:transform .25s}
.manual-card:hover .manual-arrow{transform:translateX(5px)}

/* Safety */
.manual-label{display:inline-block;font-size:.75rem;line-height:1.5;margin:0 0 12px;padding:5px 10px;color:#fff;background:#d45b5b;border-radius:4px;align-self:flex-start}
.manual-card.important:hover{border-color:#d45b5b;box-shadow:0 10px 25px #d45b5b1f}

/* ==================================================
   Manual
================================================== */

/* Manual (Common) */
.manual-section{position:relative}

/* Block */
.manual-block{margin:70px 0 0}
.manual-block:first-of-type{margin-top:50px}

/* Text */
.manual-text{margin:25px 0;line-height:2}
.manual-text:last-child{margin-bottom:0}

/* Image */
.manual-image{margin:35px auto;text-align:center}
.manual-image img{width:100%;height:auto;display:block;margin:auto}

/* Image Width */
.manual-image.small img{max-width:500px}
.manual-image.medium img{max-width:700px}
.manual-image.large img{max-width:100%}

/* Caption */
.manual-caption{margin:12px 0 0;color:#777;font-size:.85rem;line-height:1.7;text-align:center}

/* Manual Alert */
.manual-alert{--alert-color:#777;--alert-bg:#fafafa;border:2px solid var(--alert-color);background:var(--alert-bg);border-radius:8px;margin:35px 0;overflow:hidden}
.manual-alert.warning{--alert-color:#d45b5b;--alert-bg:#fff7f7}
.manual-alert.caution{--alert-color:#d59b35;--alert-bg:#fffaf0}
.manual-alert.info{--alert-color:#5798d2;--alert-bg:#f5f9fc}
.manual-alert-title{color:#fff;background:var(--alert-color);margin:0;padding:12px 18px;font-size:1rem;font-weight:500}
.manual-alert-body{padding:20px}
.manual-alert-body p{margin:0 0 15px;line-height:1.9}
.manual-alert-body p:last-child{margin-bottom:0}

/* Manual Rules */
.manual-rules{margin:25px 0;padding:0}
.manual-rules li{margin:0;padding:20px 0;display:flex;border-bottom:1px solid #e6e0d8;align-items:flex-start;gap:18px}
.manual-rules li:first-child{border-top:1px solid #e6e0d8}
.manual-rules p{margin:0;line-height:1.9;flex:1}
.manual-symbol{min-width:54px;font-size:.75rem;text-align:center;padding:5px 8px;border-radius:4px;flex-shrink:0}
.prohibited .manual-symbol{color:#fff;background:#d45b5b}
.required .manual-symbol{color:#fff;background:#5798d2}

/* Manual Steps */
.manual-steps{margin:35px 0;padding:0;counter-reset:manual-step}
.manual-step{margin:0;padding:35px 0;display:grid;grid-template-columns:70px 1fr;border-bottom:1px solid #e6e0d8;gap:25px}
.manual-step:first-child{border-top:1px solid #e6e0d8}
.step-number{width:54px;height:54px;font-family:Arial,sans-serif;font-size:.8rem;display:flex;color:#fff;letter-spacing:.05em;background:#8b6d46;border-radius:50%;justify-content:center;align-items:center}
.step-content{min-width:0}
.step-title{font-size:1.15rem;font-weight:500;line-height:1.7;margin:0 0 20px;color:#8b6d46}

.manual-subtitle{font-size:1.1rem;font-weight:500;line-height:1.7;margin:0;color:#8b6d46}
.step-content p{line-height:1.9}

/* Product Set */
.product-set{margin:0 0 20px;padding:30px 25px;display:grid;background:#fff;border:3px solid #bbb;border-radius:12px;grid-template-columns:repeat(5,minmax(0,1fr));gap:25px}
.product-set-item{text-align:center;min-width:0}
.product-set-item p{font-weight:400;margin:0;line-height:1.7}
.product-set-item img{object-fit:contain;width:100%;height:180px;margin:0 auto 20px;display:block;transition:transform .4s cubic-bezier(.16,1,.3,1)}
.product-set-item img:hover{transform:scale(1.06)}
.product-set .refer{width:100%;display:block}

/* Part Names */
.part-names-layout{margin:35px 0 70px;display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,1.35fr) minmax(0,1fr);align-items:center;gap:35px}
.part-names-list{min-width:0}
.part-names-list .numbered-list{margin:0;padding:0}
.part-names-list .numbered-list li{margin-bottom:24px}
.part-names-list .numbered-list li:last-child{margin-bottom:0}
.part-names-image{min-width:0;text-align:center}
.part-names-image img{width:100%;max-width:520px;height:auto;margin:40px auto;display:block;transition:transform .4s cubic-bezier(.16,1,.3,1)}
.part-names-image img:hover{transform:scale(1.03)}

/* Part Names (Numbered) */
.part-names-right .numbered-list{counter-reset:number 4}
.side .numbered-list{counter-reset:number 9}
.back .numbered-list{counter-reset:number 12}
.code .numbered-list{counter-reset:number 16}

/* Product Set / Part Names (br) */
#IncludedParts .first,#IncludedParts .second,#IncludedParts small{display:block}
#MainUnit .first{display:block;margin-left:-8px}
#MainUnit .widescreen .SP,#MainUnit .SP{display:none}
#MainUnit .widescreen .PC{display:inline}

/* ==================================================
   Safety Guide
================================================== */

.safety-guide{margin:40px 0}
.safety-table{width:100%;margin:0;border-collapse:collapse;background:#fff}
.safety-table th,.safety-table td{line-height:1.8;border:1px solid #999;vertical-align:middle}
.safety-table th{width:175px;font-weight:500;padding:15px 0 15px 20px;text-align:left}
.safety-table td{padding:15px 20px}

/* Symbol */
.safety-symbol{font-size:1.25rem;line-height:1.4;display:flex;align-items:center;gap:15px}
.safety-symbol img{width:42px;height:42px;object-fit:contain;flex-shrink:0}

/* Description */
.safety-guide-note{font-weight:500;line-height:1.8;position:relative;margin:16px 0;padding-left:1.2em}
.safety-guide-note:before{content:"";width:8px;height:8px;position:absolute;top:.65em;left:0;background:#333}

/* ==================================================
   Safety Box
================================================== */

.safety-box{margin:40px 0;overflow:hidden;background:#fff;border:2px solid #333;border-radius:12px}
.disclaimer-box{margin-bottom:70px}

/* Title */
.safety-box-title{display:grid;grid-template-columns:48px auto 1fr;padding:10px 18px;background:#ccc;align-items:center;gap:15px}
.safety-box-title img{width:42px;height:42px;object-fit:contain}
.safety-box-heading{font-size:1.35rem;font-weight:500;white-space:nowrap}
.safety-box-title p{line-height:1.7;margin:0}

/* Body */
.safety-rule{display:grid;grid-template-columns:55px minmax(0,1fr) 140px;padding:10px 0;gap:15px}
.upper-part{padding-bottom:60px}
.lower-part{padding-top:60px}

.safety-rule+.safety-rule{border-top:1px solid #777}
.safety-rule-icon img{width:42px;height:42px;display:block;object-fit:contain}
.safety-rule-content{min-width:0}

/* Diamond List */
.diamond-list{margin:0;padding:0}
.diamond-list li{position:relative;margin:0 0 8px;padding-left:1.35em;line-height:1.8}
.diamond-list li:last-child{margin-bottom:0}
.diamond-list li:before{content:"◇";position:absolute;top:0;left:0}
.diamond-list li.red:before{color:#d45b5b}

/* Illustration */
.safety-rule-image,.safety-rule-images{display:flex;justify-content:center;align-items:center}
.safety-rule-image img,.safety-rule-images img{width:100%;height:auto;display:block;object-fit:contain;transition:transform .6s cubic-bezier(.22,1,.36,1);transform:scale(1)}
.safety-rule-image img:hover,.safety-rule-images img:hover{transform:scale(1.05)}
.safety-rule-images{flex-direction:column;gap:15px}
.safety-rule-images img{max-width:110px}

/* Safety Box Theme */
.safety-box-body{padding:20px}
.warning-box .safety-box-title{background:#ccc}
.caution-box .safety-box-title{background:#d9d9d9}
.disclaimer-box .safety-box-title{display:block;padding:8px 20px;color:#fff;background:#999}
.disclaimer-box .safety-box-heading{font-size:1.2rem}

/* ==================================================
   Operation Guide
================================================== */

.operation-guide{margin:35px 0 70px}
.operation-image{margin:0 0 20px;padding:25px;background:#fff;border:1px solid #ddd;border-radius:12px}
.operation-image img{width:100%;height:auto;margin:auto;display:block}
.operation-image img{width:100%;height:auto;display:block;object-fit:contain;transition:transform .6s cubic-bezier(.22,1,.36,1);transform:scale(1)}
.operation-image img:hover{transform:scale(1.05)}

/* Operation List */
.operation-list{margin:80px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.operation-item{padding:20px;background:#fcfaf7;border:1px solid #e6e0d8;border-radius:8px}
.operation-item dt{margin:0 0 10px;font-weight:600;line-height:1.6;display:flex;color:#8b6d46;align-items:center;gap:12px}
.operation-item dd{margin:0;padding-left:42px;line-height:1.8}

/* A - K */
.operation-symbol{width:30px;height:30px;font-family:Arial,sans-serif;font-size:.85rem;font-weight:500;display:flex;color:#8b6d46;background:#fff;border:1px solid #8b6d46;border-radius:50%;flex:0 0 30px;justify-content:center;align-items:center}

/* ==================================================
   Preparation
================================================== */

/* Preparation (Common) */
.preparation-steps{margin:80px 0 0}
#Preparation .preparation-steps img{width:100%;height:auto;display:block;object-fit:contain;transition:transform .6s cubic-bezier(.22,1,.36,1);transform:scale(1)}
#Preparation .preparation-steps img:hover{transform:scale(1.05)}
.preparation-title{align-items:center;gap:16px;margin:0 0 35px;display:flex}
.preparation-title p{margin:0;font-size:1.3rem;font-weight:600;line-height:1.6}
.preparation-number{width:44px;height:44px;font-size:1.2rem;display:flex;color:#fff;background:#999da6;border-radius:50%;flex:0 0 44px;justify-content:center;align-items:center}
.preparation-check{display:flex;position:absolute;top:50%;left:0;color:#fff;background:#174b9b;border-radius:50%;justify-content:center;align-items:center;transform:translate(-50%,-50%)}

/* Preparation Step 01 */
.preparation-head{margin:0 0 25px;display:flex;justify-content:space-between;align-items:center;gap:30px}
.preparation-head .preparation-title{min-width:0;margin-bottom:0}
.preparation-caution{width:max-content;max-width:100%;margin:0;padding:8px 0 10px 28px;font-weight:500;display:flex;position:relative;color:#d45b5b;background:#fff;border:2px solid #174b9b;border-radius:10px;flex-shrink:0;align-items:center}
.preparation-caution .preparation-check{width:32px;height:32px;font-size:1.1rem;font-weight:700}
.preparation-caution p{line-height:1.6;margin:0}
.preparation-flow-grid{display:grid;grid-template-columns:minmax(0,1.4fr) 40px minmax(0,1.4fr) 40px minmax(150px,.65fr);grid-template-areas:"step01 arrow01 step02 arrow02 step03""tip. . . .";align-items:center;gap:20px 10px}
.process01{grid-area:step01}
.process02{grid-area:step02}
.process03{grid-area:step03}
.arrow01{grid-area:arrow01}
.arrow02{grid-area:arrow02}
.preparation-process{width:100%;padding:15px;text-align:center;background:#f7f7f8;border:1px solid #ddd;border-radius:18px}
.preparation-process-images{display:grid;align-items:center;gap:12px}
.process01-images{grid-template-columns:1.35fr 1fr}
.process02-images{grid-template-columns:1fr 55px 1fr}
.preparation-process img{width:100%;height:170px;margin:auto;display:block;object-fit:contain}
.process03 img{max-width:200px}
.process-inner-arrow{width:55px!important;height:auto!important}
.preparation-process-caption{margin:24px 0 0;font-weight:500;line-height:1.5;display:flex;justify-content:center;align-items:center;gap:10px}
.preparation-process-caption span{font-size:1.3rem;font-weight:600}
.preparation-process-arrow{text-align:center;font-size:2rem;font-weight:600}
.preparation-tip{width:100%;padding:12px 15px;display:grid;background:#fff;border:1px solid #bbb;border-radius:14px;grid-area:tip;grid-template-columns:minmax(0,120px) minmax(0,1fr);align-items:center;gap:15px}
.preparation-tip img{width:100%;height:auto;display:block}
.preparation-tip p{font-size:.85rem;line-height:1.6;text-align:left;margin:0}

/* Preparation Step 02 - 03 */
.preparation-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:35px}
.preparation-card{min-width:0;display:flex;flex-direction:column}
.preparation-card-body{padding:25px;background:#f7f7f8;border:1px solid #ddd;border-radius:18px;flex:1}
.preparation-card-body img{width:100%;margin:0 auto 25px;display:block;object-fit:contain}
.preparation-card-text p{line-height:1.8;margin:0 0 10px}
.preparation-card-text p:last-child{margin-bottom:0}

/* Preparation Step 04 */
.preparation-water-body{padding:25px;display:grid;background:#f7f7f8;border:1px solid #ddd;border-radius:30px;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);align-items:center;gap:50px}
.preparation-water-image{display:flex;justify-content:center;align-items:center}
.preparation-water-image img{width:100%;height:auto;display:block}
.preparation-water-content{display:flex;flex-direction:column;gap:28px}
.preparation-water-content>p{line-height:1.8;margin:0}
.preparation-water-note{padding:12px 12px 12px 28px;position:relative;color:#174b9b;border:2px solid #174b9b;background:#fff;border-radius:16px}
.preparation-water-note .preparation-check{width:34px;height:34px;font-size:20px;font-weight:700}
.preparation-water-note p{font-size:.95rem;font-weight:500;line-height:1.6;margin:0}

/* Preparation Step 05 */
.preparation-mode-row{display:grid;grid-template-columns:minmax(220px,32%) minmax(0,1fr);align-items:center;gap:40px}
.preparation-mode-main{padding:25px;background:#f7f7f8;border:1px solid #ddd;border-radius:18px}
.preparation-mode-display{width:100%;max-width:280px;min-height:58px;padding:12px 20px;font-weight:500;display:flex;color:#fff;background:#222;border-radius:12px;justify-content:center;align-items:center}
.preparation-mode-text p{line-height:1.8;margin:0 0 10px}
.preparation-mode-text p:last-child{margin-bottom:0}
.preparation-mode-help{margin-top:20px}
.preparation-help-title{width:max-content;max-width:100%;min-height:48px;padding:0 24px 0 0;font-weight:500;display:flex;overflow:hidden;color:#174b9b;border:2px solid #174b9b;border-radius:50px;align-items:center}
.preparation-help-icon{width:48px;height:48px;margin:-2px 14px -2px -2px;font-size:1.8rem;font-weight:500;display:flex;color:#fff;background:#174b9b;border-radius:50%;flex:0 0 48px;justify-content:center;align-items:center}
.preparation-help-text p{margin:0;line-height:1.7}

/*  Preparation Step 06 */
.preparation-complete{margin-bottom:70px}
.preparation-complete-body{padding:25px;display:grid;background:#f7f7f8;border:1px solid #ddd;border-radius:18px;grid-template-columns:minmax(220px,32%) minmax(0,1fr);align-items:center;gap:40px}
.preparation-complete-display{width:100%;max-width:280px;min-height:58px;padding:8px 20px;font-weight:500;line-height:1.4;display:flex;color:#fff;background:#222;border-radius:12px;flex-direction:column;justify-content:center;align-items:center}
.preparation-complete-time,.preparation-complete-mode{display:block}
.preparation-complete-text p{line-height:1.8;margin:0}

/* ==================================================
   Mode Common
================================================== */

.mode-list{margin:50px 0 0}
.mode-list img{width:100%;height:auto;display:block;object-fit:contain;transition:transform .6s cubic-bezier(.22,1,.36,1);transform:scale(1)}
.mode-list img:hover{transform:scale(1.05)}
.mode-item{margin:0 0 70px}

/* Title */
.mode-title{margin-bottom:25px;padding:8px 20px 10px;font-size:1.25rem;font-weight:500;line-height:1.4;color:#fff;background:#999;border-radius:30px}

/* Title + Option */
.mode-title-row{position:relative}
.mode-title-row .mode-title{padding-right:330px}
.mode-option{padding:4px 12px 6px;font-size:.9rem;font-weight:500;line-height:1.4;position:absolute;top:50%;right:8px;color:#fff;background:#e60012;border-radius:30px;transform:translateY(-50%)}

/* Mode Body */
.mode-body{padding:0;position:relative}
.mode-body-image{display:grid;grid-template-columns:minmax(0,1fr) 180px;align-items:start;gap:30px}
.mode-text{min-width:0}
.mode-text>p{line-height:1.8;margin:0 0 10px}
.mode-text>p:last-child{margin-bottom:0}

/* Mode Image */
.mode-image{text-align:center}
.mode-image img{width:100%;height:auto;margin:0 auto;display:block}
.mode-page{width:max-content;max-width:100%;margin:8px 24px 0 auto;padding:3px 12px;font-size:.8rem;line-height:1.4;color:#222;background:#fff;border:2px solid #174b9b;border-radius:30px}
.mode-page-space .mode-page{margin-top:40px}

/* Beginner Mode */
.mode-beginner{margin:15px 0 0}
.mode-beginner-title{width:100%;font-size:1rem;font-weight:500;margin:40px 0 50px;padding:8px 16px 8px 32px;list-style-type:disc;list-style-position:outside;position:relative;z-index:2;color:#fff;background:#e60012;border-radius:30px}
.mode-beginner-title li{line-height:1.8}
.mode-beginner-body{margin-top:8px;padding:12px 20px;border:2px dashed #e60012;border-radius:20px}
.mode-beginner-body p{line-height:1.7;margin:0 0 6px}
.mode-beginner-body p:last-child{margin-bottom:0}
.mode-beginner-body .refer{text-decoration:none}

/* Aroma Caution */
.mode-aroma-caution{margin:0 0 70px}
.mode-aroma-caution-title{font-size:1rem;font-weight:500;line-height:1.5;margin-bottom:50px;padding:8px 16px 8px 32px;list-style-type:disc;list-style-position:outside;position:relative;z-index:2;color:#fff;background:#e60012;border-radius:30px}
.mode-aroma-caution-title li{line-height:1.8}
.mode-aroma-caution-title .refer{margin:0 0 4px -18px;color:#fff}
.mode-aroma-caution-body{padding:12px 20px 12px 30px;list-style-type:disc;list-style-position:outside;border:2px dashed #e60012;border-radius:20px}
.mode-aroma-caution-body li{line-height:1.8;margin:0 0 8px}
.mode-aroma-caution-body li:last-child{margin-bottom:0}
.mode-aroma-caution-body p{line-height:1.8;margin:0 0 8px}
.mode-aroma-caution-body p:last-child{margin-bottom:0}
.mode-beginner-body .red,.mode-aroma-caution-body .red{font-weight:500;color:#e60012}

/* ==================================================
   Parts
================================================== */

/* Parts (Common) */
.tube-card-title,.mode-mist-parts-title{width:max-content;max-width:100%;padding:5px 12px;font-weight:600;display:flex;border:1px solid #999;align-items:center;gap:6px}
#step01,#mist-step01,#aroma-step01,#gas-aroma-step01,#gas-aroma-step02,#mist-aroma-step01,#mist-aroma-step02{padding-bottom:30px}
#step02,#step03,#step04,#mist-step02,#mist-step03,#mist-step04,#mist-step05,#aroma-step04,#aroma-step05,#gas-aroma-step03,#gas-aroma-step04,#mist-aroma-step03,#mist-aroma-step04{padding-bottom:60px}
#step05,#step06,#mist-step06,#mist-step07,#aroma-step02,#aroma-step03,#aroma-step06,#aroma-step07{padding-bottom:55px}
#step02 .red{margin-bottom:35px}

/* Usage */
.mode-usage{margin:50px 0 0}
.mode-usage-step{margin:0 0 50px;padding:0;border-bottom:1px dashed #bbb}
.mode-usage-step:last-child{margin-bottom:0;border-bottom:0}
.mode-usage img{width:100%;height:auto;display:block;object-fit:contain;transition:transform .6s cubic-bezier(.22,1,.36,1);transform:scale(1)}
.mode-usage img:hover{transform:scale(1.05)}

/* Heading */
.mode-usage-heading{margin:0 0 20px;display:flex;align-items:flex-start;gap:10px}
.mode-usage-heading p{line-height:1.8;margin:0}
.mode-usage-number{font-weight:500;flex:none}

/* Warning */
.mode-usage .red{color:#e60012;font-weight:500}
.mode-combination img{width:100%;height:auto;display:block;object-fit:contain;transition:transform .6s cubic-bezier(.22,1,.36,1);transform:scale(1)}
.mode-combination img:hover{transform:scale(1.05)}

/* Settings */
.settings-section img{width:100%;height:auto;display:block;object-fit:contain;transition:transform .6s cubic-bezier(.22,1,.36,1);transform:scale(1)}
.settings-section img:hover{transform:scale(1.05)}

/* ==================================================
   Tube Card
================================================== */

.tube-card{margin:55px 0 0;padding:20px;border:1px solid #999;border-radius:16px}
.tube-card:last-child{margin-bottom:0}
.tube-card-title{margin:0 0 20px}
.tube-option{margin-left:10px;padding:3px 12px;font-size:.8rem;font-weight:500;color:#fff;background:#e60012;border-radius:20px}
.tube-card-body{display:grid;grid-template-columns:140px minmax(0,1fr) 190px;align-items:center;gap:0}
.tube-card-image img{width:100%;height:160px;display:block;object-fit:contain}
.tube-card-text{min-width:0;padding-right:10px}
.tube-card-text ol{margin:0;padding-left:1.7em}
.tube-card-text li{line-height:1.6;margin:0 0 5px}
.tube-card-text p{font-weight:500;line-height:1.6;margin:3px 0 0}

/* ==================================================
   Open Lid
================================================== */

.mode-open-lid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.8fr);align-items:center;gap:30px}
.mode-open-lid-main img,.mode-open-lid-note img{width:100%;height:auto;display:block}
.mode-open-lid-note{padding:15px;display:grid;background:#fff;border:1px solid #999;border-radius:16px;grid-template-columns:minmax(0,180px) minmax(0,1fr);align-items:center;gap:15px}
.mode-open-lid-note img{width:100%;height:auto;display:block}
.mode-open-lid-note-text p,.preparation-tip-text p{margin:0;line-height:1.7}
.mode-open-lid-note-text p+p,.preparation-tip-text p+p{margin-top:0}

/* ==================================================
   Insert Tube
================================================== */

.mode-insert{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,1fr);align-items:center;gap:30px}
.mode-insert-text p{margin:0}
.mode-insert-image img{width:100%;height:auto;display:block}

/* ==================================================
   Control Flow
================================================== */

.mode-control-flow{display:grid;grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr);align-items:center;gap:20px}
.mode-control-main img{width:100%;height:auto;display:block}
.mode-control-arrow img{width:70px;height:auto;margin:auto;display:block}
.mode-control-main,.mode-start-image{width:100%}
.mode-start-image img{width:100%;max-width:560px;height:auto;display:block}

/* mode14 / mode17 / mode20 */
.mode-operation-image{width:100%;height:auto;display:block}
.mode-operation-main{width:calc(50% - 55px)}
.mode-control-flow .mode-operation-main{width:100%}

/* ==================================================
   Mist Cap
================================================== */

.mode-mist-cap{width:100%}
.mode-mist-cap-image{width:100%;max-width:50%;margin-left:auto}
.mode-mist-cap-image img{width:100%;height:auto;display:block}

/* ==================================================
   Mist Parts
================================================== */

.mode-mist-parts{margin-top:60px;padding:20px;background:#fff;border:1px solid #999;border-radius:16px}
.mode-mist-parts-lead{margin:0 0 12px;line-height:1.7}
.mode-mist-parts-title{margin:20px 0}
.mode-mist-parts-title .tube-option{margin-left:10px}
.mode-mist-parts-body{display:grid;grid-template-columns:140px minmax(0,1fr) 190px;align-items:center;gap:20px}
.mode-mist-parts-image{min-width:0}
.mode-mist-parts-image img{width:100%;height:auto;display:block;object-fit:contain}
.mode-mist-parts-text{min-width:0}
.mode-mist-parts-text p{line-height:1.8;margin:0}
#mist-aroma-step05{margin-bottom:60px}

/* ==================================================
   Aroma Mode
================================================== */

/* Aroma Set */
.mode-aroma-set{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,1fr);align-items:center;gap:30px}
.mode-aroma-set-text{min-width:0}.mode-aroma-set-text ul{margin:0;padding-left:1.2em}
.mode-aroma-set-text li{line-height:1.8;margin:0 0 10px}
.mode-aroma-set-text li:last-child{margin-bottom:0}
.mode-aroma-set-image img{object-fit:contain;width:100%;height:auto;display:block}

/* Aroma Install */
#aroma-step05 .mode-aroma-install-narrow{display:none}

/* Aroma Start */
.mode-aroma-start{display:flex;align-items:center;gap:35px}
.mode-aroma-start .mode-operation-main{width:calc(50% - 55px);flex:0 0 calc(50% - 55px)}
.mode-aroma-warning{min-width:0;padding:15px 25px;color:#fff;background:#e60012;border-radius:16px;flex:1}
.mode-aroma-warning p{margin:0;font-weight:500;line-height:1.8}

/* ==================================================
   Combination Mode
================================================== */

.mode-combination{margin:80px 0 0}

/* Head */
.mode-combination-head{position:relative}
.mode-combination-head .mode-title{padding-right:330px}
.mode-combination-head .mode-option{margin:0;position:absolute;top:50%;right:10px;transform:translateY(-50%)}

/* Caution */
.mode-combination-caution{margin:40px 0 50px;padding:8px 16px 8px 32px;list-style-type:disc;list-style-position:outside;position:relative;border:2px dashed #e60012;border-radius:16px}
.mode-combination-caution li{line-height:1.8}

/* ==================================================
   Settings Common
================================================== */

.settings-section{margin:80px 0 0}
.settings-title{font-size:1.25rem;font-weight:500;line-height:1.5;margin:0 0 25px;padding:8px 25px;color:#fff;background:#999;border-radius:30px}
.settings-row{margin:80px 0 0;display:grid;grid-template-columns:minmax(260px,.75fr) minmax(0,1.8fr);align-items:start;gap:35px}
.settings-image{min-width:0}
.settings-image img{width:100%;height:auto;display:block}
.settings-text p{line-height:1.8;margin:0}
#settings03 .settings-timer-steps .refer,#settings04 .refer{margin-left:-1.5em}

#step03 .mode-open-lid{margin-top:50px}
#step04 .mode-insert-image{margin-top:20px}
#step05 .mode-control-flow{margin-top:50px}
#step06 .mode-usage-heading{margin-bottom:40px}
#step06 .mode-control-flow{margin-top:55px}
#step07 .mode-operation-main{margin-top:50px}
#mist-step02 .mode-open-lid{margin-top:50px}
#mist-step03 .mode-mist-cap{margin-top:50px}
#mist-step04 .mode-open-lid{margin-top:50px}
#mist-step05 .mode-mist-cap{margin-top:50px}
#mist-step06 .mode-control-flow{margin-top:50px}
#mist-step07 .mode-control-flow{margin-top:50px}
#mist-step08 .mode-operation-main{margin:50px auto}
#aroma-step02 .mode-aroma-set-image{margin-top:25px}
#aroma-step03 .mode-insert{margin-top:45px}
#aroma-step03 .mode-insert-image{margin-top:25px}
#aroma-step04 .mode-open-lid{margin-top:50px}
#aroma-step05 .mode-aroma-install{margin-top:50px}
#aroma-step06 .mode-control-flow{margin-top:50px}
#aroma-step07 .mode-control-flow{margin-top:50px}
#aroma-step08 .mode-aroma-start{margin-top:50px}
#gas-aroma-step03 .mode-control-flow{margin-top:50px}
#gas-aroma-step04 .mode-control-flow{margin-top:50px}
#gas-aroma-step05 .mode-operation-main{margin-top:50px}
#mist-aroma-step03 .mode-control-flow{margin-top:50px}
#mist-aroma-step04 .mode-control-flow{margin-top:50px}
#mist-aroma-step05 .mode-operation-main{margin-top:50px}

/* ==================================================
   Settings Note
================================================== */

.settings-note{margin:60px 0 0 0;padding:12px 12px 12px 28px;position:relative;color:#174b9b;border:2px solid #174b9b;border-radius:16px}
.settings-note p{line-height:1.7;margin:0;color:#333}
.settings-check{width:34px;height:34px;font-weight:700;display:flex;position:absolute;top:50%;left:0;color:#fff;background:#174b9b;border-radius:50%;justify-content:center;align-items:center;transform:translate(-50%,-50%)}


/* ==================================================
   Reservation Timer
================================================== */

.settings-lead{margin:70px 0 75px}
.settings-lead p{line-height:1.7;margin:0}
.settings-timer{display:grid;grid-template-columns:minmax(250px,.75fr) minmax(0,1.8fr);align-items:start;gap:35px}
.settings-timer-images{display:flex;flex-direction:column;align-items:center}
.settings-timer-image{width:100%;position:relative}
.settings-timer-image img{width:100%;height:auto;display:block}
.settings-image-number{width:24px;height:24px;font-size:.8rem;display:flex;position:absolute;top:-8px;left:-8px;z-index:1;background:#fff;border:1px solid #333;border-radius:50%;justify-content:center;align-items:center}
.settings-flow-arrow{font-size:1.5rem;line-height:1;margin:5px 0}
.settings-cancel{margin:35px 0 0}
.settings-cancel-title{margin:0 0 30px;padding:6px 18px;font-weight:600;display:inline-block;border:2px solid #999;border-radius:30px}
.settings-section .numbered-list{margin-top:0}
.settings-section .refer{margin:10px 0 0;text-decoration:none}
#settings04{margin-bottom:50px}

/* ==================================================
   Care Common
================================================== */

.care-section{margin:80px 0 0}
.care-title{font-size:1.25rem;font-weight:500;line-height:1.5;margin:0 0 70px;padding:8px 25px;color:#fff;background:#999;border-radius:30px}

/* Check */
.care-checks{margin:70px 0 80px;display:flex;color:#174b9b;flex-direction:column;gap:25px}
.care-check{padding:15px 15px 15px 25px;position:relative;border:2px solid #174b9b;border-radius:14px}
.care-check span{width:32px;height:32px;display:flex;position:absolute;top:50%;left:0;color:#fff;background:#174b9b;border-radius:50%;justify-content:center;align-items:center;transform:translate(-50%,-50%)}

.care-check ul{margin-left:-16px}
.care-check p{line-height:1.6;margin:0}
.care-check .refer{margin:20px 0;color:#174b9b}

/* ==================================================
   Automatic Cleaning
================================================== */

.care-clean-grid{margin-bottom:80px;display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.5fr);align-items:start;gap:40px}
.care-clean-grid .numbered-list{margin:0}

.care-clean-images{display:flex;flex-direction:column;align-items:center}

.care-clean-images img{width:100%;height:auto;display:block;object-fit:contain;transition:transform .6s cubic-bezier(.22,1,.36,1);transform:scale(1)}
.care-clean-images img:hover{transform:scale(1.05)}

.care-clean-images>img{width:100%;height:auto;display:block}
.care-flow-arrow{font-size:1.5rem;line-height:1;margin:25px 0}

/* Valve */
.care-valve{width:100%;padding-bottom:10px;overflow:hidden;border:1px solid #5993c7;border-radius:8px}
.care-valve-title{padding:8px 12px;display:flex;color:#fff;background:#999;align-items:center;gap:12px}
.care-valve-title span{width:28px;height:28px;font-weight:700;display:flex;color:#5993c7;background:#fff;border-radius:50%;justify-content:center;align-items:center}
.care-valve-title p{font-weight:500;margin:0}
.care-valve img{width:100%;height:auto;display:block}

/* ==================================================
   Care Alert
================================================== */

.care-alert{margin:0 0 30px;padding:15px 15px 15px 25px;display:flex;position:relative;border:2px solid #174b9b;border-radius:18px;align-items:flex-start}
.care-alert-icon{width:36px;height:36px;font-weight:700;display:flex;position:absolute;top:50%;left:0;color:#fff;background:#174b9b;border-radius:50%;justify-content:center;align-items:center;transform:translate(-50%,-50%)}
.care-alert p{margin:0}



/* ==================================================
   Storage
================================================== */

.care-storage{margin:80px 0 75px;overflow:hidden;border:1px solid #999;border-radius:16px}
.care-storage-title{padding:10px 15px;display:flex;color:#fff;background:#999;align-items:center;gap:15px}
.care-storage-title span{width:34px;height:34px;font-weight:700;display:flex;color:#5993c7;background:#fff;border-radius:50%;justify-content:center;align-items:center}
.care-storage-title p{font-size:1.15rem;font-weight:500;margin:0}
.care-storage-body{padding:15px 20px}
.care-storage-body p{line-height:1.7;margin:0}

/* ==================================================
   Care Page 14
================================================== */

.care-checks ul{padding:0 0 0 20px;list-style-type:disc;color:#174b9b}

/* ==================================================
   Manual Subtitle
================================================== */

.manual-subtitle{width:100%;min-height:38px;margin:60px 0 35px;padding:8px 8px 8px 16px;font-weight:500;line-height:1.5;display:flex;border:2px solid #8b6d46;border-radius:30px;align-items:center;gap:15px}
.manual-subtitle .tube-option{margin-left:auto}

/* ==================================================
   Maintenance
================================================== */

.care-maintenance-block{margin:80px 0 75px}
.care-bullet-list{margin:0;padding:0}
.care-bullet-list>li{line-height:1.7;position:relative;margin:0 0 30px;padding-left:20px}
.care-bullet-list>li:before{content:"";width:8px;height:8px;position:absolute;top:.65em;left:0;background:#000;border-radius:50%}
.care-bullet-list>li:last-child{margin-bottom:0}

.care-bullet-list ul{margin:30px 0 30px -8px}

.care-bullet-list ul li{line-height:1.6;position:relative;padding-left:24px}
.care-bullet-list ul li:before{content:"・";position:absolute;left:0}
.care-bullet-list p{line-height:1.7;margin:0}

/* ==================================================
   Trouble
================================================== */

.care-trouble-lead{font-size:1.15rem;font-weight:500}
.care-trouble{margin:0 0 65px}
.care-trouble .manual-subtitle{max-width:100%;margin:70px 0 35px}

/* ==================================================
   Error
================================================== */

/* Error Table */
#Error .TableGuide-wrap{-webkit-overflow-scrolling:touch;width:100%;overflow-x:auto}
.error-table{width:100%;min-width:900px;margin:60px auto 25px;border-collapse:collapse;background:#fff}
.error-table th,.error-table td{line-height:1.7;padding:10px 15px;vertical-align:top;border:1px solid #333}
.error-table th{font-weight:500;text-align:center}
.error-table th:first-child{width:130px}
.error-table th:nth-child(2){width:170px}
.error-table td:first-child{text-align:center}
.error-table .first{display:block;margin-left:-8px}
.error-table .second,.error-table .refer{display:block;margin-top:10px}
.error-table .refer{text-decoration:none}
.IDS img{width:24px;height:24px;margin:0 6px 4px}

.error-contact{margin-top:12px}
.error-contact p{margin:0 0 12px}
.error-contact p:last-child{margin-bottom:0}
.error-contact .contact-info{font-weight:500;margin:10px 0;padding:2px 10px;display:inline-block;border:1px solid #999}

/* Error Note */
.error-notes{margin:0 0 75px}
.error-notes ul{margin-bottom:70px}
.error-notes li{margin-bottom:10px}
.error-notes .square{font-weight:500}
.error-notes .normal{display:block;margin-top:10px;text-decoration:underline}

/* Serial Number */
.error-inquiry{margin:60px 0 0}
.error-inquiry-images{grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:30px;display:grid}
.error-inquiry-images img{object-fit:contain;width:100%;height:auto;transition:transform .6s cubic-bezier(.22,1,.36,1);display:block;transform:scale(1)}
.error-inquiry-images img:hover{transform:scale(1.05)}

/* Specification */
.specification-table{width:100%;margin-top:75px;border-collapse:collapse;background:#fff}
.specification-table th,.specification-table td{vertical-align:middle;border:1px solid #333;padding:8px 15px;line-height:1.7}
.specification-table th{text-align:center;width:150px;font-weight:500}
.specification-table .disc{margin:0;padding-left:10px}

/*     Desktop 1920px
----------------------------------------*/
@media screen and (max-width:1920px){

/* Grid */
.manual-grid{grid-template-columns:1fr}

/* Product Set */
.product-set{padding:30px;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px 25px}

/* Product Set / Part Names (br) */
#IncludedParts .second{display:inline}
#MainUnit .second,#MainUnit .third{display:block}
#MainUnit .first{margin-left:-28px}
#MainUnit .second{margin-left:-8px}
#MainUnit .fourth{display:block}

/* Preparation Step 01 */
.preparation-head{flex-direction:column;align-items:flex-start;gap:20px}
.preparation-caution{margin-left:16px}
.preparation-flow-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"step01""tip""arrow01""step02""arrow02""step03";align-items:stretch;gap:20px}
.preparation-process{margin:0 auto;padding:20px}
.process01-images{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:15px}
.process02-images{grid-template-columns:minmax(0,1fr) 55px minmax(0,1fr);gap:15px}
.preparation-process img{height:220px}
.process03 img{max-width:50%}
.preparation-process-arrow{font-size:0;line-height:1;transform:none}
.preparation-process-arrow:before{content:"↓";font-size:2rem;font-weight:600}
.preparation-tip{width:100%;margin:0 auto;padding:15px 20px;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:20px}
.preparation-tip p{font-size:.9rem}

/* Preparation Step 02 - 03 */
.preparation-pair{grid-template-columns:1fr}
.preparation-pair .preparation-card-right{margin-top:45px}

/* Preparation Step 04 */
.preparation-water-body{grid-template-columns:1fr}

/* Parts (Open Lid) */
.mode-open-lid{grid-template-columns:1fr;gap:25px}

/* Parts (Aroma Set) */
#aroma-step05 .mode-aroma-install-wide{display:none}
#aroma-step05 .mode-aroma-install-narrow{max-width:600px;margin:0 auto;display:block}
.mode-aroma-warning{width:100%;max-width:600px;margin:0 auto;padding:10px 20px}

}

/*     Desktop 1440px
----------------------------------------*/
@media screen and (max-width:1440px){

/* Product Set */
#IncludedParts .first{display:block}

/* Part Names */
.part-names-layout{grid-template-columns:1fr;gap:35px}
.part-names-left{order:1}
.part-names-image{order:2}
.part-names-right{order:3}
.part-names-image img{max-width:600px}

/* Product Set / Part Names (br) */
#IncludedParts .second{display:block}
#MainUnit .first,#MainUnit .second{display:inline;margin-left:0}
#MainUnit .PC{display:none}
#MainUnit .SP,#MainUnit .fourth{display:inline}

/* Safety Box */
.safety-rule{grid-template-columns:55px 1fr}
.safety-rule-image,.safety-rule-images{margin-top:20px;grid-column:2;justify-content:center}
.safety-rule-image img{max-width:180px}
.safety-rule-images{flex-direction:row}

/* Operation List */
.operation-list{grid-template-columns:1fr}

/* Preparation Step 01 */
.preparation-head{flex-direction:column;align-items:flex-start}
.preparation-caution{white-space:normal}

/* Preparation Step 05 */
.preparation-mode-row{grid-template-columns:1fr;gap:20px}
.preparation-mode-display{max-width:320px}
.preparation-help-title{width:max-content;max-width:100%}
.preparation-mode-help{margin-top:30px}

/* Preparation Step 06 */
.preparation-complete-body{grid-template-columns:1fr;gap:20px}
.preparation-complete-display{max-width:320px}

/* Mode */
.mode-body{padding:15px 0 0}
.mode-body-image{grid-template-columns:1fr;gap:25px}
.mode-image{width:100%;max-width:260px;margin:0 auto}
.mode-image img{width:100%;height:auto}
.mode-page{margin:8px auto 0}
.mode-beginner{margin-top:20px}
.mode-beginner-title,.mode-beginner-body{width:100%}
.mode-title-row .mode-title{padding-right:20px}
.mode-item .first{display:block}

/* Tube Card */
.tube-card-body{grid-template-columns:140px minmax(0,1fr);grid-template-areas:"image text""right right"}
.tube-image-left{grid-area:image}
.tube-card-text{padding-right:0}
.tube-card-text ol{padding-left:20px}
.tube-image-right{width:100%;max-width:260px;margin:50px auto 0;grid-area:right}

/* Control Flow */
.mode-control-flow{grid-template-columns:1fr;gap:20px}
.mode-control-main{width:100%;max-width:620px;margin:0 auto}
.mode-control-arrow{text-align:center}
.mode-control-arrow img{width:55px;transform:rotate(90deg)}

/* mode14 / mode17 / mode20 */
.mode-operation-main{width:100%;max-width:620px;margin:0 auto}
.mode-control-flow .mode-operation-main{width:100%;max-width:620px}

/* 「または」は回転させない */
.mode-control-or img{transform:none}

/* Parts (Mist) */
.mode-mist-parts-body{grid-template-columns:1fr;gap:15px}
.mode-mist-parts-image{width:100%;max-width:300px;margin:0 auto}
.mode-mist-parts-text{width:100%}

/* Parts (Mist) */
.mode-mist-cap-image{max-width:100%}

/* Parts (Aroma Set) */
.mode-aroma-set,#aroma-step03 .mode-insert{grid-template-columns:minmax(0,1fr) minmax(280px,1fr)}

/* Aroma Start */
.mode-aroma-start{display:flex;flex-direction:column;align-items:stretch;gap:30px}
.mode-aroma-start .mode-operation-main{width:100%;max-width:620px;margin:0 auto;flex:none}
.mode-aroma-warning{width:100%;max-width:620px;margin:0 auto;padding:15px 20px}

/* Combination Mode (br) */
.mode-combination .first{display:block}

/* Settings */
.settings-row,.settings-timer{grid-template-columns:1fr;gap:25px}
.settings-image,.settings-timer-images{margin-bottom:45px}

/* Care */
.care-clean-grid{margin-bottom:60px;grid-template-columns:1fr;gap:30px}
.care-clean-grid .numbered-list{margin:40px 0 0}
.care-clean-images{width:100%;margin:0 auto}
.care-valve-title{padding:10px 15px;gap:15px}
.care-valve-title span{width:34px;height:34px}
.care-valve-title p{font-size:1.15rem}

}

/*     Desktop 1280px
----------------------------------------*/
@media screen and (max-width:1280px){

/* Product Set */
.product-set{grid-template-columns:repeat(2,minmax(0,1fr));gap:35px 25px;padding:30px}
.product-set-item img{height:220px}

/* Product Set / Part Names (br) */
#IncludedParts .second{display:inline}

/* Parts (Common) */
#step04 .red{margin-bottom:15px}

/* Parts 02 */
.tube-card-body{display:grid;grid-template-columns:1fr;grid-template-areas:"image""text""right"}
.tube-image-left{width:100%;max-width:220px;margin:50px auto;grid-area:image}
.tube-card-text ol{padding-left:0}
.tube-image-right{width:100%;max-width:280px;margin:50px auto 0;grid-area:right}
.tube-card-image img{width:100%;height:auto;object-fit:contain}

/* Insert Tube */
.mode-insert{grid-template-columns:1fr;gap:20px}
.mode-insert-image{width:100%;max-width:600px;margin:0 auto}

/* Parts (Aroma Set) */
.mode-aroma-set{grid-template-columns:1fr;gap:25px}
#aroma-step03 .mode-insert{grid-template-columns:1fr;gap:25px}

/* Combination Mode (br) */
.mode-combination .mode-title{padding-right:0}

}

/*     Tablet 1023px
----------------------------------------*/
@media screen and (max-width:1023px){

/* Grid */
.manual-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.manual-card{min-height:0;padding:20px 20px 50px}

/* Product Set */
.product-set{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;padding:25px 20px}
.product-set-item img{height:150px}

/* Part Names */
.part-names-layout{grid-template-columns:minmax(0,1fr) minmax(260px,1.35fr) minmax(0,1fr);gap:25px}
.part-names-left,.part-names-image,.part-names-right{order:initial}
.part-names-image img{max-width:500px}

/* Product Set / Part Names (br) */
#IncludedParts .second,#IncludedParts .third{display:block}
#IncludedParts small{margin-left:-3px}
#MainUnit .first{display:block;margin-left:-8px}
#MainUnit .PC{display:inline}
#MainUnit .SP{display:none}

/* Safety Box */
.safety-rule{grid-template-columns:55px minmax(0,1fr) 140px}
.safety-rule-image,.safety-rule-images{grid-column:auto;justify-content:center}
.safety-rule-images{flex-direction:column}

/* Operation List */
.operation-list{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Preparation Step 01 */
.preparation-head{flex-direction:row;align-items:center;gap:30px}
.preparation-caution{margin-left:0}
.preparation-flow-grid{grid-template-columns:minmax(0,1.4fr) 40px minmax(0,1.4fr) 40px minmax(150px,.65fr);grid-template-areas:"step01 arrow01 step02 arrow02 step03""tip. . . .";align-items:center;gap:20px 10px}
.preparation-process{margin:0;padding:15px}
.preparation-process img{height:170px}
.process01-images{grid-template-columns:1.35fr 1fr;gap:12px}
.process02-images{grid-template-columns:1fr 55px 1fr;gap:12px}
.process03 img{max-width:200px}
.preparation-process-arrow{font-size:2rem;line-height:1;transform:none}
.preparation-process-arrow:before{content:none}
.preparation-tip{width:100%;margin:0;padding:12px 15px;grid-template-columns:minmax(0,120px) minmax(0,1fr);gap:15px}
.preparation-tip p{font-size:.85rem}

/* Preparation Step 02 - 03 */
.preparation-pair{grid-template-columns:repeat(2,minmax(0,1fr))}
.preparation-pair .preparation-card-right{margin-top:0}

/* Preparation Step 04 */
.preparation-water-body{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:30px}
.preparation-water-image img{max-width:100%}
.preparation-water-content{gap:20px}

/* Preparation Step 05 */
.preparation-mode-row{grid-template-columns:minmax(220px,32%) minmax(0,1fr);gap:30px}
.preparation-mode-help{margin-top:20px}

/* Preparation Step 06 */
.preparation-complete-body{grid-template-columns:minmax(220px,32%) minmax(0,1fr);gap:30px}

/* Mode */
.mode-body{padding:15px 15px 0}
.mode-body-image{grid-template-columns:minmax(0,1fr) 150px;gap:25px}
.mode-image{width:auto;max-width:none;margin:0}
.mode-page{margin:8px 0 0 auto}
.mode-title-row .mode-title{padding-right:270px}
.mode-option{width:auto;max-width:none;margin:0;padding:4px 4px 6px 12px;position:absolute;top:50%;right:10px;transform:translateY(-50%)}
.mode-item .first{display:inline}

/* Parts (Common) */
#step05,#step06{padding-bottom:50px}
#step06 .red{margin-bottom:25px}

/* Tube Card */
.tube-card-body{grid-template-columns:130px minmax(0,1fr) 170px;grid-template-areas:none}
.tube-image-left,.tube-card-text,.tube-image-right{grid-area:auto}
.tube-card-text ol{padding-left:20px}
.tube-image-right{width:auto;max-width:none;margin:0}

/* Open Lid */
.mode-open-lid{grid-template-columns:minmax(0,1fr) minmax(240px,.8fr);gap:25px}
.mode-open-lid-note{max-width:none;margin:0}

/* Insert Tube */
.mode-insert{grid-template-columns:minmax(0,1fr) minmax(320px,1fr);gap:25px}
.mode-insert-image{max-width:none;margin:0}

/* Control Flow */
.mode-control-flow{grid-template-columns:minmax(0,1fr) 60px minmax(0,1fr);gap:15px}
.mode-control-main{max-width:none;margin:0}
.mode-control-arrow img{width:60px;transform:none}

/* mode14 / mode17 / mode20 */
.mode-operation-main{width:calc(50% - 45px);max-width:none;margin:0}
.mode-control-flow .mode-operation-main{width:100%;max-width:none}

/* Parts (Mist) */
.mode-mist-parts-body{grid-template-columns:140px minmax(0,1fr) 190px;gap:15px}
.mode-mist-parts-image{width:auto;max-width:none;margin:0}

/* Parts (Mist) */
.mode-mist-cap-image{max-width:50%}

/* Parts (Aroma Set) */
.mode-aroma-set,#aroma-step03 .mode-insert{grid-template-columns:minmax(0,1fr) minmax(320px,1fr)}
#aroma-step05 .mode-aroma-install-wide{display:block}
#aroma-step05 .mode-aroma-install-narrow{display:none}

/* Aroma Start */
.mode-aroma-start{flex-direction:row;align-items:center;gap:30px}
.mode-aroma-start .mode-operation-main{max-width:none;margin:0;flex:0 0 calc(50% - 45px);width:calc(50% - 45px)}
.mode-aroma-warning{width:auto;max-width:none;margin:0;padding:10px 20px;flex:1}

/* Combination Mode (br) */
.mode-combination .first{display:inline}

/* Settings */
.settings-row{grid-template-columns:minmax(250px,.75fr) minmax(0,1.8fr);gap:30px}
.settings-image{width:auto;max-width:none;margin:0}
.settings-timer{grid-template-columns:minmax(240px,.7fr) minmax(0,1.8fr);gap:30px}

/* Care */
.care-clean-grid{margin-bottom:80px;grid-template-columns:minmax(280px,.8fr) minmax(0,1.5fr);gap:30px}
.care-clean-images{width:auto;max-width:none;margin:0}
.care-valve-title{padding:8px 12px;gap:12px}
.care-valve-title span{width:28px;height:28px}
.care-valve-title p{font-size:1rem}

}

/*     Tablet 834px
----------------------------------------*/
@media screen and (max-width:834px){

/* Grid */
.manual-group{margin-bottom:60px}
.manual-grid{grid-template-columns:1fr;gap:20px}
.manual-card-title{font-size:1.05rem}

/* Product Set */
.product-set{grid-template-columns:repeat(3,minmax(0,1fr))}
#IncludedParts small{margin-left:0}

/* Part Names */
.part-names-layout{grid-template-columns:1fr;gap:30px}
.part-names-left{order:1}
.part-names-image{order:2}
.part-names-right{order:3}
.part-names-image img{max-width:100%}
.part-names-list .numbered-list li{margin-bottom:18px}

/* Product Set / Part Names (br) */
#IncludedParts .second,#IncludedParts .third{display:inline}
#IncludedParts small{margin-left:0}
#MainUnit .first{display:inline;margin-left:0}
#MainUnit .PC{display:none}
#MainUnit .SP{display:inline}

/* Operation List */
.operation-list{grid-template-columns:1fr}
.operation-image{padding:15px}
.operation-item{padding:18px 15px}
.operation-item dd{padding-left:42px}

/* Preparation Step 01 */
.preparation-head{flex-direction:column;align-items:flex-start;gap:20px}
.preparation-caution{margin-left:16px}
.preparation-flow-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"step01""tip""arrow01""step02""arrow02""step03";align-items:stretch;gap:20px}
.preparation-process{width:100%;margin:0 auto;padding:20px}
.preparation-process img{height:220px}
.process01-images{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:15px}
.process02-images{grid-template-columns:minmax(0,1fr) 55px minmax(0,1fr);gap:15px}
.process03 img{max-width:50%}
.preparation-process-arrow{font-size:0;line-height:1;transform:none}
.preparation-process-arrow:before{content:"↓";font-size:2rem;font-weight:600}
.preparation-tip{width:100%;margin:0 auto;padding:15px 20px;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:20px}
.preparation-tip p{font-size:.9rem}

/* Preparation Step 02 - 03 */
.preparation-pair{grid-template-columns:1fr}
.preparation-pair .preparation-card-right{margin-top:45px}
.preparation-card-body{padding:20px}

/* Preparation Step 04 */
.preparation-water-body{grid-template-columns:1fr;gap:30px;padding:20px}

/* Preparation Step 05 */
.preparation-mode-row{grid-template-columns:1fr;gap:20px}
.preparation-mode-main{padding:22px 20px}
.preparation-help-title{width:max-content;max-width:100%}
.preparation-mode-help{margin-top:30px}

/* Preparation Step 06 */
.preparation-complete-body{grid-template-columns:1fr;gap:20px;padding:22px 20px}

/* Parts (Common) */
#step05,#step06{padding-bottom:60px}
#step03 .mode-open-lid,#step04 .mode-insert,#step05 .mode-control-flow,#step06 .mode-control-flow,#step07 .mode-operation-main{margin-top:50px}

/* Parts 03 */
#step03 .mode-open-lid-note{margin-top:35px}

/* Tube Card */
.tube-card-body{grid-template-columns:100px minmax(0,1fr);grid-template-areas:"image text""right right"}
.tube-image-right{width:100%;max-width:220px;margin:0 auto;grid-area:right}
.tube-card-image img{height:130px}

/* Open Lid */
.mode-open-lid{grid-template-columns:1fr;gap:20px}
.mode-open-lid-note{width:100%;margin:0 auto}

/* Control Flow */
.mode-control-flow{grid-template-columns:1fr;gap:18px}
.mode-control-main{max-width:580px;margin:0 auto}
.mode-control-arrow img{width:50px;transform:rotate(90deg)}
.mode-control-or img{transform:none}

/* mode14 / mode17 / mode20 */
.mode-operation-main,.mode-control-flow .mode-operation-main{width:100%;max-width:580px;margin:0 auto}

/* Parts (Mist) */
.mode-mist-cap-image{max-width:580px;margin:0 auto}

/* Parts (Aroma Set) */
#aroma-step05 .mode-aroma-install-wide{display:none}
#aroma-step05 .mode-aroma-install-narrow{width:100%;max-width:580px;margin:0 auto;display:block}

/* Aroma Start */
.mode-aroma-start{flex-direction:column;align-items:stretch;gap:25px}
.mode-aroma-start .mode-operation-main{width:100%;max-width:580px;margin:0 auto;flex:none}
.mode-aroma-warning{width:100%;margin:0 auto}

/* Settings */
.settings-row,.settings-timer{grid-template-columns:1fr;gap:25px}
.settings-image,.settings-timer-images{width:100%;max-width:580px;margin:0 auto 45px}

/* Care */
.care-clean-grid{margin-bottom:60px;grid-template-columns:1fr;gap:30px}
.care-clean-images{width:100%;max-width:580px;margin:0 auto}
.care-checks,.care-alert{margin-left:0;margin-right:0}
.care-valve-title{padding:10px 15px;gap:15px}
.care-valve-title span{width:34px;height:34px}
.care-valve-title p{font-size:1.15rem}

}

/*     Smartphone 640px
----------------------------------------*/
@media screen and (max-width:640px){

/* Manual Steps */
.manual-block{margin-top:50px}
.manual-step{grid-template-columns:1fr;gap:15px;padding:30px 0}
.step-number{width:46px;height:46px}
.manual-rules li{gap:12px}
.manual-symbol{min-width:48px}
.table-scroll{-webkit-overflow-scrolling:touch;width:100%;overflow-x:auto}
.error-table{min-width:700px}

/* Product Set */
.product-set{grid-template-columns:repeat(2,minmax(0,1fr));gap:35px 20px;padding:25px 15px}
.product-set-item img{height:160px}
.product-set-item p{font-size:.95rem}

/* Product Set / Part Names (br) */
#IncludedParts .first{display:inline}

/* Safety Guide */
.safety-table th,.safety-table td{font-size:.9rem}
.safety-table th{width:130px;padding:12px 0 12px 10px}
.safety-table td{padding:12px 10px}
.safety-symbol{gap:8px;font-size:1rem}
.safety-symbol img{width:32px;height:32px}

/* Safety Box */
.safety-box-title{grid-template-columns:38px auto;gap:10px;padding:10px 12px}
.safety-box-title img{width:34px;height:34px}
.safety-box-title p{grid-column:1/-1}
.safety-box-heading{font-size:1.15rem}
.safety-rule{grid-template-columns:1fr;gap:15px;padding:10px 0}
.upper-part{padding-bottom:60px}
.lower-part{padding-top:60px}

.safety-rule-icon{display:flex;margin-bottom:10px;justify-content:center}
.safety-rule-image,.safety-rule-images{grid-column:auto;justify-content:center}
.safety-rule-image img{max-width:180px}
.safety-rule-images{flex-direction:row}
.safety-rule-images img{max-width:100px}

/* Mode */
.mode-body{padding:15px 10px 0}
.mode-body-image{grid-template-columns:1fr;gap:25px}
.mode-image{width:100%;max-width:220px;margin:0 auto}
.mode-page{margin:8px auto 0}
.mode-title-row .mode-title{padding-right:20px}
.mode-item .first,.mode-item .second{display:block}
.mode-item .mode-option{padding:4px 16px 6px}

/* Parts 04 */
#step04 .mode-insert-image{margin-top:20px}

/* Insert Tube */
.mode-insert{grid-template-columns:1fr;gap:20px}
.mode-insert-image{max-width:100%;margin:0 auto}

/* Parts (Aroma Set) */
.mode-aroma-set,#aroma-step03 .mode-insert{grid-template-columns:1fr}

/* Error */
.error-inquiry-images{grid-template-columns:1fr;gap:25px}
.error-inquiry-images>div{width:100%;max-width:580px;margin:0 auto}
.specification-table th{width:120px}
.specification-table th,.specification-table td{padding:8px 10px;font-size:.9rem}
#Error .first{display:inline}

}

/*     Smartphone 560px
----------------------------------------*/
@media screen and (max-width:560px){

/* Part Names */
#MainUnit .widescreen .PC{display:none}
#MainUnit .widescreen .SP{display:inline}

/* Product Set / Part Names (br) */
#IncludedParts .first{display:block}

/* Parts 02 */
.tube-card-body{display:grid;grid-template-columns:1fr;grid-template-areas:"image""text""right";gap:15px}
.tube-image-left{width:100%;max-width:220px;margin:50px auto;grid-area:image}
.tube-card-text{width:100%;grid-area:text}
.tube-image-right{width:100%;max-width:280px;margin:50px auto 0;grid-area:right}
.tube-card-image img{width:100%;height:auto;object-fit:contain}
.tube-card-text ol{padding-left:0}

/* Parts 03 */
.mode-open-lid-note{margin-top:40px;grid-template-columns:1fr;gap:15px}
.mode-open-lid-note img{width:100%;height:auto;margin:0 auto}
.mode-open-lid-note-text{width:100%}

/* Parts (Mist) */
.mode-mist-parts{padding:12px}

.mode-mist-parts-body{grid-template-columns:1fr;gap:15px}
.mode-mist-parts-left{width:100%;max-width:220px;margin:0 auto}
.mode-mist-parts-text{width:100%}
.mode-mist-parts-right{width:100%;max-width:280px;margin:0 auto}
.mode-mist-parts-image img{width:100%;height:auto}

/* Combination Mode (br) */
.mode-combination .first{display:block}

/* Preparation Step 01 */
.process03 img{max-width:100%}

/* Settings */
.settings-title{font-size:1.1rem;padding:8px 18px}
.settings-note{padding:12px 14px 12px 25px}
.settings-cancel p{margin-left:0}

/* Care */
.care-title{padding:8px 18px;font-size:1.1rem}
.care-intro{margin-left:0;margin-right:0}
.care-check{padding-right:12px}
.care-alert{padding:14px 12px 14px 25px}
.care-storage-title{padding:10px 15px}
.care-storage-body{padding:18px 15px}

}

/*     Smartphone 440px
----------------------------------------*/
@media screen and (max-width:440px){


/* Product Set / Part Names (br) */
#IncludedParts .second,#IncludedParts .third{display:block}

/* Safety Guide */
.safety-table th{width:90px;padding:10px 0}
.safety-table td{padding:10px}
.safety-symbol{text-align:center;flex-direction:column;gap:5px}
.safety-symbol img{width:30px;height:30px}

/* Safety Box */
.safety-rule-images{margin-top:30px}

/* Body */
.safety-rule{gap:0}
.safety-rule-icon{margin-bottom:20px}

/* Diamond List */
.diamond-list{margin-left:-5px;margin-right:-5px}

/* Preparation Step 01 */
.preparation-tip{grid-template-columns:1fr;gap:15px;padding:20px}
.preparation-tip img{width:100%;margin:0 auto}
.preparation-tip p{width:100%;font-size:.9rem;line-height:1.7}

/* Parts (Common) */
.tube-card-title,.mode-mist-parts-title{width:100%;flex-wrap:wrap}

/* Head */
.mode-combination-head .mode-option{padding:4px 16px 6px}

/* Combination Mode (br) */
.mode-combination .second{display:block}

/* Error */
.error-notes span{margin-left:-1.2em}
.specification-table th{width:90px}
.specification-table th,.specification-table td{padding:8px;font-size:.85rem}

}

/*     Smartphone 375px
----------------------------------------*/
@media screen and (max-width:375px){

/* Safety Guide */
.safety-table th,.safety-table td{font-size:.85rem}
.safety-table th{width:80px}
.safety-table td{padding:10px 8px}

/* Diamond List */
.diamond-list{margin-left:-10px;margin-right:-10px}

/* Preparation (Common) */
.preparation-title p{font-size:1.2rem}

}

/*     Smartphone 360px
----------------------------------------*/
@media screen and (max-width:360px){

/* Card */
.manual-card{min-height:0;padding:15px 15px 50px}
.manual-title-row{gap:10px}
.manual-label{font-size:.7rem;padding:4px 7px;white-space:nowrap}

/* Product Set */
.product-set{grid-template-columns:repeat(1,minmax(0,1fr))}

/* Product Set / Part Names (br) */
#IncludedParts .first,#IncludedParts .second,#IncludedParts .third{display:inline}

/* Preparation (Common) */
.preparation-title p{font-size:1.05rem}

/* Parts 02 */
.tube-card{margin:0 0 15px;padding:15px}

/* Aroma Start */
.mode-aroma-warning{padding:10px 15px}

/* Combination Mode */
.mode-combination-head .mode-title{padding-right:20px}
.mode-combination-head .mode-option{width:max-content;max-width:100%;margin:10px 0 0 auto;display:block;position:static;transform:none}
.mode-combination-caution{margin:20px 0 30px}
.mode-combination .first,.mode-combination .second{display:inline}

}

/*     Landscape
----------------------------------------*/
@media screen and (orientation:landscape) and (max-height:445px){

.specification-table .disc{margin-left:10px}

}

/*     Portrait
----------------------------------------*/
@media screen and (orientation:portrait) and (max-device-width:480px){

.specification-table .disc{margin-left:10px}

}