@charset "utf-8";

/*============================
#pageTitleArea
============================*/
#pageTitleArea { background:  url(../../imageFile/waterserver/mainTitleArea_bg.png) no-repeat center; background-size: cover; min-width: 1200px; }
#pageTitleArea .wrap { margin: 0 auto; width: 1200px; }
#pageTitleArea .pad { margin: 0 50px; width: 1100px; position: relative; }
#pageTitleArea .titleBox { padding: 85px 0 75px; }
#pageTitleArea .titleBox ul { margin-left: 60px; }
#pageTitleArea .titleBox ul li { display: inline-block; vertical-align: middle; }
#pageTitleArea .titleBox ul li.last { margin-left: 90px; }
#pageTitleArea .titleBox ul li p { color: #fff; text-align: left; }
#pageTitleArea .titleBox ul li p span.eng { display: block; font-size: 2.375em; letter-spacing: 0.1em; }
#pageTitleArea .titleBox ul li h1 { color: #fff; line-height: 1.9; text-align: left; }

/*============================
#explanationArea
============================*/
#explanationArea { margin-top: 100px; }
#explanationArea .wrap { margin: 0 auto; width: 1200px; }
#explanationArea .pad { margin: 0 50px; width: 1100px; position: relative; }
#explanationArea .title { position: relative; text-align: center; }
#explanationArea .title:before { border-top: solid 1px #eeeeee; content: ""; display: block; height: 1px; width: 100%; position: absolute; left: 0; top: 50%; }
#explanationArea .title span { background: #fff; font-size: 1.75em; font-weight: bold; padding: 0 40px; position: relative; }
#explanationArea ul { margin-top: 80px; }
#explanationArea ul li { float: left; margin-right: 40px; width: 340px; }
#explanationArea ul li.last { margin-right: 0; }
#explanationArea ul li .contents {}
#explanationArea ul li .contents .subTitle { font-size: 1.5em; text-align: center; }
#explanationArea ul li .contents .images { margin-top: 30px; }
#explanationArea ul li .contents .images img {}
#explanationArea ul li .contents .text { margin-top: 20px; }
#explanationArea ul li .contents .text p { line-height: 1.5; }

/*============================
#priceArea
============================*/
#priceArea { background-color: #f8f8f8; min-width: 1200px; margin-top: 110px; padding: 100px 0 110px; }
#priceArea .wrap { margin: 0 auto; width: 1200px; }
#priceArea .pad { margin: 0 50px; width: 1100px; position: relative; }
#priceArea .title { position: relative; text-align: center; }
#priceArea .title:before { border-top: solid 1px #eeeeee; content: ""; display: block; height: 1px; width: 100%; position: absolute; left: 0; top: 50%; }
#priceArea .title span { background: #f8f8f8; font-size: 1.75em; font-weight: bold; padding: 0 40px; position: relative; }
#priceArea  ul { margin-top: 80px; }
#priceArea  ul li { background-color: #fff; box-sizing: border-box; float: left; margin-right: 40px; padding: 40px 30px 38px; width: 340px; }
#priceArea  ul li.last { margin-right: 0; }
#priceArea  ul li .contents {}
#priceArea  ul li .contents .images { text-align: center; }
#priceArea  ul li .contents .images img {}
#priceArea  ul li .contents .subTitle { text-align: center; font-size: 1.25em; font-weight: bold; margin-top: 38px; }
#priceArea  ul li .contents .price { color: #ab5445; font-size: 1.875em; font-weight: bold; margin-top: 18px; text-align: center; }
#priceArea  ul li .contents .price span { font-size: 16px; }
#priceArea  ul li .contents .text { margin-top: 30px; }
#priceArea  ul li .contents .text p { line-height: 1.5; }
#priceArea  ul li .contents .text p span.em { color: #ab5445; }
#priceArea  ul li .contents .text p span.attn { font-size: 0.75em; }

/*============================
#faqArea
============================*/
#faqArea { margin-top: 110px; }
#faqArea .wrap { margin: 0 auto; width: 1200px; }
#faqArea .pad { margin: 0 50px; width: 1100px; position: relative; }
#faqArea .title { position: relative; text-align: center; }
#faqArea .title:before { border-top: solid 1px #eeeeee; content: ""; display: block; height: 1px; width: 100%; position: absolute; left: 0; top: 50%; }
#faqArea .title span { background: #fff; font-size: 1.75em; font-weight: bold; padding: 0 40px; position: relative; }
#faqArea ul { border: solid 1px #dedede; box-sizing: border-box; margin-top: 60px; padding: 30px; }
#faqArea ul li { border-bottom: dashed 1px #dedede; padding-bottom: 26px; margin-top: 30px; }
#faqArea ul li:first-child { margin-top: 0; }
#faqArea ul li.last { border-bottom: none; padding-bottom: 0; }
#faqArea ul li dl { width: 100%; }
#faqArea ul li dl dt { box-sizing: border-box; background: url(../../imageFile/global/icon_question.png) no-repeat left top; clear: left; display: block; float: left; line-height: 1.5; padding: 4px 30px 4px 45px; width: 50%; }
#faqArea ul li dl dd { box-sizing: border-box; background: url(../../imageFile/global/icon_answer.png) no-repeat left top; clear: right; display: block; float: right; line-height: 1.5; padding: 4px 30px 4px 45px; width: 50%; }
#faqArea ul li dl dd span.attn { font-size: 0.75em; }