画像タグ PDFタグ
CSS
@import '//fonts.googleapis.com/css?family=Montserrat:500,600';
@charset 'utf-8';
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
line-height: 1.15;
/* 1 */
-webkit-text-size-adjust: 100%;
/* 2 */
}
/* Sections
========================================================================== */
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
-webkit-box-sizing: content-box;
box-sizing: content-box;
/* 1 */
height: 0;
/* 1 */
overflow: visible;
/* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace;
/* 1 */
font-size: 1em;
/* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none;
/* 1 */
text-decoration: underline;
/* 2 */
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
/* 2 */
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace;
/* 1 */
font-size: 1em;
/* 2 */
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
border-style: none;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit;
/* 1 */
font-size: 100%;
/* 1 */
line-height: 1.15;
/* 1 */
margin: 0;
/* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input {
/* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select {
/* 1 */
text-transform: none;
}
/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* 1 */
color: inherit;
/* 2 */
display: table;
/* 1 */
max-width: 100%;
/* 1 */
padding: 0;
/* 3 */
white-space: normal;
/* 1 */
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* 1 */
padding: 0;
/* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield;
/* 1 */
outline-offset: -2px;
/* 2 */
}
/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button;
/* 1 */
font: inherit;
/* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Misc
========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
display: none;
}
/**
* Add the correct display in IE 10.
*/
[hidden] {
display: none;
}
* {
-webkit-box-sizing: border-box;
box-sizing: border-box;
word-break: break-all;
}
html {
/****** 佳子コメントのみ デフォ値が16pxなので62.5％縮小して10pxに調整 rem計算用 font-size: 10px;と同じ意味 はじまり *******************/
font-size: 62.5%;
/****** 佳子コメントのみ デフォ値が16pxなので62.5％縮小して10pxに調整 rem計算用 font-size: 10px;と同じ意味 終わり *******************/
color: #222222;
font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴ ProN W3', Hiragino Kaku Gothic ProN, Arial, 'メイリオ', Meiryo, sans-serif;
letter-spacing: 0.1em;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: grayscale;
line-height: 1.6;
}
body {
margin: 0;
font-size: 1.6rem;
background-color: #ffffff;
position: relative;
/************************* 佳子 追加 2022年最適フォントファミリーの設定 はじまり *******************/
font-family: "Helvetica Neue",
Arial,
"Hiragino Kaku Gothic ProN",
"Hiragino Sans",
Meiryo,
sans-serif;
/************************* 佳子 追加 2022年最適フォントファミリーの設定 終わり *******************/
}
img {
max-width: 100%;
height: auto;
}
input[type="text"],
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.c-icon {
width: 16px;
height: 16px;
fill: currentColor;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-icon {
width: 20px;
height: 20px;
}
}
.c-container {
max-width: 1230px;
padding-right: 15px;
padding-left: 0px;
/****** 佳子テスト 元々 padding-left: 15px; *********/
margin-right: auto;
margin-left: auto;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-container.c-container--flex {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
.c-overlay-checkbox {
display: none;
}
.c-overlay {
background: rgba(0, 0, 0, 0.5);
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: -1000;
opacity: 0;
}
.c-section {
margin-top: 40px;
margin-bottom: 40px;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-section {
margin-top: 70px;
margin-bottom: 70px;
position: relative;
}
}
.c-section:first-child {
margin-top: 0;
}
.c-section.c-section--bg {
background-color: #f6f6f6;
padding: 30px 15px;
padding-bottom: 30px;
margin-right: -15px;
margin-left: 0px;
/****** 佳子テスト 元々 margin-left: -15px; *********/
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-section.c-section--bg {
background-color: transparent;
padding: 0;
margin-right: auto;
margin-left: auto;
}
}
.c-section__heading {
font-size: 2rem;
line-height: 1.2;
margin-bottom: 0.8em;
font-family: 'Montserrat', sans-serif;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-section__heading {
font-size: 3.2rem;
font-weight: normal;
}
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-section__heading.c-section__heading--is-top {
margin-right: 90px;
}
}
.c-section__heading:first-child {
margin-top: 0;
}
.c-section__category-heading {
position: relative;
text-align: center;
font-size: 1.6rem;
margin-top: 40px;
margin-bottom: 40px;
}
.c-section__category-heading::before {
content: '';
display: block;
background-color: #f6f6f6;
width: 100%;
height: 2px;
position: absolute;
bottom: 50%;
margin-top: 1px;
}
.c-section__category-heading span {
background-color: #ffffff;
padding-right: 1em;
padding-left: 1em;
position: relative;
}
.c-section__more {
font-size: 1.2rem;
margin: 30px 0 0;
text-align: right;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-section__more {
position: absolute;
margin-top: 1.5rem;
top: 0;
right: 0;
}
}
.c-section__more.c-section__more--static {
position: static;
margin-top: 10px;
margin-bottom: 30px;
}
.c-section__more a {
color: currentColor;
text-decoration: none;
border-bottom: 1px solid currentColor;
}
.c-section__more svg {
width: 0.9em;
height: 0.9em;
}
.c-chapter {
margin-top: 40px;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-chapter {
margin-top: 50px;
}
}
.c-chapter__heading {
font-size: 2rem;
font-weight: normal;
line-height: 1.2;
margin-top: 0.5em;
margin-bottom: 0.5em;
font-family: 'Montserrat', sans-serif;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-chapter__heading {
font-size: 2.4rem;
}
}
.c-chapter__heading img {
vertical-align: 0.15em;
margin-right: 0.2em;
}
.c-chapter__heading a {
color: #8dc5c6;
text-decoration: none;
position: relative;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-chapter__heading a::after {
content: '';
display: block;
position: absolute;
bottom: -3px;
left: 0;
width: 0;
height: 2px;
background-color: #8dc5c6;
-webkit-transition: 0.2s;
transition: 0.2s;
}
.c-chapter__heading a:hover::after {
width: 100%;
}
}
.c-chapter__heading.c-chapter__heading--calendar {
text-align: center;
position: relative;
}
.c-chapter__heading.c-chapter__heading--calendar a {
position: absolute;
width: 30px;
height: 30px;
top: -0.5em;
white-space: nowrap;
text-indent: 101%;
overflow: hidden;
background-position: center;
background-repeat: no-repeat;
background-size: 30px;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-chapter__heading.c-chapter__heading--calendar a {
top: -0.05em;
}
}
.c-chapter__heading.c-chapter__heading--calendar a:first-child {
left: 0;
background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22%23444%22%20width%3D%221792%22%20height%3D%221792%22%20viewBox%3D%220%200%201792%201792%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M1203%20544q0%2013-10%2023l-393%20393%20393%20393q10%2010%2010%2023t-10%2023l-50%2050q-10%2010-23%2010t-23-10l-466-466q-10-10-10-23t10-23l466-466q10-10%2023-10t23%2010l50%2050q10%2010%2010%2023z%22%2F%3E%3C%2Fsvg%3E');
}
.c-chapter__heading.c-chapter__heading--calendar a:last-child {
right: 0;
background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20width%3D%221792%22%20height%3D%221792%22%20viewBox%3D%220%200%201792%201792%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M1171%20960q0%2013-10%2023l-466%20466q-10%2010-23%2010t-23-10l-50-50q-10-10-10-23t10-23l393-393-393-393q-10-10-10-23t10-23l50-50q10-10%2023-10t23%2010l466%20466q10%2010%2010%2023z%22%2F%3E%3C%2Fsvg%3E');
}
.c-chapter__header {
font-weight: bold;
font-family: 'Montserrat', sans-serif;
}
.c-button,
.p-form__actions input[type="submit"] {
display: inline-block;
border: 0;
background-color: #8dc5c6;
-webkit-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.1);
color: #ffffff;
padding: 0 2em;
height: 50px;
line-height: 50px;
cursor: pointer;
font-weight: bold;
-webkit-transition: 0.2s;
transition: 0.2s;
letter-spacing: 0.1em;
outline: 0;
font-family: 'Montserrat', sans-serif;
}
.c-button:hover,
.p-form__actions input[type="submit"]:hover {
-webkit-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.3);
box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.3);
}
.c-button:active,
.p-form__actions input[type="submit"]:active {
-webkit-box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.1);
background-color: #6bb4b5;
}
.c-button.c-button--sm,
.p-form__actions input[type="submit"].c-button--sm {
font-size: 1.4rem;
height: 40px;
line-height: 40px;
}
.c-article {
margin-top: 1em;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-article.c-article--type-thumb {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-left: -30px;
}
}
.c-article__image img {
display: block;
margin-bottom: 1.5em;
}
.c-article__image img[src=""] {
display: none;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-article__image.c-article__image--type-thumb img {
max-width: 250px;
margin-left: 0px;
/****** 佳子テスト 元々 margin-left: 30px; *********/
}
}
.c-article__content {
font-size: 1.4rem;
color: #777777;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.c-article__content.c-article__content--type-thumb {
margin-left: 30px;
-webkit-box-flex: 1;
-ms-flex: 1 0 0%;
flex: 1 0 0%;
}
}
.c-hidden-source {
display: none;
}
.swiper-container {
width: 100%;
padding-bottom: 20px;
overflow-x: hidden;
overflow-y: visible;
margin-bottom: 30px;
}
.swiper-container-horizontal > .swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
bottom: 0;
}
.swiper-pagination-bullet {
opacity: 1;
background-color: #dddddd;
}
.swiper-pagination-bullet-active {
background-color: #222222;
}
#cboxOverlay {
position: fixed;
top: 0;
left: 0;
z-index: 9999;
overflow: visible;
width: 100%;
height: 100%;
background: #fff;
}
#colorbox {
position: absolute;
top: 0;
left: 0;
z-index: 9999;
overflow: visible;
box-sizing: content-box;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
outline: 0;
}
#cboxWrapper {
position: absolute;
top: 0;
left: 0;
z-index: 9999;
overflow: visible;
}
#cboxMiddleLeft,
#cboxBottomLeft {
clear: left;
}
#cboxContent {
box-sizing: content-box;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
position: relative;
overflow: visible;
margin: 0 40px 40px;
background: transparent;
border: 0;
}
#cboxLoadedContent {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
overflow: auto;
-webkit-overflow-scrolling: touch;
margin: auto;
padding: 0;
background: transparent;
}
#cboxTitle {
margin: 0;
position: absolute;
top: -22px;
left: 0;
color: #333;
}
#cboxClose {
background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20width%3D%2210px%22%20height%3D%2210px%22%20viewBox%3D%220%200%2010%2010%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20%3E%20%3Ctitle%3Ecross%3C%2Ftitle%3E%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%20%3Cdefs%3E%3C%2Fdefs%3E%20%3Cg%20id%3D%22top%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill-rule%3D%22evenodd%22%3E%20%3Cg%20id%3D%22sp%2Fdrawer%22%20transform%3D%22translate(-30.000000%2C%20-48.000000)%22%20fill%3D%22%23444%22%20fill-rule%3D%22nonzero%22%3E%20%3Cg%20id%3D%22Group-2%22%20transform%3D%22translate(30.000000%2C%2047.000000)%22%3E%20%3Cpolygon%20id%3D%22cross%22%20points%3D%2210%202.02604317%208.97396484%201%205.00003906%204.97385917%201.02613281%201%200%202.02604317%203.97402344%206.00009766%200%209.97395683%201.02603516%2011%205.00003906%207.02592598%208.97396484%2011%2010%209.97415214%206.02609375%206.00009766%22%3E%3C%2Fpolygon%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
background-size: 20px;
background-position: 0 0;
top: -30px;
outline: 0;
}
#cboxClose:hover {
background-position: 0 0;
}
#cboxPrevious {
background-position: 0 0;
background-size: 40px;
width: 40px;
height: 40px;
background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20fill%3D%22%23444%22%20width%3D%221792%22%20height%3D%221792%22%20viewBox%3D%220%200%201792%201792%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M1203%20544q0%2013-10%2023l-393%20393%20393%20393q10%2010%2010%2023t-10%2023l-50%2050q-10%2010-23%2010t-23-10l-466-466q-10-10-10-23t10-23l466-466q10-10%2023-10t23%2010l50%2050q10%2010%2010%2023z%22%2F%3E%3C%2Fsvg%3E');
left: -40px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
outline: 0;
}
#cboxPrevious:hover {
background-position: 0 0;
}
#cboxNext {
background-position: 0 0;
background-size: 40px;
width: 40px;
height: 40px;
background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20fill%3D%22%23444%22%20width%3D%221792%22%20height%3D%221792%22%20viewBox%3D%220%200%201792%201792%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M1171%20960q0%2013-10%2023l-466%20466q-10%2010-23%2010t-23-10l-50-50q-10-10-10-23t10-23l393-393-393-393q-10-10-10-23t10-23l50-50q10-10%2023-10t23%2010l466%20466q10%2010%2010%2023z%22%2F%3E%3C%2Fsvg%3E');
right: -40px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
outline: 0;
}
#cboxNext:hover {
background-position: 0 0;
}
#cboxSlideshow {
position: absolute;
top: -20px;
overflow: visible;
width: 20px;
height: 20px;
margin: 0;
padding: 0;
background: none;
border: 0;
text-indent: 0;
outline: 0;
}
#cboxLoadingOverlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: transparent;
}
#cboxLoadingGraphic {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: none;
}
.cboxPhoto {
float: left;
margin: auto;
border: 0;
display: block;
max-width: none;
}
/****** 佳子コメントのみ 800px以下スマホで @media screen and (max-width: 800px) *********/
@media only screen and (max-width: 800px) {
#cboxLoadedContent table {
width: 100%;
height: auto;
}
}
/****** 佳子コメントのみ 800px以下スマホで @media screen and (max-width: 800px) *********/
@media only screen and (max-width: 800px) {
#cboxLoadedContent [class^="wysiwyg_template_profile"],
#cboxLoadedContent [class^="wysiwyg_template_profile"] td,
#cboxLoadedContent [class^="wysiwyg_template_profile"] img {
display: block;
max-width: 100%;
height: auto;
padding-left: 0 !important;
padding-right: 0 !important;
}
}
.photo-modal__image img {
display: block;
max-width: 100%;
max-height: 76vh;
margin: auto;
}
.photo-modal-body {
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0 auto;
padding: 16px;
background: #f1f1f1;
color: #333;
}
.photo-modal--photo .photo-modal-body {
display: none;
}
.photo-modal-body__item:empty {
display: none;
}
.photo-modal-body__item + .photo-modal-body__item {
margin: 1em 0 0;
}
.photo-modal-body__item--title {
font-weight: bold;
font-size: 15px;
}
/*
パーツ表示切替用style
*/
.site_description {
}
.shop_name {
}
.shop_tel {
}
.shop_rss {
display: none;
}
.today_area {
}
.qr_area {
display: none;
}
.counter_area {
display: none;
}
.copyright {
}
.powered {
display: none;
}
.l-header {
position: sticky;
top: 0;
z-index: 100;
background-color: #f6f6f6;
color: #222222;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
-webkit-transform: translateY(0%);
transform: translateY(0%);
-webkit-transition: -webkit-transform 0.2s;
transition: -webkit-transform 0.2s;
transition: transform 0.2s;
transition: transform 0.2s, -webkit-transform 0.2s;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-header {
margin-bottom: 0;
background-color: transparent;
position: static;
-webkit-box-shadow: none;
box-shadow: none;
}
}
.l-header a:not([class]) {
color: currentColor;
text-decoration: none;
}
.l-header.l-header--hidden {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-header.l-header--hidden {
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
}
.l-header__inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-header__inner {
padding-top: 35px;
padding-bottom: 50px;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
}
}
.l-header__brand {
display: none;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-header__brand {
display: block;
}
}
.l-header-button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: none;
background: transparent;
font-size: 1.3rem;
height: 56px;
line-height: 56px;
padding: 0;
font-weight: bold;
white-space: nowrap;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-header-button {
display: none;
}
}
.l-header-button__icon {
width: 16px;
height: 16px;
color: currentColor;
vertical-align: -0.25em;
margin-right: 0.5em;
}
.l-header-social {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
margin: 5px 0;
padding: 0;
width: auto;
}
.l-header-social__item {
list-style: none;
margin-left: 0.5em;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-header-social__item {
margin-left: 0.8em;
}
}
.l-header-social__item:first-child {
margin-left: 0;
}
.l-header-social__icon {
display: block;
}
.l-drawer {
height: 100vh;
width: 80%;
max-width: 400px;
position: fixed;
top: 0;
left: 0;
background: #f6f6f6;
-webkit-transition: -webkit-transform 0.2s;
transition: -webkit-transform 0.2s;
transition: transform 0.2s;
transition: transform 0.2s, -webkit-transform 0.2s;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
z-index: 2000;
overflow-y: scroll;
color: #777777;
opacity: 0;
padding: 10px 30px;
font-weight: bold;
-webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
}
.l-drawer__icon {
width: 13px;
height: 13px;
vertical-align: -0.2em;
margin-right: 0.2em;
fill: currentColor;
}
.l-drawer__close {
display: block;
font-size: 1.2rem;
margin: 20px 0;
}
.l-drawer-state:checked ~ [for="l-drawer-state"] {
z-index: 1000;
opacity: 1;
}
.l-drawer-state:checked ~ [for="l-drawer-state"] ~ .l-drawer {
-webkit-transform: translateX(0%);
transform: translateX(0%);
opacity: 1;
}
.l-modal__wrapper {
position: fixed;
z-index: 9998;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.l-modal {
position: absolute;
margin: 0px auto;
-webkit-transition: all 0.2s;
transition: all 0.2s;
position: fixed;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: -1;
opacity: 0;
background-color: #fff;
-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
max-height: 90vh;
overflow-y: auto;
}
.l-modal__container {
position: relative;
width: 300px;
padding: 30px;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-modal__container {
width: 640px;
padding: 50px 40px 50px 50px;
}
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-modal__body {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
.l-modal__image {
text-align: center;
width: 100px;
margin: 0 auto 10px;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-modal__image {
margin: 0 30px 0 0;
}
}
.l-modal__image img {
display: block;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-modal__content {
-webkit-box-flex: 1;
-ms-flex: 1 0 0%;
flex: 1 0 0%;
}
}
.l-modal__content h2 {
margin: 0 0 10px;
font-size: 2rem;
font-weight: normal;
}
.l-modal__text {
margin: 0;
font-size: 1.4rem;
}
.l-modal__close-button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: none;
position: absolute;
top: 20px;
right: 20px;
padding: 0;
cursor: pointer;
}
.l-modal-state:checked ~ [for="l-modal-state"] {
z-index: 1000;
opacity: 1;
}
.l-modal-state:checked ~ [for="l-modal-state"] ~ .l-modal {
opacity: 1;
z-index: 2000;
}
.l-side {
display: none;
position: relative;
top: -10px;
-webkit-box-flex: 0;
-ms-flex: 0 0 200px;
flex: 0 0 200px;
margin-right: 30px;
margin-bottom: 50px;
font-family: 'Montserrat', sans-serif;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-side {
display: block;
}
}
/****** 佳子コメントのみ 769px以上大きいPCで @media screen and (min-width:961px) *********/
@media only screen and (min-width: 961px) {
.l-side {
-webkit-box-flex: 0;
-ms-flex: 0 0 250px;
flex: 0 0 250px;
margin-right: 60px;
}
}
.l-side nav {
background-color: #f6f6f6;
-webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
position: sticky;
margin-top: 10px;
top: 10px;
color: #777777;
padding: 10px 15px 10px 30px;
}
.l-main {
-webkit-box-flex: 1;
-ms-flex: 1 0 0%;
flex: 1 0 0%;
min-width: 0;
}
.l-sub-footer {
background-color: #f6f6f6;
padding-top: 30px;
padding-bottom: 30px;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-sub-footer {
padding-top: 60px;
padding-bottom: 60px;
}
}
.l-footer {
background-color: #eaeeef;
color: #769097;
text-align: center;
}
.l-footer p {
font-size: 1.2rem;
margin-top: 0;
margin-bottom: 0;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.l-footer p {
font-size: 1.4rem;
}
}
.l-footer a {
color: currentColor;
}
.l-footer__inner {
position: relative;
padding-top: 15px;
padding-bottom: 15px;
}
.l-footer__pagetop {
position: absolute;
right: 16px;
top: -25px;
font-size: 1rem;
text-transform: uppercase;
-webkit-transition: 0.2s;
transition: 0.2s;
}
.l-footer__pagetop:hover {
top: -30px;
}
.l-footer__pagetop a {
color: currentColor;
display: block;
line-height: 30px;
text-decoration: none;
padding: 0 1em 0 0.8em;
background-color: #eaeeef;
}
.l-footer__pagetop .c-icon {
vertical-align: -0.3em;
fill: currentColor;
}
.p-global-nav {
padding-left: 0;
list-style: none;
font-size: 1.4rem;
}
.p-global-nav:first-of-type {
font-size: 1.6rem;
}
.p-global-nav:first-of-type::before,
.p-global-nav:first-of-type::after {
content: '';
width: 40px;
height: 2px;
display: block;
background-color: rgba(0, 0, 0, 0.2);
margin: 28px 0;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-global-nav:first-of-type::before {
display: none;
}
}
.p-global-nav:last-child {
margin: 0;
}
.p-global-nav > li {
margin: 15px 0;
font-weight: bold;
position: relative;
}
.p-global-nav > li.active::before {
position: absolute;
content: '-';
left: -1em;
}
.p-global-nav__item {
text-decoration: none;
color: currentColor;
display: block;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-global-nav__item span {
position: relative;
cursor: pointer;
display: inline-block;
}
.p-global-nav__item span::after {
position: absolute;
content: '';
width: 0;
height: 2px;
background-color: currentColor;
-webkit-transition: 0.2s;
transition: 0.2s;
bottom: -3px;
left: 0;
}
.p-global-nav__item:hover span::after {
width: 100%;
}
}
.p-global-nav__qr {
visibility: hidden;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-global-nav__qr {
visibility: visible;
}
}
.sub_navi {
padding-left: 0;
list-style: none;
}
.sub_navi li {
padding-left: 0.8em;
position: relative;
margin: 0.2em 0;
font-size: 1.4rem;
}
.sub_navi li::before {
content: '-';
position: absolute;
left: 0;
}
.sub_navi a {
color: currentColor;
text-decoration: none;
}
.p-brand__name {
text-align: center;
font-size: 2rem;
margin: 0;
font-family: 'Montserrat', sans-serif;
}
.p-brand__name a {
text-align: center;
color: currentColor;
text-decoration: none;
position: relative;
}
.p-brand__name a:hover {
text-align: center;
opacity: 0.9;
}
.p-brand__description {
font-size: 1.2rem;
color: #888888;
font-weight: bold;
}
.p-counter {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
text-align: center;
margin: 10px auto 25px;
}
.p-counter__unit {
width: 90px;
}
.p-counter__unit:last-child .p-counter__value {
border-right: 0;
}
.p-counter__label {
font-size: 1rem;
text-transform: uppercase;
}
.p-counter__value {
font-size: 1.2rem;
margin: 0;
border-right: 2px solid #a2b3b8;
font-family: 'Montserrat', sans-serif;
}
.p-photo-list {
list-style: none;
padding: 0;
margin: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.p-photo-list.p-photo-list--swiper {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-photo-list.p-photo-list--swiper {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.p-photo-list__unit {
max-width: 280px;
width: 100%;
margin-top: 0;
margin-bottom: 1em;
position: relative;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-photo-list__unit {
max-width: 30%;
margin-right: 20px;
}
.p-photo-list__unit:nth-child(3n) {
margin-right: 0;
}
}
.p-photo-list__unit.p-photo-list__unit--small {
max-width: 30%;
margin-right: 5%;
}
.p-photo-list__unit.p-photo-list__unit--small:nth-child(3n) {
margin-right: 0;
}
.p-photo-list__image {
border: 8px solid #f7f7f7;
background-color: #f7f7f7;
position: relative;
}
.p-photo-list__image::after {
content: '';
display: block;
padding-top: 100%;
top: 0;
}
.p-photo-list__image a {
display: block;
width: 100%;
height: 100%;
outline: 0;
-webkit-transition: 0.2s;
transition: 0.2s;
}
.p-photo-list__image a:hover {
background-color: #f2f2f2;
-webkit-box-shadow: 10px 10px 0 #f2f2f2, -10px -10px 0 #f2f2f2, 10px -10px 0 #f2f2f2, -10px 10px 0 #f2f2f2;
box-shadow: 10px 10px 0 #f2f2f2, -10px -10px 0 #f2f2f2, 10px -10px 0 #f2f2f2, -10px 10px 0 #f2f2f2;
}
.p-photo-list__image img {
position: absolute;
margin: auto;
top: 0;
right: 0;
bottom: 0;
left: 0;
max-width: 100%;
max-height: 100%;
}
.p-photo-list__image-inner {
width: 100%;
height: 100%;
position: absolute;
top: 0;
}
.p-photo-list__title {
margin-top: 0.8em;
margin-bottom: 0;
color: #777777;
font-size: 1.2rem;
line-height: 1.2;
}
/****** 佳子コメントのみ 961px以上大きいPCで @media screen and (min-width:961px) *********/
@media only screen and (min-width: 961px) {
.p-photo-list__title {
font-size: 1.4rem;
}
}
.p-pager {
margin-top: 40px;
margin-bottom: 40px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
font-size: 12px;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-pager {
font-size: 14px;
}
}
/****** 佳子コメントのみ 961px以上大きいPCで @media screen and (min-width:961px) *********/
@media only screen and (min-width: 961px) {
.p-pager {
font-size: 16px;
}
}
.p-pager a {
margin-right: 2px;
margin-left: 2px;
padding: 0 0.5em;
text-decoration: none;
color: currentColor;
font-weight: bold;
font-family: 'Montserrat', sans-serif;
-webkit-transition: 0.2s;
transition: 0.2s;
border-bottom: 2px solid transparent;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-pager a {
margin-right: 5px;
margin-left: 5px;
}
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-pager a {
padding: 0.3em 0.8em;
}
}
.p-pager a:hover {
border-color: #8dc5c6;
}
.p-pager a.chk {
color: #777777;
background-color: #f6f6f6;
}
.p-pager a.chk:hover {
cursor: default;
border-color: transparent;
}
.p-form .reservation_area,
.p-form .contact_area {
margin-bottom: 1.4em;
}
.p-form .reservation_area > label,
.p-form .contact_area > label {
display: block;
font-size: 1.4rem;
color: #777777;
margin-bottom: 0.5em;
}
.p-form .reservation_area > br,
.p-form .contact_area > br {
display: none;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-form input[type="text"],
.p-form input[type="tel"],
.p-form input[type="email"] {
max-width: 300px;
}
}
.p-form input[type="text"].contact_medium,
.p-form input[type="tel"].contact_medium,
.p-form input[type="email"].contact_medium {
max-width: 600px;
}
.p-form textarea {
height: 10em;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-form textarea {
max-width: 600px;
}
}
.p-form input[type="text"],
.p-form input[type="tel"],
.p-form input[type="email"],
.p-form textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: 0;
-webkit-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.1);
background-color: #f6f6f6;
padding: 0.6em 0.5em;
outline: 0;
-webkit-transition: 0.2s;
transition: 0.2s;
position: relative;
width: 100%;
display: block;
border-radius: 0;
}
.p-form input[type="text"]:focus,
.p-form input[type="tel"]:focus,
.p-form input[type="email"]:focus,
.p-form textarea:focus {
-webkit-box-shadow: inset 0 -2px 0 #8dc5c6;
box-shadow: inset 0 -2px 0 #8dc5c6;
}
.p-form select {
display: inline-block;
padding: 0.4rem 2.5rem 0.4rem 0.75rem;
height: calc(4rem);
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: auto !important;
overflow: hidden;
max-width: 100%;
border: 0;
position: relative;
border-radius: 0;
outline: 0;
-webkit-transition: 0.2s;
transition: 0.2s;
background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22%23444%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M12%200l8%2010h-16l8-10zm8%2014h-16l8%2010%208-10z%22%2F%3E%3C%2Fsvg%3E');
background-size: 12px;
background-repeat: no-repeat;
background-position: right 0.75rem center;
background-color: #f6f6f6;
cursor: pointer;
}
.p-form select::-ms-expand {
display: none;
}
.p-form select:focus {
-webkit-box-shadow: inset 0 -2px 0 #8dc5c6;
box-shadow: inset 0 -2px 0 #8dc5c6;
}
.p-form .radio,
.p-form .checkbox {
display: block;
margin-bottom: 1em;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-form .radio,
.p-form .checkbox {
margin-bottom: 0.5em;
}
}
.p-form .radio input,
.p-form .checkbox input {
display: none;
}
.p-form .radio input:checked + label,
.p-form .checkbox input:checked + label {
font-weight: bold;
}
.p-form .radio input:checked + label::before,
.p-form .checkbox input:checked + label::before {
border-color: transparent;
background-color: #8dc5c6;
}
.p-form .radio input:checked + label::after,
.p-form .checkbox input:checked + label::after {
visibility: visible;
}
.p-form .radio label,
.p-form .checkbox label {
color: #777777;
cursor: pointer;
position: relative;
padding-left: 30px;
display: inline-block;
vertical-align: middle;
line-height: 1.2;
}
.p-form .radio label::before,
.p-form .checkbox label::before {
content: '';
position: absolute;
left: 0;
top: -3px;
display: inline-block;
width: 20px;
height: 20px;
background-color: #fff;
border: 2px solid rgba(0, 0, 0, 0.1);
vertical-align: -0.2em;
}
.p-form .radio label::before {
border-radius: 100%;
}
.p-form .radio label::after {
content: '';
position: absolute;
left: 5px;
top: 2px;
display: inline-block;
visibility: hidden;
width: 14px;
height: 14px;
background-color: #fff;
border-radius: 100%;
}
.p-form .checkbox label::after {
content: '';
position: absolute;
left: 9px;
top: 2px;
display: inline-block;
visibility: hidden;
width: 4px;
height: 9px;
border-right: 3px solid #fff;
border-bottom: 3px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.p-form__message {
margin: 40px 0;
text-align: center;
color: #777777;
line-height: 2;
font-size: 1.4rem;
}
.p-form__message::before,
.p-form__message::after {
display: block;
margin-right: auto;
margin-left: auto;
content: '';
width: 80px;
height: 2px;
background-color: #dddddd;
}
.p-form__message::before {
margin-bottom: 30px;
}
.p-form__message::after {
margin-top: 30px;
}
.p-form__note {
font-size: 1.2rem;
margin: 0;
max-width: 600px;
color: #777777;
}
.p-form__note h3 {
margin: 0 0 0.5em;
}
.p-form__note p {
margin-bottom: 0;
}
.p-form__actions {
margin-top: 1.5em;
margin-bottom: 30px;
}
.wysiwyg {
overflow-x: auto;
}
.wysiwyg::after {
content: '';
display: block;
clear: both;
}
.wysiwyg > *:first-child {
margin-top: 0;
}
.wysiwyg > *:last-child {
margin-bottom: 0;
}
.wysiwyg p {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
.wysiwyg a {
color: #8dc5c6;
}
.wysiwyg table {
table-layout: fixed;
border-collapse: collapse;
}
.wysiwyg iframe {
max-width: 100%;
}
.wysiwyg-table {
overflow-x: auto;
}
.wysiwyg-table::-webkit-scrollbar {
height: 8px;
}
.wysiwyg-table::-webkit-scrollbar-track {
background-color: #f6f6f6;
}
.wysiwyg-table::-webkit-scrollbar-thumb {
background-color: #dddddd;
border-radius: 4px;
}
.wysiwyg_template_profile1,
.wysiwyg_template_profile2 {
display: block;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.wysiwyg_template_profile1,
.wysiwyg_template_profile2 {
display: table;
}
}
.wysiwyg_template_profile1 tr,
.wysiwyg_template_profile2 tr {
display: block;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.wysiwyg_template_profile1 tr,
.wysiwyg_template_profile2 tr {
display: table-row;
}
}
.wysiwyg_template_profile1 td,
.wysiwyg_template_profile2 td {
display: block;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.wysiwyg_template_profile1 td,
.wysiwyg_template_profile2 td {
display: table-cell;
}
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.wysiwyg_template_profile1 img,
.wysiwyg_template_profile2 img {
max-width: initial;
}
}
#navi_parts {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin-right: -10px;
margin-left: -10px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.navi_parts_detail {
margin-right: 10px;
margin-left: 10px;
margin-bottom: 20px;
}
.p-top-brand {
text-align: center;
padding: 25px 0;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-top-brand {
display: none;
}
}
.p-top-slider-container {
margin-bottom: 0;
}
.p-top-slider__unit {
max-width: 1200px;
}
.p-top-slider__image {
position: relative;
}
.p-top-slider__image::after {
content: '';
display: block;
padding-top: 50%;
top: 0;
}
.p-top-slider__image img {
position: absolute;
margin: auto;
top: 0;
right: 0;
bottom: 0;
left: 0;
max-width: 100%;
max-height: 100%;
}
.p-top-slider__image-inner {
width: 100%;
height: 100%;
position: absolute;
top: 0;
}
.p-top-slider__text {
margin: 0.5em 0 0;
text-align: center;
color: currentColor;
font-size: 1.2rem;
color: #777777;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-top-slider__text {
font-size: 1.6rem;
}
}
.p-top-slider__button {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
display: none;
z-index: 10;
cursor: pointer;
background-color: rgba(255, 255, 255, 0.3);
-webkit-transition: 0.2s;
transition: 0.2s;
}
.p-top-slider__button:hover {
-webkit-transform: translateY(-50%) scale(1.2);
transform: translateY(-50%) scale(1.2);
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-top-slider__button {
display: block;
}
.p-top-slider__button.swiper-button-lock {
display: none;
}
}
.p-top-slider__button.p-top-slider__button--next {
right: 0;
}
/****** 佳子コメントのみ 961px以上大きいPCで @media screen and (min-width:961px) *********/
@media only screen and (min-width: 961px) {
.p-top-slider__button.p-top-slider__button--next {
right: 20px;
}
}
.p-top-slider__button.p-top-slider__button--prev {
left: 0;
}
/****** 佳子コメントのみ 961px以上大きいPCで @media screen and (min-width:961px) *********/
@media only screen and (min-width: 961px) {
.p-top-slider__button.p-top-slider__button--prev {
left: 20px;
}
}
.p-top-slider__icon {
width: 50px;
height: 50px;
display: block;
fill: #222222;
}
.p-top-message {
font-size: 1.2rem;
line-height: 2;
margin-top: 20px;
margin-bottom: 40px;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-top-message {
font-size: 1.6rem;
}
}
.p-top-info-list {
list-style: none;
padding: 0;
margin: 0;
}
.p-top-info-list__label {
color: #fff;
background-color: #222222;
display: inline-block;
padding: 0.1em 0.5em;
margin-right: 0.5em;
font-weight: bold;
}
.p-top-info-list__item {
margin-bottom: 0.5em;
}
.p-top-info-list__date {
font-size: 1.2rem;
display: block;
margin-bottom: 0.3em;
}
.p-top-info-list__link {
font-weight: bold;
text-decoration: none;
color: #8dc5c6;
}
.p-top-info-list__link:hover {
text-decoration: underline;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-top-photo {
padding-bottom: 0;
margin-bottom: -20px;
}
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-top-photo__pagination {
display: none;
}
}
.p-top-about {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
/****** 佳子コメントのみ 961px以上大きいPCで @media screen and (min-width:961px) *********/
@media only screen and (min-width: 961px) {
.p-top-about {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
}
}
.p-top-about__map {
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
margin-right: -15px;
margin-bottom: 25px;
margin-left: -15px;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-top-about__map {
margin-right: 0;
margin-left: 0;
}
}
/****** 佳子コメントのみ 961px以上大きいPCで @media screen and (min-width:961px) *********/
@media only screen and (min-width: 961px) {
.p-top-about__map {
margin-right: 30px;
margin-bottom: 0;
}
}
.p-top-about__map iframe {
display: block;
width: 100%;
}
/****** 佳子コメントのみ 961px以上大きいPCで @media screen and (min-width:961px) *********/
@media only screen and (min-width: 961px) {
.p-top-about__map iframe {
width: 300px;
}
}
.p-top-about__body {
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
}
/****** 佳子コメントのみ 961px以上大きいPCで @media screen and (min-width:961px) *********/
@media only screen and (min-width: 961px) {
.p-top-about__body {
-webkit-box-flex: 1;
-ms-flex: 1 0 0%;
flex: 1 0 0%;
}
}
.p-top-about__content {
font-size: 1.4rem;
}
.p-footer-contact {
background-color: #f6f6f6;
padding: 30px 0;
margin-top: 0;
margin-bottom: 0;
}
.p-footer-contact .c-container {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-footer-contact .c-container {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
}
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-footer-contact {
padding-top: 60px;
padding-bottom: 60px;
}
}
.p-footer-contact input[type="text"],
.p-footer-contact textarea,
.p-footer-contact select {
background-color: #fff;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-footer-contact__heading {
width: 200px;
margin-right: 30px;
margin-bottom: 0;
}
}
/****** 佳子コメントのみ 961px以上大きいPCで @media screen and (min-width:961px) *********/
@media only screen and (min-width: 961px) {
.p-footer-contact__heading {
-webkit-box-flex: 0;
-ms-flex: 0 0 250px;
flex: 0 0 250px;
margin-right: 60px;
}
}
.p-footer-contact__body {
-webkit-box-flex: 1;
-ms-flex: 1 0 0%;
flex: 1 0 0%;
}
#top .c-section:first-of-type {
margin-top: 40px;
}
.table_calendar {
margin-top: 30px;
font-family: 'Montserrat', sans-serif;
}
.table_calendar th {
width: 14.28571429%;
font-size: 1rem;
text-align: left;
padding: 0 0.4em 0 0;
border-bottom: 1px solid #f6f6f6;
text-align: right;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.table_calendar th {
font-size: 1.2rem;
}
}
.table_calendar td {
position: relative;
text-align: right;
height: 70px;
padding: 0.4em 0 0;
border-bottom: 1px solid #f6f6f6;
}
.table_calendar td p {
margin-top: 0;
margin-right: 0.1em;
margin-bottom: 0;
}
.table_calendar td img {
display: block;
margin-top: 0.2em;
margin-right: 0;
margin-left: auto;
}
.table_calendar .sun,
.table_calendar .sat,
.table_calendar .holiday {
color: #777777;
font-weight: bold;
}
.p-calendar-label {
font-size: 1.2rem;
display: inline-block;
padding: 0.1em 0.5em;
background-color: #8dc5c6;
color: #fff;
font-weight: bold;
margin-right: 0.5em;
}
.p-calendar-list {
margin-bottom: 50px;
border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.p-calendar-list dd {
margin-left: 0;
}
.p-calendar-list__item {
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
padding: 20px 10px 18px;
}
.p-calendar-list__date {
color: #777777;
font-size: 1.8rem;
margin-bottom: 5px;
font-family: 'Montserrat', sans-serif;
}
.p-calendar-list__link {
color: #8dc5c6;
font-weight: bold;
text-decoration: none;
}
.hotspot {
cursor: pointer;
}
#tt {
position: absolute;
display: block;
}
#ttcont {
display: block;
padding: 0.5em 0.7em;
margin-left: 5px;
background: #ffffff;
color: #333;
border-radius: 6px 6px 6px 0;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
#ttcont .schedule_title {
font-size: 13px;
}
#ttcont .schedule_body {
font-size: 11px;
}
#tttop {
display: none;
}
#ttbot {
display: none;
}
.p-print-link {
color: #777777;
text-align: right;
}
.p-print-link a {
text-decoration: none;
color: currentColor;
position: relative;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-print-link a::after {
content: '';
display: block;
position: absolute;
bottom: -3px;
left: 0;
width: 0;
height: 1px;
background-color: #777777;
-webkit-transition: 0.2s;
transition: 0.2s;
}
.p-print-link a:hover::after {
width: 100%;
}
}
.p-print-link .c-icon {
vertical-align: -0.3em;
fill: #777777;
}
.p-coupon__button-layout {
margin-top: 20px;
}
.p-coupon__detail {
font-size: 1.4rem;
margin: 0;
}
.p-coupon__detail dt {
font-weight: bold;
font-size: 1.2rem;
color: #777777;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-coupon__detail dt {
float: left;
clear: left;
}
}
.p-coupon__detail dd {
margin-left: 0;
margin-bottom: 0.5em;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-coupon__detail dd {
padding-left: 5em;
}
}
.p-menu__price {
font-family: 'Montserrat', sans-serif;
font-weight: bold;
margin-bottom: 0.5em;
font-size: 1.6rem;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-menu__price {
float: right;
}
}
.p-menu__price span {
font-size: 0.8em;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-menu__body {
float: left;
}
}
.p-about__table {
margin-bottom: 50px;
}
.p-about__table table {
display: block;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-about__table table {
display: table;
border-top: 1px solid #f6f6f6;
}
}
.p-about__table tr {
display: block;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-about__table tr {
display: table-row;
}
}
.p-about__table th {
display: block;
text-align: left;
font-size: 1.4rem;
color: #777777;
font-weight: bold;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-about__table th {
font-weight: normal;
display: table-cell;
text-align: right;
width: 30%;
padding-top: 0.8em;
padding-right: 1.5em;
padding-bottom: 0.8em;
border-bottom: 1px solid #f6f6f6;
}
}
.p-about__table td {
display: block;
margin-bottom: 1.5em;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-about__table td {
display: table-cell;
border-bottom: 1px solid #f6f6f6;
padding-top: 0.8em;
padding-bottom: 0.8em;
}
}
.staff_wrap {
padding-top: 30px;
border-top: 1px solid #f6f6f6;
}
.staff_wrap:first-of-type {
border-top: 0;
}
.staff__text__social_icon {
color: #222222;
}
.p-reservation-header {
color: #777777;
font-size: 1.4rem;
}
.p-reservation-header__tel {
font-size: 2.8rem;
color: #222222;
}
.p-reservation-header__tel a {
color: #8dc5c6;
}
.p-reservation-header__tel-time {
color: #222222;
display: block;
}
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
@media only screen and (min-width: 769px) {
.p-reservation-header__tel-time {
display: inline;
}
.p-reservation-header__tel-time::before {
content: '（';
}
.p-reservation-header__tel-time::after {
content: '）';
}
}
.p-reservation-course__content {
color: #777777;
font-size: 1.4rem;
}
.reservation_course_name {
font-size: 1.2rem;
color: #777777;
padding: 0.3em 0.6em 0.1em 0.8em;
border: 1px solid #777777;
text-decoration: none;
margin-left: 1em;
-webkit-transition: 0.2s;
transition: 0.2s;
white-space: nowrap;
}
.reservation_course_name:hover {
color: #222222;
border-color: #222222;
}
.reservation_course_name::after {
content: '▼';
margin-left: 0.5em;
}
.reservation_course_body {
margin-bottom: 2rem;
margin-left: 10px;
padding-top: 1rem;
padding-left: 18px;
padding-bottom: 1rem;
border-left: 2px solid #777777;
color: #777777;
}
.reservation_course_body *:first-child {
margin-top: 0;
}
.reservation_course_body *:last-child {
margin-bottom: 0;
}
.p-minne-gallery {
word-wrap: break-word;
overflow-wrap: break-word;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-minne-gallery {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.p-minne-item {
margin: 0 0 2em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-minne-item {
display: block;
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
width: 30%;
margin-right: 5%;
}
.p-minne-item:nth-child(3n) {
margin-right: 0;
}
}
.p-minne-item__image-wrap {
-ms-flex-preferred-size: 100px;
flex-basis: 100px;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
margin-right: 0.5em;
border: 8px solid #f7f7f7;
background-color: #f7f7f7;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-minne-item__image-wrap {
margin-right: 0;
}
}
.p-minne-item__image {
display: block;
height: 0;
padding-top: 100%;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
-webkit-transition: 0.2s;
transition: 0.2s;
}
.p-minne-item__image:hover {
background-color: #f2f2f2;
-webkit-box-shadow: 10px 10px 0 #f2f2f2, -10px -10px 0 #f2f2f2, 10px -10px 0 #f2f2f2, -10px 10px 0 #f2f2f2;
box-shadow: 10px 10px 0 #f2f2f2, -10px -10px 0 #f2f2f2, 10px -10px 0 #f2f2f2, -10px 10px 0 #f2f2f2;
}
.p-minne-item__image img {
display: none;
}
.p-minne-item__caption {
line-height: 1.4;
min-width: 0;
}
.p-minne-item__title {
text-decoration: none;
display: block;
line-height: 1.3;
color: #8dc5c6;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-minne-item__title {
margin-top: 0.5em;
}
}
.p-minne-item__title:hover {
text-decoration: underline;
}
.p-minne-item__price {
display: block;
font-size: 0.8em;
margin-top: 0.2em;
text-align: right;
}
/****** 佳子コメントのみ 481px以上小さいスマホで @media screen and (min-width:481px) *********/
@media only screen and (min-width: 481px) {
.p-minne-item__price {
text-align: left;
}
}
.p-minne-message {
margin: 40px 0;
text-align: center;
color: #777777;
line-height: 2;
font-size: 1.4rem;
}
.p-minne-message::before,
.p-minne-message::after {
display: block;
margin-right: auto;
margin-left: auto;
content: '';
width: 80px;
height: 2px;
background-color: #dddddd;
}
.p-minne-message::before {
margin-bottom: 30px;
}
.p-minne-message::after {
margin-top: 30px;
}
.shop_sitename {
font-size: 100%;
}
/****************** ここから下は佳子が設定したもの *****************/
/****** 佳子コメントのみ 769px以上PCで @media screen and (min-width:769px) *********/
/****** スマホのみ改行
769px以上PCで無効にする ********/
@media screen and (min-width: 769px){
.br-sp {display: none; }
}
/****** スマホのみ表示(スペースなどをスマホのみ入れる時などに使う)
769px以上PCで無効にする *********/
@media screen and (min-width:769px){
.sp{display: none !important;}
}
/****** pcのみ表示(あまり使わないと思われる。pcをデフォルトにする為。あまりdisplay: noneを使うとSEO的に良くない為。) 768px以下スマホで無効にする ********/
@media screen and (max-width:768px){
.pc{display: none !important;}
}
画像URL
デザイン名変更
Silk（コピー）編集後
もどる
