@charset "UTF-8";

@import url("https://fonts.googleapis.com/css?family=Arapey|Lora|Sorts+Mill+Goudy");
body {
font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
font-size: 13px;
margin: 0;
padding: 0;
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-bg-01.png);
}
a {
color: #9A6E1B;
}
a:hover {
color: #BD9724;
}
img {
height: auto;
max-width: 100%;
}
.header {
background-color: #381E00;
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-bg-08.jpg);
background-position: 0% bottom;
background-repeat: repeat-x;
}
.header-inner {
color: #fff;
}
.header-inner h1 {
font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
font-size: 12px;
font-weight: normal;
line-height: 1.5;
margin: 0;
padding: 12px 0;
text-align: center;
}
.header-inner span {
font-size: 14px;
letter-spacing: 1px;
}
.header-inner h2 {
margin: 0;
padding: 0 0 15px;
text-align: center;
} .header-inner p {
color: #aaa;
font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
font-size: 9px;
line-height: 1.3;
margin: 0;
padding: 5px 20px 3px 20px;
text-align: center;
}
.header-inner p span {
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-tel-02.png);
background-repeat: no-repeat;
background-position: left center;
color: #fff;
font: italic 24px 'Arapey', serif;
padding: 0px 0 0 40px;
}
.navbar-default .navbar-toggle .icon-bar {
background-color: #000;
}
.navbar-default .navbar-toggle,
.navbar-default .navbar-toggle {
background-color: #fff;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
background-color: #fff;
opacity: .5;
}
.navbar-default {
background: none;
border: 0;
}
.navbar-default .navbar-nav > li > a {
color: #fff;
font-family: 'Sorts Mill Goudy', serif;
font-size: 17px;
}
.navbar-default .navbar-nav > li > a span {
font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;
font-size: 11px;
opacity: .5;
}
.navbar-default .navbar-nav > li > a:hover {
color: #fff;
}
.navbar-default .navbar-nav > li > a:hover span {
color: #fff;
opacity: 1;
}
.slider-pro {
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-bg-08.jpg);
background-position: center bottom;
background-repeat: no-repeat;
padding-bottom: 3px;
}
.index-main {
line-height: 2em;
margin-top: 30px;
}
.index-main dd {
line-height: 2;
}
.index-main dt {
line-height: 2;
font-size: 16px;
}
.index-main-contents {
background: rgba(255, 255, 255, 0.9);
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
margin-bottom: 30px;
}
.index-sub-contents a {
background: rgba(255, 255, 255, 0.9);
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
display: block;
height: 100%;
margin-bottom: 30px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.index-main-contents a:hover {
text-decoration: none;
}
.index-sub-contents a:hover {
background: rgba(154, 110, 26, 0.1);
}
.index-main-contents .left img {
border-right: 1px solid rgba(154, 110, 26, 0.1);
}
.index-sub-contents a p img {
border-bottom: 1px solid rgba(154, 110, 26, 0.1);
}
.index-main-campaign-area {
padding: 10px;
}
@media screen and (min-width:768px) {
.index-main-campaign-area {
padding: 30px 10px;
}
}
.index-main-campaign-area-category {
text-align: right;
}
.posted-on a,
.cat-links a {
color: rgba(51, 51, 51, 1);
}
.index-main-campaign-area h2 {
font-family: 'Lora', "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
font-size: 20px;
margin: 0;
padding: 0;
}
.index-main-campaign-area h2 span {
font-size: 14px;
}
@media screen and (min-width:768px) {
.index-main-campaign-area h2 {
font-size: 30px;
margin-top: 0;
margin-bottom: 10px;
}
}
.index-main-campaign-area h2 a {
color: rgba(51, 51, 51, 1);
margin-top: 0;
}
.index-main-campaign-area p {
margin-bottom: 5px;
}
.index-main-campaign-area-summery {
line-height: 1.5;
margin-bottom: 10px;
}
a .index-main-contents-area h2 {
color: rgba(51, 51, 51, 1);
font-family: 'Lora', "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
font-size: 20px;
}
a .index-main-contents-area p {
color: rgba(51, 51, 51, 1);
line-height: 1.5;
}
.topics-header h2 {
border-left: 5px solid #333;
font-family: 'Lora', serif;
font-size: 28px;
margin-bottom: 30px;
padding: 10px 0 10px 15px;
}
.topics-header h2 span {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 16px;
margin-left: 16px;
}
.index-main-contents-area {
padding: 0 10px 10px;
}
.index-blog .index-main-contents {
padding: 30px;
}
.index-blog .index-main-contents h3 {
font-family: 'Sorts Mill Goudy', serif;
margin: 0;
padding: 0 0 10px;
}
.index-blog-list {
margin: 0;
}
.index-blog-list dt {
clear: left;
float: left;
font-size: 14px;
font-weight: normal;
width: 100px;
}
.index-blog-list dd {
float: left;
}
.sidebar {
padding-bottom: 30px;
}
.sidebar h3,
.footer h4 {
font-family: 'Lora', serif;
font-weight: normal;
}
.sidebar h3 {
margin: 30px 0 20px;
}
.sidebar-yoyaku-01 {
padding: 0;
margin: 0 0 20px;
}
.sidebar .cashless {
padding: 30px 0 20px;
line-height: 1.3;
}
@media screen and (max-width:767px) {
body {
padding-bottom: 200px;
}
.sidebar-yoyaku-01 {
bottom: 0;
position: fixed;
padding: 0;
left: 0;
margin: 0;
text-align: center;
width: 100%;
z-index: 1;
}
}
.sidebar-address {
font-size: 16px;
}
.banner-drush {
padding: 30px 0;
}
.footer {
background-color: #D4E5E9;
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-bg-06.jpg);
background-repeat: no-repeat;
background-position: center top;
padding-top: 10px;
}
.footer-outer {
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-bg-07.jpg);
background-repeat: no-repeat;
background-position: center bottom;
padding-bottom: 10px;
}
.footer-inner {
padding: 30px 0;
}
ul.footer-sns li {
float: none;
list-style: none;
}
.page-contents,
.single-contents {
padding-bottom: 50px;
}
.page-contents h2 {
border-left: 5px solid #333;
font-family: 'Lora', serif;
font-size: 28px;
line-height: 1.3;
margin-bottom: 30px;
padding: 10px 0 10px 15px;
}
.page-contents h2 span,
.single-contents h2 span {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 16px;
margin-left: 16px;
}
.single-contents .entry-header p {
margin: 0;
}
.page-contents h3 {
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-list-01.png);
background-repeat: no-repeat;
background-position: left 3px;
padding-left: 30px;
font-size: 20px;
margin-bottom: 30px;
}
.page-contents h4 {
margin-bottom: 20px;
}
.img-shadow {
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.4);
}
.salon-photo p {
padding-bottom: 20px;
}
.salon-data dd {
padding-bottom: 20px;
}
.salon-name {
font-family: 'Lora', serif;
font-size: 20px;
font-weight: normal;
}   figure {
position: relative;
overflow: hidden;
line-height: 1.42857143;
margin: 10px 1%;
max-width: 480px;
max-height: 180px;
width: 96%;
background: #111;
text-align: center;
cursor: pointer;
}
figure img {
position: relative;
display: block;
height: auto;
max-width: 100%;
opacity: 0.8;
}
figure figcaption {
padding: 2em;
color: #fff;
font-size: 1.25em;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
figure figcaption::before,
figure figcaption::after {
pointer-events: none;
}
figure figcaption,
figure figcaption > a {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
figure figcaption > a {
z-index: 1000;
text-indent: 200%;
white-space: nowrap;
font-size: 0;
opacity: 0;
}
.page-contents figure h3 {
background: none;
font-family: 'Lora', serif;
font-size: 24px;
font-weight: 300;
margin-bottom: 0;
padding-left: 0;
word-spacing: -0.15em;
}
figure h3 span {
font-size: 12px;
font-weight: normal;
}
figure h3,
figure p {
margin: 0;
}
figure p {
letter-spacing: 1px;
font-size: 80%;
}
figure.effect-lily img {
max-width: none;
width: -webkit-calc(100% + 50px);
width: calc(100% + 50px);
opacity: 0.7;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
-webkit-transform: translate3d(-40px, 0, 0);
transform: translate3d(-40px, 0, 0);
}
figure.effect-lily figcaption {
text-align: left;
}
figure.effect-lily figcaption > div {
position: absolute;
bottom: 20px;
left: 0px;
padding: .5em 1em;
width: 100%;
height: 30%;
}
figure.effect-lily:hover figcaption > div {
background: #111;
bottom: 0px;
opacity: .6;
}
figure.effect-lily h3,
figure.effect-lily p {
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
figure.effect-lily h3 {
-webkit-transition: -webkit-transform 0.35s;
transition: transform 0.35s;
}
figure.effect-lily p {
color: rgba(255, 255, 255, 0.8);
opacity: 0;
-webkit-transition: opacity 0.2s, -webkit-transform 0.35s;
transition: opacity 0.2s, transform 0.35s;
}
figure.effect-lily:hover img,
figure.effect-lily:hover p {
opacity: 1;
}
figure.effect-lily:hover img,
figure.effect-lily:hover h3,
figure.effect-lily:hover p {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
figure.effect-lily:hover p {
-webkit-transition-delay: 0.05s;
transition-delay: 0.05s;
-webkit-transition-duration: 0.35s;
transition-duration: 0.35s;
}
.menu-list-01 {
padding: 0 0 10px 20px;
}
.menu-list-01 a {
color: #333;
font-size: 14px;
}
.hair-catalog-data,
.coupon-data {
margin-bottom: 50px;
margin-left: 30px;
}
.coupon-data {
background: rgba(63, 34, 6, .1);
padding: 20px 10px;
line-height: 1.42857143;
margin-left: auto;
}
.page-contents .coupon-data h3 {
background-image: none;
padding-left: 0;
margin-bottom: 20px;
}
.coupon-data-image {
margin: 0;
padding: 0 0 20px;
}
.coupon-data-menu {
line-height: 2;
margin: 0;
padding: 0 0 20px;
}
.coupon-data-menu .label-default {
font-size: 12px;
}
.coupon-data-desc {
background-color: rgba(255, 255, 255, .4);
margin-bottom: 15px;
padding: 15px;
}
.coupon-data-price {
line-height: 1.3;
text-align: center;
}
.coupon-data-price span {
font-family: 'Lora', serif;
font-size: 48px;
letter-spacing: 1px;
}
.index-main .hair-catalog-data dt,
.index-main .hair-catalog-data dd {
line-height: 1.42857143;
}
.menu-data {
margin-bottom: 30px;
}
.menu-data dt {
border-left: 3px solid #3F2206;
clear: both;
font-weight: normal;
margin: 0 0 20px 10px;
padding: 5px 0 5px 10px;
}
.menu-data dt span {
display: inline-block;
font-size: 75%;
line-height: 1.5;
}
.menu-data dd {
font-family: 'Lora', serif;
font-size: 16px;
margin-bottom: 20px;
text-align: right;
}
.menu-notice {
margin-bottom: 50px;
}
.menu-notice ul {
margin-bottom: 0;
padding-left: 0;
}
.menu-notice ul li {
padding-left: 10px;
}
.page-contents h3.staff-header {
font-family: "ten-mincho", serif;
font-size: 24px;
}
.page-contents h3.staff-header span {
font-family: sans-serif;
font-size: 12px;
margin-left: 10px;
}
.staff-header img {
margin-right: 10px;
}
.menu-header {
font-family: 'Lora', serif;
} .archive-main,
.single-main {
padding: 0 0 50px;
}
.sidebar-entries,
.sidebar-categories,
.sidebar-archives {
list-style-type: none;
padding-left: 0;
}
.single-contents .entry-header {
border-left: 5px solid #333;
line-height: 1.3;
margin-bottom: 20px;
padding: 10px 0 10px 15px;
}
.single-contents h2.entry-title {
font-family: 'Lora', serif;
font-size: 20px;
margin: 10px 0;
}
.single-contents .entry-header p {
margin: 0;
}
p.entry-date {
margin-bottom: 10px;
}
.category-blog h1.page-title {
font-size: 20px;
}
.category-blog h2.entry-title {
border-left: 5px solid #333;
font-family: 'Lora', serif;
font-size: 20px;
line-height: 1.3;
margin-bottom: 20px;
padding: 10px 0 10px 15px;
}
.category-blog h2.entry-title a {
color: #333;
}
.youtube {
position: relative;
width: 100%;
padding-top: 56.25%;
}
.youtube iframe {
position: absolute;
top: 0;
right: 0;
width: 100% !important;
height: 100% !important;
}
@media (max-width:767px) {
.navbar {
margin-bottom: 5px;
}
.navbar-default {
border-top: 1px solid #fff;
margin-top: 30px;
}
.navbar-default .navbar-brand {
color: #fff;
}
.sidebar h3 {
margin: 30px 0 10px;
}
.sidebar h3 span {
display: block;
font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
font-size: 16px;
line-height: 1.5;
}
.sidebar-address {
font-size: 18px;
}
.sidebar-tel {
font-family: 'Lora', serif;
font-size: 24px;
}
}
@media (min-width:768px) {
.navbar-brand {
display: none;
}
.header {
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-bg-03.png);
background-repeat: repeat-x;
}
.header-inner {
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-bg-10.jpg);
background-repeat: no-repeat;
background-position: center top;
color: #fff;
padding-top: 25px;
height: 148px;
}
.header-inner h1 {
padding: 8px 0 0;
text-align: left;
}
.header-inner h2 {
padding-bottom: 10px;
}
.header-inner p {
text-align: right;
}
.header-tel {
float: right;
}
.navbar-collapse.collapse {
position: relative;
overflow: hidden !important;
}
ul.nav {
float: left;
left: 50%;
position: relative;
}
ul.nav li {
float: left;
left: -50%;
position: relative;
text-align: center;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
color: #fff;
background-color: transparent
}
.sidebar {
line-height: 1.42857143;
padding-bottom: 30px;
}
.sidebar h3,
.footer h4 {
font-family: 'Lora', serif;
font-size: 20px;
font-weight: normal;
}
.sidebar h3 span,
.footer h4 span {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 11px;
font-weight: normal;
}
.sidebar-tel,
.footer-tel,
.contact-tel {
font-family: 'Lora', serif;
font-size: 24px;
}
.sidebar-time {
margin-bottom: 30px;
}
.footer-inner {
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-bg-04.png);
background-repeat: no-repeat;
background-position: center top;
}
.footer-inner h3 {
margin: 0 0 20px;
}
.footer-inner h4 {
margin: 0 0 15px;
}
.footer-inner h5 {
font-family: 'Lora', serif;
font-size: 20px;
margin-top: 0;
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-list-01.png);
background-repeat: no-repeat;
background-position: left center;
padding-left: 30px;
}
.footer-inner a {
color: #333;
}
ul.footer-sns {
margin: 0 0 30px;
padding: 0;
}
ul.footer-sns li {
float: left;
margin: 0;
list-style: none;
padding: 10px 15px 0 0;
}
ul.footer-nav {
margin: 0;
padding: 0 0 0 30px;
}
ul.footer-nav li {
list-style-type: none;
margin: 0;
padding: 0;
}
.page-contents-area {
padding: 0 0 10px 30px;
}
.page-contents .pull-left img {
margin-right: 20px;
}
.page-contents .pull-right img {
margin-left: 20px;
}
.index-main .salon-data dt {
clear: left;
float: left;
font-size: 13px;
font-weight: normal;
width: 150px;
}
.index-main .salon-data dd {
padding: 0 0 10px 150px;
}
.index-main .salon-data dd span.salon-name {
line-height: 1;
}
.hair-catalog-data dl {
margin-top: 20px;
}
.hair-catalog-data dt {
clear: left;
float: left;
width: 100px;
}
.hair-catalog-data dt.label {
font-size: 75%;
}
.hair-catalog-data dd {
margin: 0 0 5px 120px;
}
.page-contents .coupon-data h3 {
background-image: none;
padding-left: 0;
font-size: 20px;
margin-bottom: 20px;
}
.page-contents .coupon-data h3 span.label {
padding: .2em .6em .1em;
}
.hair-catalog-data h4,
.coupon-data h4 {
background-image: url(//www.hair-delsol.jp/wp-content/themes/delsol/images/moriyama-list-01.png);
background-repeat: no-repeat;
background-position: left center;
border-bottom: 1px dotted #333;
padding: 10px 0 8px 25px;
font-size: 16px;
}
.coupon-data h5 {
font-size: 16px;
font-weight: bold;
line-height: 1.4;
text-align: center;
}
figure {
min-width: 140px;
}
.page-contents figure h3 {
font-size: 20px;
}
figure p {
letter-spacing: 1px;
font-size: 68.5%;
}
figure.effect-lily figcaption > div {
bottom: 20px;
}
.menu-data dt {
float: left;
width: 75%;
}
.menu-data dt.menu-data-01 {
width: 50%;
}
.menu-data dd {
float: right;
padding: 5px 0;
}
}
@media (min-width:768px) and (max-width:991px) {
.header-inner h1 {
padding-left: 40px;
}
.header-inner p {
padding-right: 10px;
}
.header-inner p span {
font: italic 26px 'Arapey', serif;
}
.nav > li > a {
padding: 10px 5px;
}
.navbar-default .navbar-nav > li > a {
font-size: 16px;
}
.index-main-contents-area {
min-height: 130px;
}
.sidebar h3 span,
.sidebar-tel,
.sidebar-time .small {
display: block;
}
.footer-tel {
display: block;
}
figure {
min-width: 150px;
}
figure.effect-lily figcaption > div {
height: 40%;
}
.menu-list figure {
min-width: 130px;
}
}
@media (min-width:992px) and (max-width:1199px) {
.header-inner h1 {
padding-left: 50px;
}
.header-inner p {
padding-right: 20px;
}
.nav > li > a {
padding: 10px 15px;
}
.index-main-contents-area {
min-height: 186px;
}
.footer-tel {
display: block;
}
figure {
min-width: 190px;
}
}
@media (min-width:1200px) {
.header-inner h1 {
padding-left: 50px;
}
.header-inner p {
padding-right: 20px;
}
.nav > li > a {
padding: 10px 22px;
}
.index-main-contents-area {
min-height: 161px;
}
figure {
min-width: 220px;
}
} .pagination {
list-style-type: none;
padding-left: 0;
margin: 30px 0;
}
.pagination,
.pagination li a {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
.pagination a {
font-weight: 300;
padding-top: 1px;
text-decoration: none;
border: 1px solid #ddd;
border-left-width: 0;
min-width: 36px;
min-height: 36px;
color: #333;
}
.pagination li:not([class*="current"]) a:hover {
background-color: #eee;
}
.pagination li:first-of-type a {
border-left-width: 1px;
}
.pagination li.first span,
.pagination li.last span,
.pagination li.previous span,
.pagination li.next span { position: absolute;
top: -9999px;
left: -9999px;
}
.pagination li.first a::before,
.pagination li.last a::after,
.pagination li.previous a::before,
.pagination li.next a::after {
display: inline-block;
font-family: Fontawesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
transform: translate(0, 0);
}
.pagination li.first a::before {
content: "\f100";
}
.pagination li.last a::after {
content: "\f101";
}
.pagination li.previous a::before {
content: "\f104";
}
.pagination li.next a::after {
content: "\f105";
}
.pagination li.current a {
background-color: #ddd;
cursor: default;
pointer-events: none;
}
.pagination > li:first-child > a {
border-bottom-left-radius: 4px;
border-top-left-radius: 4px;
}
.pagination > li:last-child > a {
border-bottom-right-radius: 4px;
border-top-right-radius: 4px;
}
.pagination > li > a,
.pagination > li > span {
color: rgba(0, 0, 0, 1);
}
.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover {
color: rgba(125, 125, 125, 1);
}
@media only screen and (max-width: 680px) {
.pagination li.first,
.pagination li.last { position: absolute;
top: -9999px;
left: -9999px;
}
.pagination li.previous a {
border-left-width: 1px;
}
}
@media only screen and (max-width: 500px) {
.pagination li { position: absolute;
top: -9999px;
left: -9999px;
}
.pagination li.current,
.pagination li.first,
.pagination li.last,
.pagination li.previous,
.pagination li.next {
position: initial;
top: initial;
left: initial;
}
.pagination li.previous a {
border-left-width: 0;
}
}
@media only screen and (max-width: 400px) {
.pagination li.first,
.pagination li.last { position: absolute;
top: -9999px;
left: -9999px;
}
.pagination li.previous a {
border-left-width: 1px;
}
}
@media only screen and (max-width: 240px) { .pagination li {
width: 50%;
}
.pagination li.current {
order: 2;
width: 100%;
border-left-width: 1px;
}
}