@charset "UTF-8";

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

 file name  :  beauty.css

=================================================================== */
article{ position: relative; margin: 0 auto; padding: 205px 0 0; width: 1100px; line-height: 1;}
article header{ display: flex; height: auto; letter-spacing: .1em; font-family: "Noto Serif JP", serif; justify-content: space-between; align-items: center;}
article header h1{ display: flex; flex-direction: column; color: #b48e3a; letter-spacing: .12em; font-weight: 400; font-size: 28px;}
article header h1 span{  margin: 1em 0 0; color: #000; font-size: 13px;}
article header nav ul{ display: flex; border-left: 1px solid #e9e1d1; font-size: 14px;}
article header nav ul > li{ padding: 20px 40px; border-right: 1px solid #e9e1d1;}
article header nav a{ display: inline; padding: 0 0 5px;}
article header nav .current a{ border-bottom: 1px solid; color: #b48e3a;}

article .content{ overflow: inherit;}
.lead{ letter-spacing: .1em; font-size: 14px; font-family: "Noto Serif JP", serif; line-height: 2.14;}
section{ margin: 50px 0 0; padding: 68px 0 0; background: url("/img/blt.gif") no-repeat top left;}
.cs{ margin: 3em 0 0; padding: 0; text-align: center; line-height: 1.8;}

.campaign{ margin: 0 auto; padding: 0 0 60px; width: 600px;}
.campaign img{ width: 100%;}

.list-hairmake{overflow: hidden;  margin: 50px 0 0; zoom: 1;}
.list-hairmake li{ float: left; margin: 0 7px 7px 0; width: 362px;}
.list-hairmake li:nth-child(3n){ margin: 0 0 7px;}
.list-hairmake li img{ width: 100%;}
table{box-sizing: border-box;  margin: 25px 0 0; width: 100%; border: 3px double #e0c898; font-size: 13px; line-height: 1.5;}
table th{ padding: 15px 0; width: 150px;border: 1px solid #e0c899; background: #f1ede6; text-align: center; white-space: nowrap; font-weight: normal;}
table td{ padding: 15px; border: 1px solid #e0c899;}
table .price{ width: 60px; text-align: right;}
table .time{ width: 60px; text-align: center;}
table .des{ width: 450px; border-right: 3px double #e0c898;}
.menu:before,
.menu:after{ display: block; overflow: hidden; content: "";}
.menu:after{ clear: both;}
.menu{ margin: 25px 0 0; zoom: 1;}
.menu .box{ float: left; margin: 0 0 0 25px; width: 350px; text-align: center;}
.menu .box:first-child{ margin: 0;}
.menu .box a{ display: block; padding: 15px 0; border: 3px double #e0c899;}
.menu .box a:hover{ background: #fff;}
.menu .box h3{overflow: hidden; margin: 0 auto; height: 19px; background-position: 0 0; background-repeat: no-repeat; text-indent: 100%; white-space: nowrap; }
.menu .face h3{ width: 125px; background-image: url("/service/img/ttl_face.gif");}
.menu .body h3{ width: 56px; background-image: url("/service/img/ttl_body.gif");}
.menu .option h3{ width: 107px; background-image: url("/service/img/ttl_option.gif");}
.menu .face a:hover h3{ background-position: 0 -19px;}
.menu .body a:hover h3{ background-position: 0 -19px;}
.menu .option a:hover h3{ background-position: 0 -19px;}
.note{ margin: 50px 0 0; padding: 25px 0 0; border-top: 1px solid #e9e1d1;}
.note li{padding-left: 1em;  text-indent: -1em; line-height: 1.8;}
.print h3{ margin: 50px 0 0;}
.print table{ margin: 25px 0 0;}
.option{ margin: 25px 0 0;}
.option h3{ border: 3px double #e0c899; font-size: 13px; cursor: pointer;}
.option h3 .t1{ display: inline-block; width: 120px; height: 70px; border-right: 1px solid #e0c899; background: #f1ede6; text-align: center; line-height: 70px;}
.option h3 .t2{ display: inline-block; width: 850px; height: 70px; text-align: center; line-height: 70px;}
.option table{ display: none; margin: 0; border-top: none;}
.option .first td{ border-top: none;}